Import ES5 autotrack.js

[woeltjen]

...to avoid SyntaxError in legacy browsers

googleanalytics/autotrack#137

Description

Reports of Uncaught SyntaxError: Use of const in strict mode when viewing Beenest on legacy browsers (Safari 9/10 were the reports, Chromium 40 was any reproduction environment). Generally, these occur when trying to run ES6 code in a browser without ES6 support, such as when an ES6 dependency gets included by webpack without transpilation. In our case, this was the autotrack dependency. Ran into miscellaneous errors trying to enable transpilation for node_modules/autotrack; instead, changed the require call which imports this to point to autotrack/autotrack.js, which is a minified ES5 version of the dependency.

How to Test

1. Build for prod (npm run prod)
2. Serve built file (cd dist; http-server)
3. Verify that Chromium 40 can load the page

Which devices did you test on?

• Chromium on Mac
• Chrome on Mac
• Chrome on PC
• Firefox on Mac
• Firefox on PC
• Safari iPhone
• Chrome Android

REVIEWERS:

Check against these principles:

High level

Does this code need to be written?
What are the alternatives?
Will this implementation become a support issue?
How much error margin does this solution have?

Code

• Does the code follow industry standards?
  JS: https://github.com/airbnb/javascript
  React: https://github.com/airbnb/javascript/tree/master/react
  https://github.com/vasanthk/react-bits
  Documentation headers: http://usejsdoc.org/index.html

• Is there duplicated code? Can it be refactored into a shared method?

• Is the code consistent with our project?

• Are there unit tests? Do they test the states?

• Is the person refactoring another developer's code? If possible, did the original developer approve?

Variables/Naming:

• Would the variable type led to future edge cases?
• Are the variable naming clear? Would the value contain something other than what the name describes.

Security

• Can this be hacked or abused by the user?

Further Work

This solution is not ideal, insofar as it increases the scope of the dependency we include; fine-grained inclusion of plugins would be preferable. Our index.js goes from 1575840 bytes to 1582801 bytes with this change. That extra ~7k looks "negligible" at that scale; we should probably look into pruning our other dependencies.

Learnings

webpack can introduce some obscure errors...

[kcvan]

what