feat(@schematcs/angular): change browserslist file name into .browserslistrc

packages/angular_devkit/build_angular/src/utils/build-browser-features_spec.ts

@@ -31,7 +31,7 @@ describe('BuildBrowserFeatures', () => {
   describe('isDifferentialLoadingNeeded', () => {
     it('should be true for for IE 9-11 and ES2015', () => {
       host.writeMultipleFiles({
-        'browserslist': 'IE 9-11',
+        '.browserslistrc': 'IE 9-11',
       });
 
       const buildBrowserFeatures = new BuildBrowserFeatures(
@@ -43,7 +43,7 @@ describe('BuildBrowserFeatures', () => {
 
     it('should be false for Chrome and ES2015', () => {
       host.writeMultipleFiles({
-        'browserslist': 'last 1 chrome version',
+        '.browserslistrc': 'last 1 chrome version',
       });
 
       const buildBrowserFeatures = new BuildBrowserFeatures(
@@ -55,7 +55,7 @@ describe('BuildBrowserFeatures', () => {
 
     it('detects no need for differential loading for target is ES5', () => {
       host.writeMultipleFiles({
-        'browserslist': 'last 1 chrome version',
+        '.browserslistrc': 'last 1 chrome version',
       });
 
       const buildBrowserFeatures = new BuildBrowserFeatures(
@@ -67,7 +67,7 @@ describe('BuildBrowserFeatures', () => {
 
     it('should be false for Safari 10.1 when target is ES2015', () => {
       host.writeMultipleFiles({
-        'browserslist': 'Safari 10.1',
+        '.browserslistrc': 'Safari 10.1',
       });
 
       const buildBrowserFeatures = new BuildBrowserFeatures(
@@ -81,7 +81,7 @@ describe('BuildBrowserFeatures', () => {
   describe('isFeatureSupported', () => {
     it('should be true for es6-module and Safari 10.1', () => {
       host.writeMultipleFiles({
-        'browserslist': 'Safari 10.1',
+        '.browserslistrc': 'Safari 10.1',
       });
 
       const buildBrowserFeatures = new BuildBrowserFeatures(
@@ -93,7 +93,7 @@ describe('BuildBrowserFeatures', () => {
 
     it('should be false for es6-module and IE9', () => {
       host.writeMultipleFiles({
-        'browserslist': 'IE 9',
+        '.browserslistrc': 'IE 9',
       });
 
       const buildBrowserFeatures = new BuildBrowserFeatures(
@@ -105,7 +105,7 @@ describe('BuildBrowserFeatures', () => {
 
     it('should be true for es6-module and last 1 chrome version', () => {
       host.writeMultipleFiles({
-        'browserslist': 'last 1 chrome version',
+        '.browserslistrc': 'last 1 chrome version',
       });
 
       const buildBrowserFeatures = new BuildBrowserFeatures(
@@ -117,7 +117,7 @@ describe('BuildBrowserFeatures', () => {
 
     it('should be true for es6-module and Edge 18', () => {
       host.writeMultipleFiles({
-        'browserslist': 'Edge 18',
+        '.browserslistrc': 'Edge 18',
       });
 
       const buildBrowserFeatures = new BuildBrowserFeatures(

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

@@ -18,7 +18,7 @@ describe('Browser Builder with differential loading', () => {
     await host.initialize().toPromise();
     // to trigger differential loading we need an non ever green browser
     host.writeMultipleFiles({
-      browserslist: 'IE 10',
+      '.browserslistrc': 'IE 10',
     });
 
     architect = (await createArchitect(host.root())).architect;
@@ -193,7 +193,7 @@ describe('Browser Builder with differential loading', () => {
 
   it('adds `type="module"` when differential loading is needed', async () => {
     host.writeMultipleFiles({
-      browserslist: `
+      '.browserslistrc': `
         last 1 chrome version
         IE 9
       `,

packages/angular_devkit/build_angular/test/browser/scripts-array_spec_large.ts

@@ -95,7 +95,7 @@ describe('Browser Builder scripts array', () => {
     host.appendToFile('src/main.ts', '\nimport \'./input-script.js\';');
 
     // Enable differential loading
-    host.appendToFile('browserslist', '\nIE 10');
+    host.appendToFile('.browserslistrc', '\nIE 10');
 
     // Remove styles so we don't have to account for them in the index.html order check.
     const { files } = await browserBuild(architect, host, target, {

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

@@ -285,7 +285,7 @@ describe('Browser Builder styles', () => {
         /* normal-comment */
         /*! important-comment */
         div { flex: 1 }`,
-      browserslist: 'IE 10',
+      '.browserslistrc': 'IE 10',
     });
 
     const overrides = { extractCss: true, optimization: false };
@@ -319,7 +319,7 @@ describe('Browser Builder styles', () => {
           grid-template-columns: 100px;
         }
       `,
-      browserslist: 'IE 10',
+      '.browserslistrc': 'IE 10',
     });
 
     const overrides = { extractCss: true, optimization: true, styles: ['src/styles.scss'] };

packages/angular_devkit/build_angular/test/dev-server/index_spec_large.ts

@@ -18,7 +18,7 @@ describe('Dev Server Builder index', () => {
 
   it(`adds 'type="module"' when differential loading is needed`, async () => {
     host.writeMultipleFiles({
-      browserslist: `
+      '.browserslistrc': `
         last 1 chrome version
         IE 10
       `,
@@ -41,7 +41,7 @@ describe('Dev Server Builder index', () => {
 
   it(`does not add 'type="module"' to custom scripts when differential loading is needed`, async () => {
     host.writeMultipleFiles({
-      browserslist: `
+      '.browserslistrc': `
         last 1 chrome version
         IE 10
       `,
@@ -85,7 +85,7 @@ describe('Dev Server Builder index', () => {
 
   it(`doesn't 'type="module"' when differential loading is not needed`, async () => {
     host.writeMultipleFiles({
-      browserslist: `
+      '.browserslistrc': `
         last 1 chrome version
       `,
     });

packages/angular_devkit/build_angular/test/server/base_spec_large.ts

@@ -57,7 +57,7 @@ describe('Server Builder', () => {
     // the below is needed because of different code paths
     // for polyfills if differential loading is needed
     host.writeMultipleFiles({
-      'browserslist': 'IE 10',
+      '.browserslistrc': 'IE 10',
     });
 
     const run = await architect.scheduleTarget(target);

packages/schematics/angular/migrations/migration-collection.json

@@ -59,6 +59,11 @@
       "version": "10.0.0-beta.0",
       "factory": "./update-10/update-tslint",
       "description": "Update tslint to version 6."
+    },
+    "rename-browserslist-config": {
+      "version": "10.0.0-beta.0",
+      "factory": "./update-10/rename-browserslist-config",
+      "description": "Renaming Browserslist configurations to '.browserslistrc'."
     }
   }
 }

packages/schematics/angular/migrations/update-10/rename-browserslist-config.ts

@@ -0,0 +1,35 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+import { Path, join } from '@angular-devkit/core';
+import { DirEntry, Rule } from '@angular-devkit/schematics';
+
+function* visit(directory: DirEntry): IterableIterator<string> {
+  for (const path of directory.subfiles) {
+    if (path !== 'browserslist') {
+      continue;
+    }
+
+    yield join(directory.path, path);
+  }
+
+  for (const path of directory.subdirs) {
+    if (path === 'node_modules') {
+      continue;
+    }
+
+    yield* visit(directory.dir(path));
+  }
+}
+
+export default function (): Rule {
+  return tree => {
+    for (const path of visit(tree.root)) {
+      tree.rename(path, path.replace(/browserslist$/, '.browserslistrc'));
+    }
+  };
+}

packages/schematics/angular/migrations/update-10/rename-browserslist-config_spec.ts

@@ -0,0 +1,50 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+import { EmptyTree } from '@angular-devkit/schematics';
+import { SchematicTestRunner, UnitTestTree } from '@angular-devkit/schematics/testing';
+
+describe('Migration to rename Browserslist configurations', () => {
+  const schematicName = 'rename-browserslist-config';
+
+  const schematicRunner = new SchematicTestRunner(
+    'migrations',
+    require.resolve('../migration-collection.json'),
+  );
+
+  let tree: UnitTestTree;
+  beforeEach(() => {
+    tree = new UnitTestTree(new EmptyTree());
+  });
+
+  it(`should rename file 'browserslist' to 'browserslistrc'`, async () => {
+    tree.create('/browserslist', 'IE9');
+    tree.create('/src/app/home/browserslist', 'IE9');
+
+    const newTree = await schematicRunner.runSchematicAsync(schematicName, {}, tree).toPromise();
+    expect(newTree.exists('/.browserslistrc')).toBeTruthy();
+    expect(newTree.exists('/browserslist')).toBeFalsy();
+
+    expect(newTree.exists('/src/app/home/.browserslistrc')).toBeTruthy();
+    expect(newTree.exists('/src/app/home/browserslist')).toBeFalsy();
+  });
+
+  it(`should not rename "browserslist" file in 'node_modules'`, async () => {
+    tree.create('/node_modules/browserslist', 'IE9');
+
+    const newTree = await schematicRunner.runSchematicAsync(schematicName, {}, tree).toPromise();
+    expect(newTree.exists('/node_modules/browserslist')).toBeTruthy();
+    expect(newTree.exists('/node_modules/.browserslistrc')).toBeFalsy();
+  });
+
+  it(`should not rename a folder which is named 'browserslist'`, async () => {
+    tree.create('/app/browserslist/file.txt', 'content');
+
+    const newTree = await schematicRunner.runSchematicAsync(schematicName, {}, tree).toPromise();
+    expect(newTree.exists('/app/browserslist/file.txt')).toBeTruthy();
+  });
+});

packages/schematics/angular/migrations/update-8/differential-loading_spec.ts

@@ -105,14 +105,12 @@ describe('Migration to version 8', () => {
     });
 
     it(`should create browserslist file if it doesn't exist`, async () => {
-      tree.delete('/browserslist');
       const tree2 = await schematicRunner.runSchematicAsync('migration-07', {}, tree.branch()).toPromise();
       expect(tree2.exists('/browserslist')).toBe(true);
     });
 
     it('should move browserslist file if it exists in the sourceRoot', async () => {
       tree.create('/src/browserslist', 'last 2 Chrome versions');
-      tree.delete('/browserslist');
       const tree2 = await schematicRunner.runSchematicAsync('migration-07', {}, tree.branch()).toPromise();
       expect(tree2.exists('/browserslist')).toBe(true);
     });
@@ -191,7 +189,6 @@ describe('Migration to version 8', () => {
     });
 
     it(`should not update projects which browser builder is not 'build-angular:browser'`, async () => {
-      tree.delete('/browserslist');
       const config = JSON.parse(tree.readContent('angular.json'));
       config.projects['migration-test'].architect.build.builder = '@dummy/builders:browser';
 
@@ -201,8 +198,7 @@ describe('Migration to version 8', () => {
     });
 
     it(`should move 'browserslist' to root when 'sourceRoot' is not defined`, async () => {
-      tree.rename('/browserslist', '/src/browserslist');
-      expect(tree.exists('/src/browserslist')).toBe(true);
+      tree.create('/src/browserslist', 'content');
 
       const config = JSON.parse(tree.readContent('angular.json'));
       config.projects['migration-test'].sourceRoot = undefined;

tests/legacy-cli/e2e/tests/i18n/ivy-localize-es2015.ts

@@ -9,7 +9,7 @@ export default async function() {
   await setupI18nConfig();
 
   // Ensure a ES2015 build is used.
-  await writeFile('browserslist', 'Chrome 65');
+  await writeFile('.browserslistrc', 'Chrome 65');
   await updateJsonFile('tsconfig.json', config => {
     config.compilerOptions.target = 'es2015';
     config.angularCompilerOptions.disableTypeScriptVersionCheck = true;

tests/legacy-cli/e2e/tests/i18n/ve-localize-es2015.ts

@@ -22,7 +22,7 @@ export default async function() {
   await npm('install', `${localizeVersion}`);
 
   // Ensure a ES2015 build is used.
-  await writeFile('browserslist', 'Chrome 65');
+  await writeFile('.browserslistrc', 'Chrome 65');
   await updateJsonFile('tsconfig.json', config => {
     config.compilerOptions.target = 'es2015';
     config.angularCompilerOptions.disableTypeScriptVersionCheck = true;

tests/legacy-cli/e2e/tests/misc/browsers.ts

@@ -16,7 +16,7 @@ export default async function () {
   }
 
   await replaceInFile(
-    'browserslist',
+    '.browserslistrc',
     'not IE 9-11',
     'Safari 9-10.1\nIE 9-11',
   );

tests/legacy-cli/e2e/tests/misc/es2015-nometa.ts

@@ -3,7 +3,7 @@ import { ng } from '../../utils/process';
 
 export default async function() {
   // Ensure an ES2015 build is used in test
-  await writeFile('browserslist', 'Chrome 65');
+  await writeFile('.browserslistrc', 'Chrome 65');
 
   await ng('generate', 'service', 'user');
 

tests/legacy-cli/e2e/tests/misc/forwardref-es2105.ts

@@ -4,7 +4,7 @@ import { expectToFail } from '../../utils/utils';
 
 export default async function() {
   // Ensure an ES2015 build is used in test
-  await writeFile('browserslist', 'Chrome 65');
+  await writeFile('.browserslistrc', 'Chrome 65');
 
   // Update the application to use a forward reference
   await replaceInFile(

tests/legacy-cli/e2e/tests/misc/support-ie.ts

@@ -14,7 +14,7 @@ export default async function () {
       appArchitect.build.options.es5BrowserSupport = false;
   });
 
-  await writeFile('browserslist', 'last 2 Chrome versions');
+  await writeFile('.browserslistrc', 'last 2 Chrome versions');
   await ng('build');
   await expectFileNotToExist('dist/test-project/polyfills-es5.js');
   await expectFileToMatch('dist/test-project/index.html', oneLineTrim`
@@ -40,7 +40,7 @@ export default async function () {
     const appArchitect = workspaceJson.projects['test-project'].architect;
     appArchitect.build.options.es5BrowserSupport = undefined;
   });
-  await writeFile('browserslist', 'IE 10');
+  await writeFile('.browserslistrc', 'IE 10');
   await ng('build');
   await expectFileToMatch('dist/test-project/polyfills-es5.js', 'core-js');
   await expectFileToMatch('dist/test-project/index.html', oneLineTrim`