SectionsBundlesPricingFAQBlogAboutContactContactInstall on Shopify
All changelog entriesentry 2 of 116
fix· 12 days ago

Header Pill: pages could stop scrolling until you reloaded

With the cart drawer open, anything that re-rendered the header left the page locked and unscrollable with nothing on screen to explain it. The lock now releases itself, and the sticky repair no longer interferes with your theme.

A merchant told us that with our header enabled, their store would stop scrolling as they moved between pages, and the only way to get it back was to reload. Turning the header off fixed it.

They were right, it was our bug, and there were two of them.

The page could be left locked with nothing to explain it

When you open the cart drawer, the header locks the page behind it so the drawer scrolls instead of the page underneath. That is correct, and every store does it.

The problem was who owned the lock. It was applied and removed by one piece of code tied to that one copy of the header. If anything replaced the header markup while the drawer was open, that code disappeared and the lock stayed behind.

Plenty of ordinary things replace the header. A theme with page transitions does it on every navigation. A theme or app that refreshes the cart count does it too, and our own quantity buttons trigger exactly the kind of cart event that such code listens for.

The result was a page that could not be scrolled, with no drawer visible to close and nothing on screen to explain it. Only a reload cleared it.

The lock is no longer owned by anything. It is now worked out from the page itself: is there a cart drawer open right now, with working controls behind it? Nothing is remembered, so nothing can be left behind. If a re-render leaves a drawer that only looks open, it is closed rather than trusted, so you can never be stranded behind a drawer that will not respond.

The sticky fix was interfering with themes

The repair we shipped last week to keep the header sticky was too heavy handed with the rest of the page.

If a theme was in the middle of an animation, our repair cancelled it outright and never put it back. On themes that unlock scrolling when their page animation finishes, that animation now never finished, so the page stayed locked. A short animation like that ends on its own in half a second, so the header now simply waits it out instead of interfering.

It could also switch off scrolling on themes that scroll an inner container rather than the page, because it was looking for one specific Shopify theme's naming and walked straight past everything else. It now recognises the general pattern, never touches the part of the page that does the scrolling, and undoes anything that did not actually help.

What to do

Open Header Pill in the app and choose Update to latest. Your settings are kept. The same update applies to Header Commerce, which shares the sticky code.