Use core-js for polyfills, adding those that make us compatible with IE11 with...

Use core-js for polyfills, adding those that make us compatible with IE11 with the exception of Intl time zone handling.

assets/src/scripts/components/hydrograph/legend.js

@@ -19,7 +19,7 @@ const TS_LABEL = {
 
 
 const tsMaskMarkers = function(tsKey, masks) {
-    return Array.from(masks.entries()).map((mask) => {
+    return Array.from(masks.values()).map((mask) => {
         const maskName = MASK_DESC[mask];
         const tsClass = `${maskName.replace(' ', '-').toLowerCase()}-mask`;
         const fill = `url(#${HASH_ID[tsKey]})`;

assets/src/scripts/index.js

-import '@babel/polyfill';
-import 'matchmedia-polyfill';
+import './polyfills';
 
 // Initialize the 18F Web design standards
 import 'uswds';
@@ -22,7 +21,8 @@ const COMPONENTS = {
 
 function main() {
     // NOTE: Here we use a try/catch block rather than a global "onerror"
-    // handler, because Babel's polyfills strip some of the exception data out.
+    // handler, to avoid the exception data from getting stripped out by
+    // anything in the build tooling.
     // This method retains access to the exception object.
     try {
         let nodes = document.getElementsByClassName('wdfn-component');

assets/src/scripts/index.spec.js

@@ -7,6 +7,8 @@
  * time, and `karma --watch` tasks are very fast.
  */
 
+import './polyfills';
+
 import './accessibility.spec';
 import './ajax.spec';
 import './components/embed.spec';
@@ -44,4 +46,6 @@ import './store/uiReducer.spec';
 import './tooltips.spec';
 import './utils.spec';
 
+// Leaflet expects an exports global to exist - so although we don't use this,
+// just set it to something so it's not undefined.
 export var dummy = true;

assets/src/scripts/polyfills.js

+import 'element-closest';
+import 'matchmedia-polyfill';
+
+import 'core-js/modules/es6.array.fill';
+import 'core-js/modules/es6.array.from';
+import 'core-js/modules/es6.math.log10';
+import 'core-js/modules/es6.math.trunc';
+import 'core-js/modules/es6.number.is-integer';
+import 'core-js/modules/es6.number.is-nan';
+import 'core-js/modules/es6.promise';
+import 'core-js/modules/es6.string.repeat';
+import 'core-js/modules/es6.string.starts-with';
+
+import 'core-js/modules/es7.array.includes';
+import 'core-js/modules/es7.object.values';

wdfn-server/waterdata/templates/base_plain.html

@@ -23,6 +23,7 @@
                 'WEATHER_SERVICE_ROOT': '{{ config.WEATHER_SERVICE_ROOT }}'
             };
         </script>
+        <script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>
         <script async src="{{ 'bundle.js' | asset_url }}"></script>
         {% block page_script %}{% endblock %}
         <!-- Google Tag Manager --><script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-TKQR8KP');</script>