Uncaught TypeError: Cannot read property 'xyz' of undefined

John Peters - Jun 21 '20 -

If you saw this error when serving up an angular project, what would it mean?

core.js:36228 Uncaught TypeError: Cannot read property 'id' of undefined
    at registerNgModuleType (core.js:36228)
    at core.js:36246
    at Array.forEach (<anonymous>)
    at registerNgModuleType (core.js:36242)
    at core.js:36246
    at Array.forEach (<anonymous>)
    at registerNgModuleType (core.js:36242)
    at new NgModuleFactory$1 (core.js:36407)
    at compileNgModuleFactory__POST_R3__ (core.js:42296)
    at PlatformRef.bootstrapModule (core.js:42663)

We can see this is very early in the bootstrap, and it's doing something with the ngModule attempting to register an NGModuleType of which it cannot read a property.

So Now What?

We are forced to go on an Angular module loading safari. A veritable rabbit hole; which no sprint knows the duration. 🍋🍋

We set a break here, in Angular.core.js land

function registerNgModuleType(ngModuleType) {
    if (ngModuleType.ɵmod.id !== null) {
        /** @type {?} */
        const id = ngModuleType.ɵmod.id;
        /** @type {?} */
        const existing = (/** @type {?} */ (modules.get(id)));
        assertSameOrNotExisting(id, existing, ngModuleType);
        modules.set(id, ngModuleType);

We found that the error was thrown on the MatPaginator ngModuleType.

We were able to set a conditional breakpoint which allowed us to recreate the error with only one breakpoint each time.

This MatPaginator moduletype did not have an id, thus the error.

But Why?

Get back after the safari ends.