refactor(@schematics/angular): use new .browserslistrc file in ng generate config

Note that the generated file does include `bl2bl` branding:

```
# This file was created by bl2bl2.
# Learn more at https://github.com/web-platform-dx/bl2bl
```

I opted to leave that in as it is technically accurate, though might be a bit confusing to users in this context.

Author: dgp1130

packages/angular/build/BUILD.bazel

@@ -47,6 +47,12 @@ bl2bl_bin.bl2bl(
     chdir = "%s/src/baseline" % package_name(),
 )
 
+filegroup(
+    name = "angular_baseline_config",
+    srcs = ["src/browserslist/package.json"],
+    visibility = ["//packages/schematics/angular:__pkg__"],
+)
+
 RUNTIME_ASSETS = glob(
     include = [
         "src/**/schema.json",

packages/schematics/angular/BUILD.bazel

@@ -42,11 +42,20 @@ copy_to_bin(
     srcs = glob(["**/schema.json"]),
 )
 
+# Vendor the Baseline configuration into this package.
+genrule(
+    name = "angular_baseline_config",
+    srcs = ["//packages/angular/build:angular_baseline_config"],
+    outs = ["config/baseline/package.json"],
+    cmd = "cp $< $@",
+)
+
 RUNTIME_ASSETS = [
     "collection.json",
     "migrations/migration-collection.json",
     "package.json",
     "utility/latest-versions/package.json",
+    ":angular_baseline_config",
 ] + glob(
     include = [
         "*/schema.json",

packages/schematics/angular/config/files/.browserslistrc.template

@@ -14,14 +14,20 @@ import {
   filter,
   mergeWith,
   move,
+  noop,
   strings,
   url,
 } from '@angular-devkit/schematics';
+import { promises as fs } from 'node:fs';
 import { posix as path } from 'node:path';
 import { relativePathToWorkspaceRoot } from '../utility/paths';
 import { getWorkspace as readWorkspace, updateWorkspace } from '../utility/workspace';
 import { Builders as AngularBuilder } from '../utility/workspace-models';
 import { Schema as ConfigOptions, Type as ConfigType } from './schema';
+import { JSONFile } from '../utility/json-file';
+import { addPackageJsonDependency, NodeDependencyType } from '../utility/dependencies';
+import { NodePackageInstallTask } from '@angular-devkit/schematics/tasks';
+import { latestVersions } from '../utility/latest-versions';
 
 export default function (options: ConfigOptions): Rule {
   switch (options.type) {
@@ -35,20 +41,42 @@ export default function (options: ConfigOptions): Rule {
 }
 
 function addBrowserslistConfig(options: ConfigOptions): Rule {
-  return async (host) => {
+  return async (host, context) => {
     const workspace = await readWorkspace(host);
     const project = workspace.projects.get(options.project);
     if (!project) {
       throw new SchematicsException(`Project name "${options.project}" doesn't not exist.`);
     }
 
-    return mergeWith(
-      apply(url('./files'), [
-        filter((p) => p.endsWith('.browserslistrc.template')),
-        applyTemplates({}),
-        move(project.root),
-      ]),
+    // Read Angular's default vendored `.browserslistrc` file.
+    const config = JSON.parse(
+      await fs.readFile(path.join(__dirname, 'baseline/package.json'), 'utf8'),
+    );
+    const widelyAvailableOnDate = config.bl2bl.baselineThreshold as string;
+
+    const pkgJson = new JSONFile(host, 'package.json');
+    pkgJson.modify(
+      ['browserslist'],
+      ['extends browserslist-config-baseline'],
+      /* insertInOrder */ false,
+    );
+    pkgJson.modify(
+      ['browserslist-config-baseline'],
+      {
+        widelyAvailableOnDate,
+      },
+      /* insertInOrder */ false,
     );
+
+    addPackageJsonDependency(host, {
+      type: NodeDependencyType.Dev,
+      name: 'browserslist-config-baseline',
+      version: latestVersions['browserslist-config-baseline'],
+    });
+
+    context.addTask(new NodePackageInstallTask());
+
+    return noop;
   };
 }
 

packages/schematics/angular/config/index.ts

@@ -92,9 +92,16 @@ describe('Config Schematic', () => {
   });
 
   describe(`when 'type' is 'browserslist'`, () => {
-    it('should create a .browserslistrc file', async () => {
+    it('should create a browserslist configuration', async () => {
       const tree = await runConfigSchematic(ConfigType.Browserslist);
-      expect(tree.exists('projects/foo/.browserslistrc')).toBeTrue();
+      const config = JSON.parse(tree.readContent('package.json'));
+
+      expect(config.browserslist).toEqual(['extends browserslist-config-baseline']);
+      expect(config['browserslist-config-baseline']).toEqual({
+        widelyAvailableOnDate: jasmine.any(String),
+      });
+
+      expect(config.devDependencies['browserslist-config-baseline']).toBeDefined();
     });
   });
 });

packages/schematics/angular/config/index_spec.ts

@@ -7,6 +7,7 @@
     "@types/jasmine": "~5.1.0",
     "@types/node": "^20.17.19",
     "browser-sync": "^3.0.0",
+    "browserslist-config-baseline": "^0.4.0",
     "express": "^5.1.0",
     "jasmine-core": "~5.6.0",
     "jasmine-spec-reporter": "~7.0.0",