bug(build): Remove moduleId from components when building (#3664)

Fixes #3576

Author: Brocco

packages/@ngtools/webpack/src/loader.ts

@@ -87,6 +87,27 @@ function _replaceBootstrap(plugin: AotPlugin, refactor: TypeScriptFileRefactor)
   refactor.insertImport(entryModule.className + 'NgFactory', ngFactoryPath);
 }
 
+export function removeModuleIdOnlyForTesting(refactor: TypeScriptFileRefactor) {
+  _removeModuleId(refactor);
+}
+
+function _removeModuleId(refactor: TypeScriptFileRefactor) {
+  const sourceFile = refactor.sourceFile;
+
+  refactor.findAstNodes(sourceFile, ts.SyntaxKind.ObjectLiteralExpression, true)
+    // Get all their property assignments.
+    .filter((node: ts.ObjectLiteralExpression) =>
+      node.properties.some(prop => prop.name.getText() == 'moduleId'))
+    .forEach((node: ts.ObjectLiteralExpression) => {
+      const moduleIdProp = node.properties.filter((prop: ts.ObjectLiteralElement, idx: number) => {
+        return prop.name.getText() == 'moduleId';
+      })[0];
+      // get the trailing comma
+      const moduleIdCommaProp = moduleIdProp.parent.getChildAt(1).getChildren()[1];
+      refactor.removeNodes(moduleIdProp, moduleIdCommaProp);
+    });
+}
+
 function _replaceResources(refactor: TypeScriptFileRefactor): void {
   const sourceFile = refactor.sourceFile;
 
@@ -163,7 +184,9 @@ export function ngcLoader(source: string) {
             .then(() => _removeDecorators(refactor))
             .then(() => _replaceBootstrap(plugin, refactor));
         } else {
-          return _replaceResources(refactor);
+          return Promise.resolve()
+            .then(() => _replaceResources(refactor))
+            .then(() => _removeModuleId(refactor));
         }
       })
       .then(() => {

packages/@ngtools/webpack/src/refactor.ts

@@ -169,6 +169,10 @@ export class TypeScriptFileRefactor {
     this._changed = true;
   }
 
+  removeNodes(...nodes: ts.Node[]) {
+    nodes.forEach(node => this.removeNode(node));
+  }
+
   replaceNode(node: ts.Node, replacement: string) {
     let replaceSymbolName: boolean = node.kind === ts.SyntaxKind.Identifier;
     this._sourceString.overwrite(node.getStart(this._sourceFile),

tests/acceptance/ngtools-webpack-loader.spec.ts

@@ -0,0 +1,33 @@
+'use strict';
+
+// This needs to be first so fs module can be mocked correctly.
+import { expect } from 'chai';
+
+import { removeModuleIdOnlyForTesting } from '../../packages/@ngtools/webpack/src/loader';
+
+describe('@ngtools webpack loader: ', () => {
+  describe('removeModuleId', () => {
+    let refactor: any;
+    let moduleIdProp: any;
+    let commaProp: any;
+    let removeNodesArgs: any;
+    beforeEach(() => {
+      commaProp = { isCommaProp: true };
+      moduleIdProp = {
+        name: { getText: () => 'moduleId' },
+        parent: { getChildAt: () => ({ getChildren: (): any => [{}, commaProp] }) }
+      };
+      refactor = {
+        sourceFile: 'sourceFile',
+        findAstNodes: (): any => [{ properties: [moduleIdProp] }],
+        removeNodes: (...args: any[]) => { removeNodesArgs = args; }
+      };
+    });
+
+    it('should remove "moduleId: module.id"', () => {
+      removeModuleIdOnlyForTesting(refactor);
+      expect(removeNodesArgs[0]).to.equal(moduleIdProp);
+      expect(removeNodesArgs[1]).to.equal(commaProp);
+    });
+  });
+});