Syntax Error Unexpected token '.' in some browser

[ngoctuan001]

In the built files of amplitude, the code doesn't transpile the '?.' and '??' syntax. When we tried to use the files, it reports error in some browser which doesn't understand this syntax in javascript context.

Suggested solutions:

in your rollup config, add '@babel/plugin-proposal-optional-chaining'

For example:

  plugins: [
    json(),
    resolve({
      browser: true,
    }),
    replace({
      preventAssignment: true,
      BUILD_COMPAT_SNIPPET: 'true',
      BUILD_COMPAT_LOCAL_STORAGE: 'true',
      BUILD_COMPAT_2_0: 'true',
    }),
    commonjs(),
    babel({
      babelHelpers: 'bundled',
      // exclude: 'node_modules/**',
      plugins: [
        '@babel/plugin-proposal-object-rest-spread',
        '@babel/plugin-proposal-optional-chaining'
      ],
    }),
  ],

Note: we found out this ?. may come from a node_modules, that why in the suggested solution above, i comment out the exclude part so that the built file will no longer have ?.

If you guys have any other ideas, can help contribute too, thanks

Environment

• JS SDK Version: amplitude-8.21.8-min.gz.js

[Mercy811]

Hi @ngoctuan001 It's more like a feature request since this syntax has more than 90% browsers supported

• nullish coalescing
• optional chaining

It's already put into our backlog. No ETA right now but we will keep you updated.

[Mercy811]

Hi @ngoctuan001, which browser are you using and which version is it?

[ngoctuan001]

Hi @Mercy811 We are using version 8.21.8 These are some user systems that is related to this production issue

Chrome 78 (windows), Chrome mobile ios 92 (ios12), mobile safari 13 (ios13), chrome 78 (windows 10), chrome mobile 78 ( android 11), uc browser 15 (android10), mobile safari 12( ios12)

[ngoctuan001]

i also found another existing thread reported this issue long time ago, it seems it has this issue from version 8.21.4 https://github.com/amplitude/Amplitude-JavaScript/issues/576

90% coverage of browser syntax actually not very high :joy: , considering this is a quite popular library, we hope this can be fixed soon :pray:

[Mercy811]

Hi @ngoctuan001, unfortunately we don't have a plan to support older versions of browsers. Please upgrade to newer version.

[Mercy811]

Hi @ngoctuan001, our latest typescript browser SDK conforms to ES5 which covers 97.75% users. Hope the migration guide helps.

[Golfenstein3D]

@Mercy811 The optional chaining operator is ES2020. Just wanted to confirm before upgrading... the new SDK is ES5, even though the old SDK was ES2020?

[lonelyYang9321]

"Uncaught SyntaxError: Unexpected token .", I also encountered the same problem on a low-version Android phone. How should I solve this problem?