I think it's the same issue like reported in #35214. formGroup.get('foo') returns null randomly (but the field foo exists).

• Angular 8.2.3
• Chrome 80.0.3987
• Windows 7,8,10
• Mac OS X 10.15.1

Some of the errors i have:
Cannot read property 'valueChanges' of null
Cannot find control with name: 'foo'
Cannot find control with unspecified name attribute

This is really serious bug and should be dealt with immediately.

We have the same bug in Production site, Angular (and Material) v7, it happens only on Chrome 80

Also have experienced this bug. By some reason it happens only once. If you can repeat the process after the error occurred it doesn't happen again.

It's a production show stopper for us at the moment. Could you give an ETA of any kind about chrome fix or an official work around?

i found someone found relate bug in other issue #35190 (comment)

https://bugs.chromium.org/p/chromium/issues/detail?id=1049982

so a quick fix would be to release a version of angular that does not use Array.reduce().

How long will it take for the chromium fix to trickle down for end users?

What if we replaced Array.prototype.reduce() with a function that didn't fail? Even if it was a bit slower.

@sphela02 problem may solved. at least my sentry didn't report anything about this for 4 hours.

@sphela02 problem may solved. at least my sentry didn't report anything about this for 4 hours.

Was there any particular workaround applied? can you please share, if so.

It was happening in Chrome Canary a few weeks ago, but I thought it was something related to that version

@shravan20084312 it quick dirty fix so i just add this to main.ts

(function () {
  function getChromeVersion() {
    const raw = navigator.userAgent.match(/Chrom(e|ium)\/([0-9]+)\./);

    return raw ? parseInt(raw[2], 10) : false;
  }

  const chromeVersion = getChromeVersion();
  if (chromeVersion && chromeVersion >= 80) {
    Array.prototype.reduce = function (callback /*, initialValue*/) {
      'use strict';
      if (this == null) {
        throw new TypeError('Array.prototype.reduce called on null or undefined');
      }
      if (typeof callback !== 'function') {
        throw new TypeError(callback + ' is not a function');
      }
      let t = Object(this), len = t.length >>> 0, k = 0, value;
      if (arguments.length === 2) {
        value = arguments[1];
      } else {
        while (k < len && !(k in t)) {
          k++;
        }
        if (k >= len) {
          throw new TypeError('Reduce of empty array with no initial value');
        }
        value = t[k++];
      }
      for (; k < len; k++) {
        if (k in t) {
          value = callback(value, t[k], k, t);
        }
      }
      return value;
    };
  }
})();

i grab this code from https://gist.github.com/lski/0eae0d2738831b6b0ec2b88a8a603952

@shravan20084312 it quick dirty fix so i just add this to main.ts

(function () {
  function getChromeVersion() {
    const raw = navigator.userAgent.match(/Chrom(e|ium)\/([0-9]+)\./);

    return raw ? parseInt(raw[2], 10) : false;
  }

  const chromeVersion = getChromeVersion();
  if (chromeVersion && chromeVersion >= 80) {
    Array.prototype.reduce = function (callback /*, initialValue*/) {
      'use strict';
      if (this == null) {
        throw new TypeError('Array.prototype.reduce called on null or undefined');
      }
      if (typeof callback !== 'function') {
        throw new TypeError(callback + ' is not a function');
      }
      let t = Object(this), len = t.length >>> 0, k = 0, value;
      if (arguments.length === 2) {
        value = arguments[1];
      } else {
        while (k < len && !(k in t)) {
          k++;
        }
        if (k >= len) {
          throw new TypeError('Reduce of empty array with no initial value');
        }
        value = t[k++];
      }
      for (; k < len; k++) {
        if (k in t) {
          value = callback(value, t[k], k, t);
        }
      }
      return value;
    };
  }
})();

i grab this code from https://gist.github.com/lski/0eae0d2738831b6b0ec2b88a8a603952

As a workaround, we are seeing this to resolve the issue for now, until we get a stable fix from Angular/chrome.

I´m using this as a workaround from https://bugs.chromium.org/p/chromium/issues/detail?id=1049982

(function() {
  const arrayReduce = Array.prototype.reduce;
  let callback;
  Object.defineProperty(Array.prototype, 'reduce', {
    value: function(cb, ...args) {
    callback = cb;
      return arrayReduce.call(this, callback, ...args);
    }
  });
})();

It looks like @shravan20084312 might have done it more elegantly than us (s*he checks Chome version), but here's what we did.

We created this as a polyfill, and we're including it with our other polyfills.

Array.prototype.reduce = function(callback /*, initialValue*/) {
  'use strict';
  if (this === null) {
    throw new TypeError('Array.prototype.reduce called on null or undefined');
  }
  if (typeof callback !== 'function') {
    throw new TypeError(callback + ' is not a function');
  }
  var t = Object(this), len = t.length >>> 0, k = 0, value;
  if (arguments.length == 2) {
    value = arguments[1];
  } else {
    while (k < len && !(k in t)) {
      k++; 
    }
    if (k >= len) {
      throw new TypeError('Reduce of empty array with no initial value');
    }
    value = t[k++];
  }
  for (; k < len; k++) {
    if (k in t) {
      value = callback(value, t[k], k, t);
    }
  }
  return value;
}; 

I´m using this as a workaroung from https://bugs.chromium.org/p/chromium/issues/detail?id=1049982

(function() {
  const arrayReduce = Array.prototype.reduce;
  let callback;
  Object.defineProperty(Array.prototype, 'reduce', {
    value: function(cb, ...args) {
    callback = cb;
      return arrayReduce.call(this, callback, ...args);
    }
  });
})();

did this work as well @rodolfojnn

We've used the smaller version...

// TODO: Remove when things are fixed upstream (or in the browser?).
// Workaround for Angular issue: https://github.com/angular/angular/issues/35219
// and underlying Chromium bug:https://bugs.chromium.org/p/chromium/issues/detail?id=1049982
(function () {
    const arrayReduce = Array.prototype.reduce;
    let callback;
    Object.defineProperty(Array.prototype, 'reduce', {
        value: function (cb, ...args) {
            callback = cb;
            return arrayReduce.call(this, callback, ...args);
        }
    });
})();

...and included it in polyfills.ts so that it works in both .spec.ts tests and in the browser. (Whereas main.ts didn't fix things in specs for us.)

We've used the smaller version...

// TODO: Remove when things are fixed upstream (or in the browser?).
// Workaround for Angular issue: https://github.com/angular/angular/issues/35219
// and underlying Chromium bug:https://bugs.chromium.org/p/chromium/issues/detail?id=1049982
(function () {
    const arrayReduce = Array.prototype.reduce;
    let callback;
    Object.defineProperty(Array.prototype, 'reduce', {
        value: function (cb, ...args) {
            callback = cb;
            return arrayReduce.call(this, callback, ...args);
        }
    });
})();

...and included it in polyfills.ts so that it works in both .spec.ts tests and in the browser. (Whereas main.ts didn't fix things in specs for us.)

Same answer as @rodolfojnn

Have same issue on my Angular8 app.

After including this to main.ts or to polyfills.ts

// TODO: Remove when things are fixed upstream (or in the browser?).
// Workaround for Angular issue: #35219
// and underlying Chromium bug:https://bugs.chromium.org/p/chromium/issues/detail?id=1049982
(function () {
const arrayReduce = Array.prototype.reduce;
let callback;
Object.defineProperty(Array.prototype, 'reduce', {
value: function (cb, ...args) {
callback = cb;
return arrayReduce.call(this, callback, ...args);
}
});
})();

it fixes problem locally. But I still have it in prod build(
Can anyone advice what should be done to prevent it in prod?

@Nikitikitavi That should fix it in production too, at least it did for us, and given the general chatter around the issue it did so too for others I believe. Are you sure it's landing on your prod environment properly?

Also note that the Chromium team made this "priority 0" in the abovementiond Chromium bug 1049982. As I write this it seems the fixes have landed in Chrome Canary already, and if I understand that thread correctly they're also aiming to patch Chrome 80.

So the Angular team might not need to do anything (except for perhaps leaving this issue open for visibility, until the Chromium patch has landed properly in Chrome and Edge)...

@Nikitikitavi That should fix it in production too, at least it did for us, and given the general chatter around the issue it did so too for others I believe. Are you sure it's landing on your prod environment properly?

Yeah, I even found this code in my main-es2015.hash.js bundle file

@Nikitikitavi i think user still use cached version or use version that before patched becuase browser already loaded before you deploy new version. so you need to find a way to make user refresh that page

#35349 landed, so we'll have a new Angular patch version that we can use that does not rely on Array.reduce (while we are waitin for the next Chrome version that should fix the underlying issue).

A new chrome update, version 80.0.3987.106, seems to solve the issue.

Closing, as v9.0.1 includes a fix, and the latest Chrome release does not have the underlying issue anymore.

Is a patch is planned on Angular 7.X version ?

Is a patch is planned on Angular 7.X version ?

No, it will not be fixed in earlier versions #35349 (comment)

@TheoLechemia Since Chrome 80.0.3987.106 the bug has been eliminated.

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}