angular polyfill problem: IE11 - core-js v3.6.5 method es.string.split.js fails parsing regex /^|\s+/ on split

Question

Angular 10, d3 5.16.0, core-js 3.6.5

The long and short of this is that d3-drag invokes d3-dispatch, which internally calls a method named .parseTypenames.

function parseTypenames(typenames, types) {
    return typenames.trim().split(/^|\s+/).map(function (t) {
    var name = "",
        i = t.indexOf(".");
    if (i >= 0) name = t.slice(i + 1), t = t.slice(0, i);
    if (t && !types.hasOwnProperty(t)) throw new Error("unknown type: " + t);
    return {
      type: t,
      name: name
    };
  });
}

es.string.split.js is doing something goofy processing the /^|\s+/ regular expression.

var foo = 'drag'.split(/^|\s+/) // yields an array = ['d','r','a','g'] when i'm expecting ['drag']

Any suggestions on what to do here? Hopefully I don't have a fundamental compatibility issue using IE11, Angular 10, and D3.

Thanks in advance.

Answer 1

I'm in favor of Michael's opinion. The issue is introduced by version 3.6.0 due to support of y flag. Besides Michael's solution, you can also refer to this workaround:

You can replace the following line in your polyfills.ts:

import 'core-js';

to

import 'core-js/stable/array';
import 'core-js/stable/date';
import 'core-js/stable/function';
import 'core-js/stable/map';
import 'core-js/stable/math';
import 'core-js/stable/number';
import 'core-js/stable/object';
import 'core-js/stable/parse-float';
import 'core-js/stable/parse-int';
// import 'core-js/stable/regexp';
import 'core-js/stable/set';
// import 'core-js/stable/string';
import 'core-js/stable/symbol';
import 'core-js/stable/weak-map';

Note that the imports regexp and string are commented. So when your application needs to do a split, it's using the native function of the browser instead of the split function in core-js.

Answer 2

I think you are hitting issue #751

This occurs from core-js 3.6.0, when two different versions of the polyfill are loaded. Currently the issue is still open, so solutions at the moment would be to make sure no two versions are loaded, or downgrade to <3.6.0.

The following may help identify the different versions of core-js in your dependency tree:

npm list | grep core-js