fix(@angular-devkit/build-angular): properly process es2016+ targets with differential loading

A target of es2015 was previously assumed when using differential loading.  This could result in erroneously downleveling an es2016+ output file instead of generating a new es5 output file.

Author: clydin

packages/angular_devkit/build_angular/src/browser/index.ts

@@ -347,7 +347,7 @@ export function buildWebpackBrowser(
                 }
                 // If not optimizing then ES2015 polyfills do not need processing
                 // Unlike other module scripts, it is never downleveled
-                const es2015Polyfills = file.file.startsWith('polyfills-es2015');
+                const es2015Polyfills = file.file.startsWith('polyfills-es20');
                 if (!actionOptions.optimize && es2015Polyfills) {
                   continue;
                 }
@@ -368,7 +368,7 @@ export function buildWebpackBrowser(
 
                 if (es5Polyfills) {
                   fs.unlinkSync(filename);
-                  filename = filename.replace('-es2015', '');
+                  filename = filename.replace(/\-es20\d{2}/, '');
                 }
 
                 // Record the bundle processing action
@@ -393,8 +393,8 @@ export function buildWebpackBrowser(
 
                 // Add the newly created ES5 bundles to the index as nomodule scripts
                 const newFilename = es5Polyfills
-                  ? file.file.replace('-es2015', '')
-                  : file.file.replace('es2015', 'es5');
+                  ? file.file.replace(/\-es20\d{2}/, '')
+                  : file.file.replace(/\-es20\d{2}/, '-es5');
                 noModuleFiles.push({ ...file, file: newFilename });
               }
 

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

@@ -89,7 +89,7 @@ export async function process(options: ProcessBundleOptions): Promise<ProcessBun
 
   const basePath = path.dirname(options.filename);
   const filename = path.basename(options.filename);
-  const downlevelFilename = filename.replace('es2015', 'es5');
+  const downlevelFilename = filename.replace(/\-es20\d{2}/, '-es5');
   const downlevel = !options.optimizeOnly;
 
   // if code size is larger than 1 MB, manually handle sourcemaps with newer source-map package.
@@ -376,9 +376,9 @@ async function processRuntime(
 
   // Adjust lazy loaded scripts to point to the proper variant
   // Extra spacing is intentional to align source line positions
-  downlevelCode = downlevelCode.replace('"-es2015.', '   "-es5.');
+  downlevelCode = downlevelCode.replace(/"\-es20\d{2}\./, '   "-es5.');
 
-  const downlevelFilePath = options.filename.replace('es2015', 'es5');
+  const downlevelFilePath = options.filename.replace(/\-es20\d{2}/, '-es5');
   let downlevelMap;
   let result;
   if (options.optimize) {

packages/angular_devkit/build_angular/test/browser/differential_loading_spec_large.ts

@@ -26,7 +26,7 @@ describe('Browser Builder with differential loading', () => {
 
   afterEach(async () => host.restore().toPromise());
 
-  it('emits all the neccessary files', async () => {
+  it('emits all the neccessary files for default configuration', async () => {
     const { files } = await browserBuild(architect, host, target);
 
     const expectedOutputs = [
@@ -62,6 +62,48 @@ describe('Browser Builder with differential loading', () => {
     expect(Object.keys(files)).toEqual(jasmine.arrayWithExactContents(expectedOutputs));
   });
 
+  it('emits all the neccessary files for target of ES2016', async () => {
+    host.replaceInFile(
+      'tsconfig.json',
+      '"target": "es2015",',
+      `"target": "es2016",`,
+    );
+
+    const { files } = await browserBuild(architect, host, target);
+
+    const expectedOutputs = [
+      'favicon.ico',
+      'index.html',
+
+      'main-es2016.js',
+      'main-es2016.js.map',
+      'main-es5.js',
+      'main-es5.js.map',
+
+      'polyfills-es2016.js',
+      'polyfills-es2016.js.map',
+      'polyfills-es5.js',
+      'polyfills-es5.js.map',
+
+      'runtime-es2016.js',
+      'runtime-es2016.js.map',
+      'runtime-es5.js',
+      'runtime-es5.js.map',
+
+      'styles-es2016.js',
+      'styles-es2016.js.map',
+      'styles-es5.js',
+      'styles-es5.js.map',
+
+      'vendor-es2016.js',
+      'vendor-es2016.js.map',
+      'vendor-es5.js',
+      'vendor-es5.js.map',
+    ] as PathFragment[];
+
+    expect(Object.keys(files)).toEqual(jasmine.arrayWithExactContents(expectedOutputs));
+  });
+
   it('deactivates differential loading for watch mode', async () => {
     const { files } = await browserBuild(architect, host, target, { watch: true });