fix(@angular-devkit/build-angular): wrap ES5 differential loading bundles

This change ensures that classic (ES5) script's top-level function helpers do not get overwritten by other scripts top-level functions that happen to have the same name.  This is not an issue when using module script types because each module has its own scope.

(cherry picked from commit bcb41e3)

Author: clydin

packages/angular_devkit/build_angular/src/browser/specs/differential_loading_spec.ts

@@ -10,6 +10,7 @@ import { Architect } from '@angular-devkit/architect';
 import { PathFragment } from '@angular-devkit/core';
 import { browserBuild, createArchitect, host } from '../../test-utils';
 
+// tslint:disable-next-line: no-big-function
 describe('Browser Builder with differential loading', () => {
   const target = { project: 'app', target: 'build' };
   let architect: Architect;
@@ -181,6 +182,12 @@ describe('Browser Builder with differential loading', () => {
     expect(await files['main-es2015.js']).toContain('const ');
   });
 
+  it('wraps ES5 scripts in an IIFE', async () => {
+    const { files } = await browserBuild(architect, host, target, { optimization: false });
+    expect(await files['main-es5.js']).toMatch(/^\(function \(\) \{/);
+    expect(await files['main-es2015.js']).not.toMatch(/^\(function \(\) \{/);
+  });
+
   it('uses the right zone.js variant', async () => {
     const { files } = await browserBuild(architect, host, target, { optimization: false });
     expect(await files['polyfills-es5.js']).toContain('zone.js/dist/zone-legacy');

packages/angular_devkit/build_angular/src/utils/process-bundle.ts

@@ -157,7 +157,10 @@ export async function process(options: ProcessBundleOptions): Promise<ProcessBun
           exclude: ['transform-typeof-symbol'],
         },
       ]],
-      plugins: options.replacements ? [createReplacePlugin(options.replacements)] : [],
+      plugins: [
+        createIifeWrapperPlugin(),
+        ...(options.replacements ? [createReplacePlugin(options.replacements)] : []),
+      ],
       minified: allowMinify && !!options.optimize,
       compact: !shouldBeautify && !!options.optimize,
       sourceMaps: !!sourceMap,
@@ -509,6 +512,36 @@ function createReplacePlugin(replacements: [string, string][]): PluginObj {
   };
 }
 
+function createIifeWrapperPlugin(): PluginObj {
+  return {
+    visitor: {
+      Program: {
+        exit(path: NodePath<types.Program>) {
+          // Save existing body and directives
+          const { body, directives } = path.node;
+
+          // Clear out body and directives for wrapper
+          path.node.body = [];
+          path.node.directives = [];
+
+          // Create the wrapper - "(function() { ... })();"
+          const wrapper = types.expressionStatement(
+            types.callExpression(
+              types.parenthesizedExpression(
+                types.functionExpression(undefined, [], types.blockStatement(body, directives)),
+              ),
+              [],
+            ),
+          );
+
+          // Insert the wrapper
+          path.pushContainer('body', wrapper);
+        },
+      },
+    },
+  };
+}
+
 const USE_LOCALIZE_PLUGINS = false;
 
 export async function createI18nPlugins(