feat(commerce): daff.json specifies driver version for angular.json

package.json

@@ -69,6 +69,7 @@
     "@ngrx/schematics": "^21",
     "@ngrx/store-devtools": "^21",
     "@nx/azure-cache": "^4.0.0",
+    "@nx/devkit": "^20.8.4",
     "@schematics/angular": "^21",
     "@stylistic/eslint-plugin": "^2.7.2",
     "@stylistic/stylelint-plugin": "^5.0.0",
@@ -124,6 +125,7 @@
     "tsconfig-paths": "^3.14.2",
     "tslib": "^2.6.2",
     "tsx": "^4.20.6",
+    "type-fest": "^5.6.0",
     "typescript": "~5.9.2",
     "typescript-eslint": "^8.53.0",
     "vercel": "^21.3.3",

tools/schematics/builders.json

@@ -0,0 +1,14 @@
+{
+  "builders": {
+    "application": {
+      "implementation": "./versioning/application-builder",
+      "schema": "./versioning/daff.schema.json",
+      "description": "Wraps the angular application builder with driver conditions."
+    },
+		"sync": {
+      "implementation": "./versioning/sync-builder",
+      "schema": "./versioning/daff.schema.json",
+      "description": "Modifies application build conditions for the specified driver versions."
+    }
+  }
+}

tools/schematics/ng-add/files/app/daff/external-router/drivers/dynamic.ts

@@ -18,9 +18,11 @@ import {
   DaffDriverConfig,
 } from '@daffodil/dev-tools';
 import { DaffExternallyResolvableUrl } from '@daffodil/external-router';
-import { DaffExternalRouterDriverInterface } from '@daffodil/external-router/driver';
+import {
+  DaffExternalRouterDriver,
+  DaffExternalRouterDriverInterface,
+} from '@daffodil/external-router/driver';
 import { DaffExternalRouterInMemoryDriver } from '@daffodil/external-router/driver/in-memory';
-import { DaffExternalRouterMagentoDriver } from '@daffodil/external-router/driver/magento/2.4.3';
 import { DaffShopifyExternalRouterDriver } from '@daffodil/external-router/driver/shopify';
 
 import { FakeExternalRouterService } from './fake';
@@ -35,7 +37,7 @@ export class DynamicExternalRouterDriver implements DaffExternalRouterDriverInte
   public readonly driverChanged$ = this.driverChange$.asObservable();
 
   private inmemoryDriver = inject(DaffExternalRouterInMemoryDriver);
-  private magentoDriver = inject(DaffExternalRouterMagentoDriver);
+  private magentoDriver = inject<DaffExternalRouterDriverInterface>(DaffExternalRouterDriver);
   private shopifyDriver = inject(DaffShopifyExternalRouterDriver);
   private fakeDriver = inject(FakeExternalRouterService);
 

tools/schematics/ng-add/generators/daff-config/daff-config.spec.ts

@@ -0,0 +1,107 @@
+import { Tree } from '@angular-devkit/schematics';
+import { SchematicTestRunner } from '@angular-devkit/schematics/testing';
+import * as path from 'path';
+import { firstValueFrom } from 'rxjs';
+
+import { addBuildCondition } from './daff-config';
+import { NgAddOptions } from '../../schema';
+
+const collectionPath = path.join(__dirname, '../../../collection.json');
+
+const TEST_DRIVER_VERSION = '2.4.3';
+
+const buildAngularJson = (projectName: string) => ({
+  version: 1,
+  newProjectRoot: 'projects',
+  projects: {
+    [projectName]: {
+      projectType: 'application',
+      root: `projects/${projectName}`,
+      sourceRoot: `projects/${projectName}/src`,
+      architect: {
+        build: {
+          builder: '@angular-devkit/build-angular:application',
+          options: {},
+          configurations: {
+            production: {},
+          },
+        },
+      },
+    },
+  },
+});
+
+describe('addBuildCondition', () => {
+  const projectName = 'test-app';
+  let runner: SchematicTestRunner;
+  let tree: Tree;
+
+  beforeEach(() => {
+    runner = new SchematicTestRunner('schematics', collectionPath);
+    tree = Tree.empty();
+    tree.create('/angular.json', JSON.stringify(buildAngularJson(projectName), null, 2));
+  });
+
+  it('sets the daffodil commerce builder and driver version for the magento driver', async () => {
+    const options: NgAddOptions = { project: projectName, driver: 'magento', driverVersion: TEST_DRIVER_VERSION };
+    const rule = addBuildCondition(options, projectName);
+
+    const resultTree = await firstValueFrom(runner.callRule(rule, tree));
+
+    const angular = JSON.parse(resultTree.read('/angular.json')?.toString() ?? '');
+    const buildOptions = angular.projects[projectName].architect.build.options;
+    expect(buildOptions.builder).toBe('@daffodil/commerce:application');
+    expect(buildOptions.drivers).toEqual({ magento: TEST_DRIVER_VERSION });
+  });
+
+  it('leaves the build options untouched when no driver version is provided', async () => {
+    const options: NgAddOptions = { project: projectName, driver: 'magento' };
+    const rule = addBuildCondition(options, projectName);
+
+    const resultTree = await firstValueFrom(runner.callRule(rule, tree));
+
+    const angular = JSON.parse(resultTree.read('/angular.json')?.toString() ?? '');
+    expect(angular.projects[projectName].architect.build.options?.builder).toBeUndefined();
+  });
+
+  it('leaves the build options untouched for the demo driver', async () => {
+    const options: NgAddOptions = { project: projectName, driver: 'demo', driverVersion: TEST_DRIVER_VERSION };
+    const rule = addBuildCondition(options, projectName);
+
+    const resultTree = await firstValueFrom(runner.callRule(rule, tree));
+
+    const angular = JSON.parse(resultTree.read('/angular.json')?.toString() ?? '');
+    expect(angular.projects[projectName].architect.build.options?.builder).toBeUndefined();
+  });
+
+  it('leaves the build options untouched for shopify or in-memory drivers', async () => {
+    for (const driver of <const>['shopify', 'in-memory']) {
+      const scopedTree = Tree.empty();
+      scopedTree.create('/angular.json', JSON.stringify(buildAngularJson(projectName), null, 2));
+      const options: NgAddOptions = { project: projectName, driver, driverVersion: TEST_DRIVER_VERSION };
+      const rule = addBuildCondition(options, projectName);
+
+      const resultTree = await firstValueFrom(runner.callRule(rule, scopedTree));
+
+      const angular = JSON.parse(resultTree.read('/angular.json')?.toString() ?? '');
+      expect(angular.projects[projectName].architect.build.options?.builder).toBeUndefined();
+    }
+  });
+
+  it('overwrites existing builder and driver options when syncing', async () => {
+    const baseline = buildAngularJson(projectName);
+    (<any>baseline.projects[projectName].architect.build.options).builder = '@angular-devkit/build-angular:application';
+    (<any>baseline.projects[projectName].architect.build.options).drivers = { magento: '2.0.0' };
+    tree.overwrite('/angular.json', JSON.stringify(baseline, null, 2));
+
+    const options: NgAddOptions = { project: projectName, driver: 'magento', driverVersion: TEST_DRIVER_VERSION };
+    const rule = addBuildCondition(options, projectName);
+
+    const resultTree = await firstValueFrom(runner.callRule(rule, tree));
+
+    const angular = JSON.parse(resultTree.read('/angular.json')?.toString() ?? '');
+    const buildOptions = angular.projects[projectName].architect.build.options;
+    expect(buildOptions.builder).toBe('@daffodil/commerce:application');
+    expect(buildOptions.drivers).toEqual({ magento: TEST_DRIVER_VERSION });
+  });
+});

tools/schematics/ng-add/generators/daff-config/daff-config.ts

@@ -0,0 +1,37 @@
+import {
+  Rule,
+  SchematicContext,
+  Tree,
+} from '@angular-devkit/schematics';
+import { updateWorkspace } from '@schematics/angular/utility/workspace';
+
+import { isSupportedPlatform } from '../../../versioning/public_api';
+import { NgAddOptions } from '../../schema';
+
+const shouldScaffoldDaffConfig = (options: NgAddOptions): boolean =>
+  options.driver === 'magento' || options.driver === 'demo';
+
+export const addBuildCondition = (options: NgAddOptions, projectName_: string): Rule => {
+  if (!shouldScaffoldDaffConfig(options)) {
+    return (tree: Tree) => tree;
+  }
+
+  return (tree: Tree, context: SchematicContext) => isSupportedPlatform(options.driver) && options.driverVersion
+    ? updateWorkspace(async (workspace) => {
+      for (const [projectName, project] of [...workspace.projects.entries()].filter(([pName, p]) => p.extensions.projectType === 'application')) {
+        const target = project?.targets.get('build');
+        if (target && options.driver && options.driverVersion) {
+          target.options ??= {};
+          target.options.builder = '@daffodil/commerce:application';
+          target.options.drivers = {
+            [options.driver]: options.driverVersion,
+          };
+          workspace.projects.set(
+            projectName,
+            project,
+          );
+        }
+      }
+    })(tree, context)
+    : tree;
+};

tools/schematics/ng-add/index.ts

@@ -8,6 +8,7 @@ import { NodePackageInstallTask } from '@angular-devkit/schematics/tasks';
 import { getWorkspace } from '@schematics/angular/utility/workspace';
 import chalk from 'chalk';
 
+import { addBuildCondition } from './generators/daff-config/daff-config';
 import { addDependenciesToPackageJson } from './generators/dependencies';
 import { initAppProviders } from './generators/providers/init';
 import { initAppRouting } from './generators/routing/init';
@@ -31,7 +32,8 @@ export function ngAdd(options: NgAddOptions): Rule {
     }
 
     const workspace = await getWorkspace(tree);
-    const project = workspace.projects.get(options.project || <string>workspace.extensions.defaultProject);
+    const projectName = options.project || <string>workspace.extensions.defaultProject;
+    const project = workspace.projects.get(projectName);
 
     if (!project) {
       throw new Error(`Project "${options.project}" not found.`);
@@ -53,6 +55,9 @@ export function ngAdd(options: NgAddOptions): Rule {
     // Add template files for demo components
     rules.push(addTemplateFiles(options, project));
 
+    // pre-populate angular.json build conditions (magento only)
+    rules.push(addBuildCondition(options, projectName));
+
     // Schedule package installation
     if (!options.skipPackageJson) {
       context.addTask(new NodePackageInstallTask());