select_content event doesn't collect on time
puntope opened this issue · 2 comments
What I expected
- With Use Global Site Tag and "Enable Enhanced eCommerce" and all sub-options selected.
- Rest of config tested and working fine. So, events are working fine...
After clicking on a product single, I expect to have gtag( 'event', 'select_content')` collected properly...
What happened instead
The code is triggered, but it change the page before the collect network requests is called... so no collect select_content were found in network panel...
Steps to reproduce the issue
- Add a tracking code (valid Global Site Tag format, like G-28QSQJCS9D),
- Select "Use Global Site Tag" and all Tracking Options.
- Enable "Enable Enhanced eCommerce" and all sub-options.
- Go to the shop open console and network panel
- Click on Preserve log
- Click on a Product
- No Collect network was registered with
en=select_content
Video with voice, blocking the page change click behaviour manually for testing.
https://user-images.githubusercontent.com/5908855/148254062-3e7c63e7-8146-405d-a855-6cc5367c1a29.mov
Video with voice, showing just a log, to see that recordEvent was called.
https://user-images.githubusercontent.com/5908855/148254073-80c51534-026c-42aa-8c87-d0abe3c514ca.mov
- Issue assigned to next milestone.
- Issue assigned a priority (will be assessed by maintainers).
Looks like this would be a potential solution:
https://developers.google.com/analytics/devguides/collection/gtagjs/sending-data#implement_event_callback_functions
In some cases, you need to know when an event has been successfully sent to Google Analytics, so you can take action immediately afterward. This is common when you need to record a particular interaction that would take a user away from the current page. Many browsers stop executing JavaScript as soon as the next page starts loading, which means your gtag.js event commands may never run.
…
The solution is to intercept the event to stop the next page from loading so that you can send the event to Google Analytics. After the event has been sent, submit the form programmatically.