Comments (12)
This is because the Playwright
component mounts a snippet to the header, this snippet, only checks once for the existence of the text/partytown
scripts, when the document is loaded. The logic does not rerun when page transition happens.
https://github.com/BuilderIO/partytown/blob/main/src/lib/main/snippet.ts#L156
Edit: I've scratched around a bit more and it seems that the worker uses requestAnimationFrame
, to detect the next scripts. I'll try to debug it some more, I'm annoyed by this bug, especially since it's been open for so long.
from partytown.
Hi, I finally found how to use GA with Partytown and Next.js.... here my post about it: I'd like to try with GTM too.
from partytown.
Hi, I have the same question too: I successfully loaded the GTM script on my custom Next.js Document page and, at start, the pageview event is triggered as expected.
I tried, then, to push the pageview event client side, listening on "routeChangeComplete" router event but the command is never forwarded to the service worker:
useEffect(() => {
const pageview = (url) => {
dataLayer.push({
event: "pageview",
page: url,
})
}
router.events.on("routeChangeComplete", pageview)
return () => {
router.events.off("routeChangeComplete", pageview)
}
}, [router.events])
from partytown.
We're encountering the same with Nuxt. I think implementing with MutationObserver might be a straightforward approach?
from partytown.
I faced this same issue while implementing this with Nuxt2
. Initial event works well but using window.dataLayer.push(event)
doesn't trigger GTM request for that event.
I've created simple implementation here nuxt2-partytown-demo
If this issue is fixed then I'm planning to write a module/plugin for Nuxt2
to implement Partytown
from partytown.
I ran gtag integration test locally and it seems button click is not sending event as it suppose to send { event: 'button-click', from: 'partytown' }
test/integration/gtag
at https://github.com/BuilderIO/partytown/blob/main/tests/integrations/gtm/index.html`
Also tried live test https://partytown.builder.io/tests/integrations/gtm/ with same problem.
Is this expected behaviour and I am not understanding something or there is problem?
from partytown.
I am getting the same issue. I cannot find a way to send a page view event to the Partytown GTM script from the main thread in Next.js.
from partytown.
Check this demo nuxt2-partytown-demo I tried using hidden input on main thread and dispatchEvent('change') on button click and listen the same input change event in text/partytown
gtag script and use gtag('pageView', 'about')
but with no luck.
doing window.dataLayer.push
inside partytown script where gtag is initialised works only once, letter it just doesn't send new event after it.
from partytown.
@adamdbradley what's would be the correct approach here to help implement?
- Create mutation observer that listens to newly created script tags with type text/partytown and route them through partytown.
- Create a function that you can call to inject partytown tags?
One would be the most automated one, where you don't have to think about implementation details as a end-user. The second option would be more on the framework side, where you can do the logic with a Script component.
from partytown.
Thanks for your help @mrakus-sofomo
let's try to solve this issue
from partytown.
@gioboa Is this issue still present in nextjs worker script?
https://nextjs.org/docs/pages/building-your-application/optimizing/scripts#offloading-scripts-to-a-web-worker-experimental
from partytown.
@gioboa Is this issue still present in nextjs worker script? https://nextjs.org/docs/pages/building-your-application/optimizing/scripts#offloading-scripts-to-a-web-worker-experimental
I guess so. I didn't solve it yet
from partytown.
Related Issues (20)
- [📖] Discord server link is broken HOT 1
- [🐞] resolveUrl function in partytown config does not work HOT 2
- [🐞] Error 404 for '/_next/static/%7Epartytown/proxytown' and some iOS/Safari versions HOT 4
- [🐞] Web Worker Does Not Allow `withCredentials` for XHR Requests
- [🐞] Google Tag Assistant Preview is not showing tags (Google Tag Manager) while using Partytown HOT 1
- [📖] How can I load partytown from a pure HTML/JS website? HOT 1
- [🐞]partytown throws error in chrome developer console and not able to connect to GTM preview mode HOT 13
- [🐞]404 errror throws while implementing partytown in gatsby application HOT 3
- Failed to register a ServiceWorker for scope ('https://example/~partytown/') with script ('https://example.com/~partytown/partytown-sw.js'): The script resource is behind a redirect, which is disallowed. HOT 1
- Partytown integration with Astro makes over 10'000 proxytown requests on page load[🐞] HOT 2
- [🐞] Google Tag Manager NextJS forward events coming as blank []
- [🐞] Cannot read property 'Error' of null
- [🐞] Proxy object could not be cloned HOT 1
- [🐞] Firefox: 404 partytown-sandbox-sw.html HOT 1
- [🐞] Firefox: Private Browsing for external Scripts HOT 1
- [🐞] GA4 sessions plummeted after migration of GTM to Partytown HOT 11
- [🐞] Objects and object properties can't be forwarded HOT 2
- [🐞]in statement is not reliable when running through partytown
- [📖] resolveSendBeaconRequestParameters missing in docs and React types HOT 1
- [🐞]: forwarding gtm dataLayer.push breaks immediate dataLayer pushes HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from partytown.