'Manual start' fails when a addblocker is installed

[dmathijs]

Like the title says, trying to access the application that uses manual start with an addblocker activated, I get the following error:

I'm also having a hard time configuring my application with the docs, for someone who's not really pro with react there's a lot of context missing in the examples.

[pedram6195]

I have the same problem, same error :(

[unrealmanu]

do you only use adblocker? or even an antivirus?

[pedram6195]

I have not any adblockers or antivirus on my system. I have windows 7 and I use chrome last version. but... I disabled all my chrome's addons and then enabled them again, now it works without error. thanks

[dmathijs]

do you only use adblocker? or even an antivirus?

It's only adblocker, disabling it fixes the issue.

[OssiPesonen]

We are suffering from a generic issue like this as well, and getting repeated errors in Sentry.

GA4React intialization failed
{"type":"error"}

There's basically nothing more. Sometimes we get timeout errors. Users seem to enter our application from all directions. Most errors tend to be from Windows or Mobile (Android) devices. Browsers are mostly only Chrome v. 69 and above, but also WebView, Opera Mobile, iOS safari etc.

This error might not even be related to this library since we had errors before installing ga-4-react. There seems to be some type of TypeError in gtag/js which gets triggered by random users.

TypeError
Illegal invocation

On line 495:

{snip} ))}}},vq=function(a,b,c){var d=a+"?"+b;c?dd.sendBeacon&&dd.sendBeacon(d,c):rd(d)};var Aq=window,Bq=document,Cq=function(a){var b=Aq._gaUserP {snip}

The script is initialized in index.js when using create-react-app. Manual start, essentially.

We haven't found anything on our searches as to what might cause this issue. I tried replicating this with AdBlocker plus but Analytics works just fine. Can't pinpoint the cause. Any help would be appreciated. If this is indeed an AdBlocker issue I'd like for someone to replicate this and maybe throw in a solution as to how we can detect adblock users on our site before initializing analytics so we don't have Sentry spam us with errors.

[noofreuuuh]

I reproduced also the issue with Ghostery. To not have an UI issue due to that, i added a try catch around ga4react.initialize();

try {
    await ga4react.initialize();
} catch (e) {
    console.error("Addblock is activated");
}

[Jodebu]

I solved this issue in a similar way to @noofreuuuh, but on render:

ga4react.initialize()
  .then(() => config.GA_TRACKING_BLOCKED = false)
  .catch(() => config.GA_TRACKING_BLOCKED = true)
  // eslint-disable-next-line react/no-render-return-value
  .finally(() => ReactDOM.render(<App />, document.getElementById('root')));

I use the config variable later to decide if I can set up the tags:

const ga = useGA4React();
if (!config.GA_TRACKING_BLOCKED && !!ga) {
  history.listen(location => {
    ga.pageview(location.pathname);
    ga.gtag('event', 'pageview', 'path');
  });
}