I Installed Two Review Apps and My Checkout Died

The Setup

I've been running a Shopify store for about 18 months. Steady traffic, 30-50 orders a day. Nothing massive, but enough to notice when things break.

Last month I decided to upgrade my product reviews. I had one review app already installed — let's call it ReviewApp A — but wanted something with photo reviews and a carousel widget. So I installed ReviewApp B alongside it, planning to migrate everything over and then uninstall A.

That was the mistake. Having both active at the same time, even for a day.

What Went Wrong

The next morning, I woke up to three angry emails from customers who couldn't complete their orders. They'd add items to cart, go to checkout, and... nothing. The page would load but the "Complete Order" button did absolutely nothing when clicked.

I checked the store myself — worked fine on my end. Because I was logged in as admin, and the conflict only affected logged-out visitors. That's the part that almost made me dismiss it as "customer problem."

The Hunt

Four hours of debugging. Here's what I tried:

• Browser console check: Opened the store in incognito → DevTools → Console. Saw this:
  Uncaught TypeError: Cannot read properties of undefined (reading 'addEventListener')
  Something was trying to attach a click handler to an element that didn't exist on the checkout page.
• App-by-app disable: Went through every app one at a time, disabling each and retesting checkout. This was slow and painful — 12 apps installed.
• Found it: Both ReviewApp A and ReviewApp B were injecting JavaScript that tried to modify the same DOM element on the checkout page. App A's script ran first and removed the element. App B's script ran second, couldn't find the element, and crashed silently — taking the entire checkout button event handler with it.

The Fix

Once I identified the culprit, the fix was straightforward:

1. Uninstalled ReviewApp A immediately (I was migrating anyway)
2. Cleared my browser cache and tested checkout in incognito — worked instantly
3. Emailed both app developers with the console error logs

Total cost: about $400-600 in lost orders (based on my average daily revenue), plus 4 hours of my life I'll never get back.

How to Prevent This

1. Never run two apps of the same category simultaneously

Two review apps. Two popup apps. Two email capture apps. Each one is injecting JavaScript into your storefront. When two scripts target the same page element, one of them will break — and it usually breaks silently.

2. Test checkout after EVERY app install or update

Not just "visit the store." Actually go through the full checkout flow in an incognito window. Add to cart → checkout → fill in details → try to complete payment. Every. Single. Time.

3. Check your browser console regularly

Open your store in incognito → right-click → Inspect → Console tab. Red errors = potential customer-facing issues. Do this once a week, or after any theme/app change.

4. Know which apps inject front-end JavaScript

Not all apps do. But review widgets, popup tools, email capture forms, countdown timers, and trust badges almost always do. These are the highest-risk categories for conflicts.

The Bigger Picture

This isn't a rare edge case. Shopify stores average 6-10 apps. Every new install increases the probability of a conflict. Most merchants don't know there's a problem until a customer tells them — or worse, until they notice revenue dropping and can't figure out why.

If you run more than 5 apps, you almost certainly have a conflict you don't know about. The question is whether it's breaking something critical or just slowing down a page somewhere.