Open danhemerlein opened 2 months ago
Thanks for reporting this @danhemerlein. The screen recording was super helpful.
Can you confirm env.PUBLIC_CHECKOUT_DOMAIN
is set?
I'm able to replicate inconsistencies when env.PUBLIC_CHECKOUT_DOMAIN
isn't set. Feels like a race condition (can only consistently replicate when throttling a hard refresh). Always fires when navigating regardless of env var.
cc) @wizardlyhel
hey @scottdixon, thanks very much for looking into this. I did not have env.PUBLIC_CHECKOUT_DOMAIN
set and, you're right, setting that variable does alleviate the bug in most scenarios.
However, even with the env var now set, it still seems like the callback or event are not running on the very first time the site is loaded in a new tab or window. The site exhibits the same behavior from the screen recording where there's no console.log on initial page load but both page view events do run once the site is navigated once or refreshed. I agree that it feels like a race condition.
Here's a screen recording of the behavior I'm seeing now that I've set the variable https://s.chord.co/X6ujDd71
What is the location of your example repository?
You can create a new Hydrogen project and it will have this issue. Please see the Steps to Reproduce.
Which package or tool is having this issue?
Hydrogen
What version of that package or tool are you using?
2024.7.4
What version of Remix are you using?
2.10.1
Steps to Reproduce
npm create @shopify/hydrogen@latest -- --quickstart
cd hydrogen-quickstart && npm run dev
app/components/ThirdPartyAnalyticsIntegration.tsx
export function ThirdPartyAnalyticsIntegration() { const {subscribe, register} = useAnalytics(); const {ready} = register('Third Party Analytics Integration');
useEffect(() => { subscribe('page_viewed', (data) => { console.log('ThirdPartyAnalyticsIntegration - Page viewed:', data); });
}, []);
return null; }
<Analytics.Provider cart={data.cart} shop={data.shop} consent={data.consent}
I want to note that I followed these docs to link a Shopify store. So I'm not using mock.shop
notes on my environment: Node -
v21.7.3
npm -10.5.0
Expected Behavior
The
page_viewed
event should fire and call its callback when the page is viewed for the first time in a new tab or window.Actual Behavior
Open browser console, the trace statement from the
page_viewed
callback does not appear on hard refresh, but does appear on soft refresh and normal page navigation. Thepage_viewed
does not fire when the site is viewed from a new tab or window. However, the initial page view event will fire when you navigate to another page. This behavior is demonstrated in this video:https://share.zight.com/QwuJYpGR
Additional Context:
Based on our experience with when this surfaced on our Hydrogen project, and in testing it on different versions of Hydrogen, we believe it might have come from the 2024.4.4 release. Looking at those release notes, we're wondering if it might have been unintentionally introduced in PR #2224. That said, while we see analytics-related changes, we aren't seeing any obvious changes to the page_viewed event. We could definitely be wrong, but just thought we'd share that in case it helps you track it down!
Happy to answer any questions. Thank you for any and all help when looking into this!