DavidWells / analytics

Lightweight analytics abstraction layer for tracking page views, custom events, & identifying visitors
https://getanalytics.io
MIT License
2.46k stars 243 forks source link

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'parentNode') on @analytics/segment #384

Closed Hedes-Productions closed 1 year ago

Hedes-Productions commented 1 year ago

Analytics package version - 0.8.7 Other Packages - @analytics/segment (version - 1.1.4)

So Im using @analytics/segment to send events to the segment data source. I faced two issues when Im using this package.

  1. The first problem is Im getting this error massage. I think its from the package itself.

Error -

analytics-plugin-segment.browser.es.js:221 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'parentNode')
    at analytics.load (analytics-plugin-segment.browser.es.js:221:1)
    at analytics-plugin-segment.browser.es.js:226:1
    at Object.initialize (analytics-plugin-segment.browser.es.js:229:4)
    at analytics-core.module.js:1:8919

  | analytics.load | @ | analytics-plugin-seg…t.browser.es.js:221
-- | -- | -- | --
  | (anonymous) | @ | analytics-plugin-seg…t.browser.es.js:226
  | initialize | @ | analytics-plugin-seg…t.browser.es.js:229
  | (anonymous) | @ | analytics-core.module.js:1
  | Promise.then (async) |   |  
  | (anonymous) | @ | analytics-core.module.js:1
  | (anonymous) | @ | analytics-core.module.js:1
  | (anonymous) | @ | analytics-core.module.js:1
  | Ve.ue.dispatch | @ | analytics-core.module.js:1
  | (anonymous) | @ | analytics-core.module.js:1
  | Ve | @ | analytics-core.module.js:1
  | analyticsLib | @ | analytics.browser.es.js:51
  | ./src/analytics/index.js | @ | index.js:5
  | __webpack_require__ | @ | bootstrap:19
  | ./src/pages/Invitation/SignupStep2.js | @ | SignupStep2.js:12
  | __webpack_require__ | @ | bootstrap:19
  | ./src/pages/Invitation/index.js | @ | index.js:19
  | __webpack_require__ | @ | bootstrap:19
  | ./src/navigation/index.js | @ | index.js:10
  | __webpack_require__ | @ | bootstrap:19
  | ./src/index.js | @ | index.js:3
  | __webpack_require__ | @ | bootstrap:19
  | (anonymous) | @ | index.web.js:2
  | (anonymous) | @ | bundle.web.js:344702
  | (anonymous) | @ | bundle.web.js:344889
  1. The second problem is Im getting this warning message from the @analytics/segment package. Warning message -
    Could not find a declaration file for module '@analytics/segment'. '/Users/tharindugimras/Documents/GoTradie/gt-invite-microsite-fe/node_modules/@analytics/segment/lib/analytics-plugin-segment.cjs.js' implicitly has an 'any' type.
    Try `npm i --save-dev @types/analytics__segment` if it exists or add a new declaration (.d.ts) file containing `declare module '@analytics/segment';`ts(7016)
DavidWells commented 1 year ago

Looks like the bug is here https://github.com/DavidWells/analytics/blob/698def152b6eb352d0421442bd95329d03fcdd9d/packages/analytics-plugin-segment/src/browser.js#L176

There must be no other scripts on your page it can find to attach the script script after.

Temp fix add <script>/*empty comment*/</script> to the head of your DOM.

Will need to harden the script injection mechanism in a follow PR addressing these https://github.com/search?q=repo%3ADavidWells%2Fanalytics%20parentNode&type=code

Hedes-Productions commented 1 year ago

Thanks for the quick answer. That's very helpful.