chore: add Lage for dependency-aware incremental builds and tests

.github/copilot-instructions.md

@@ -57,6 +57,9 @@ Run all commands from the monorepo root. Use workspace flags to target a single
 | Build one package | `npm run build -w @microsoft/fast-element` |
 | Test all | `npm run test` |
 | Test one package | `npm run test -w @microsoft/fast-element` |
+| Test Chromium only | `npm run test:chromium` |
+| Build/test changed only | `lage build --since origin/main` |
+| Test changed only | `lage test:node test:chromium --since origin/main` |
 | Lint | `npm run lint` |
 | Lint fix | `npm run lint:fix` |
 | Format check | `npm run format:check` |
@@ -68,6 +71,8 @@ Run all commands from the monorepo root. Use workspace flags to target a single
 | Check change files | `npm run checkchange` |
 | API docs | `npm run doc -w @microsoft/fast-element` |
 
+Build and test commands use [Lage](https://microsoft.github.io/lage/) for dependency-aware task execution. Lage respects the package dependency graph and can run incrementally with `--since <ref>` to only build/test changed packages and their dependents. The CI pipelines use `--since` for pull requests to skip unchanged packages.
+
 All `lint`, `biome:check`, `biome:fix`, and `biome:ci` commands use `biome-changed`, which runs biome only on files with uncommitted git changes. The `format:check` and `format` commands use biome's own `--changed` flag to compare against the default branch.
 
 ## Project Structure
@@ -127,6 +132,7 @@ Key constraints (details in [TypeScript skill](./skills/typescript/SKILL.md)):
 | Tool | Purpose |
 |---|---|
 | npm workspaces | Package management |
+| Lage | Task runner — dependency-aware builds and incremental testing |
 | TypeScript | Compilation |
 | Rollup | Bundling (`fast-element` only) |
 | Playwright | Testing |

.github/workflows/ci-validate-platforms.yml

@@ -33,7 +33,9 @@ jobs:
           git config --global core.eol lf
 
       - name: Checkout Branch
-        uses: actions/checkout@v2
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
 
       - if: ${{ github.event_name == 'pull_request' }}
         run: |
@@ -66,11 +68,11 @@ jobs:
         run: cargo install wasm-pack
 
       - name: Build workspaces
-        run: npm run build
+        run: npx lage build ${{ github.event_name == 'pull_request' && '--since origin/main' || '' }}
 
       - name: Install playwright dependencies and browsers
         run: |
           npx playwright install --with-deps
 
       - name: Run tests in all Packages
-        run: npm run test
+        run: npx lage test:node test:playwright ${{ github.event_name == 'pull_request' && '--since origin/main' || '' }}

.github/workflows/ci-validate-pr.yml

@@ -52,14 +52,14 @@ jobs:
       run: cargo install wasm-pack
 
     - name: Build workspaces
-      run: npm run build
+      run: npx lage build ${{ github.event_name == 'pull_request' && format('--since origin/{0}', github.event.pull_request.base.ref) || '' }}
 
     - name: Install playwright dependencies and browsers
       run: |
         npx playwright install --with-deps
 
     - name: Testing unit tests
-      run: npm run test:chromium
+      run: npx lage test:node test:chromium ${{ github.event_name == 'pull_request' && format('--since origin/{0}', github.event.pull_request.base.ref) || '' }}
 
     - name: Testing final validation
       run: npm run test:validation

CONTRIBUTING.md

@@ -55,6 +55,12 @@ After the initial install, you can re-build all workspaces in the future with:
 npm run build
 ```
 
+Build and test commands are powered by [Lage](https://microsoft.github.io/lage/), which respects the package dependency graph. To build or test only packages that have changed since a given ref, use the `--since` flag:
+
+```bash
+lage build --since origin/main
+```
+
 ### Testing
 
 To run all tests for all packages, use the following command:
@@ -63,6 +69,18 @@ To run all tests for all packages, use the following command:
 npm run test
 ```
 
+To run only Chromium tests (faster for local development):
+
+```bash
+npm run test:chromium
+```
+
+To run tests only for packages changed since the `main` branch:
+
+```bash
+lage test:node test:chromium --since origin/main
+```
+
 This command can also be run from within individual package folders to execute only tests from that package.
 
 :::note

change/@microsoft-fast-element-1775848507.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "Add test:chromium script for Chromium-only Playwright test runs",
+  "packageName": "@microsoft/fast-element",
+  "email": "7559015+janechu@users.noreply.github.com",
+  "dependentChangeType": "none"
+}

change/@microsoft-fast-html-1775848507.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "Add test:chromium script for Chromium-only Playwright test runs",
+  "packageName": "@microsoft/fast-html",
+  "email": "7559015+janechu@users.noreply.github.com",
+  "dependentChangeType": "none"
+}

change/@microsoft-fast-ssr-1775848507.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "Add test:chromium script for Chromium-only Playwright test runs",
+  "packageName": "@microsoft/fast-ssr",
+  "email": "7559015+janechu@users.noreply.github.com",
+  "dependentChangeType": "none"
+}

lage.config.js

@@ -0,0 +1,26 @@
+/** @type {import("lage").ConfigOptions} */
+module.exports = {
+    pipeline: {
+        build: {
+            dependsOn: ["^build"],
+            outputs: ["dist/**", "wasm/**"],
+        },
+        "test:node": {
+            dependsOn: ["build"],
+            outputs: [],
+        },
+        "test:playwright": {
+            dependsOn: ["build"],
+            outputs: [],
+        },
+        "test:chromium": {
+            dependsOn: ["build"],
+            outputs: [],
+        },
+    },
+    cacheOptions: {
+        outputGlob: ["dist/**", "wasm/**"],
+        environmentGlob: ["package.json", "tsconfig.json", "lage.config.js"],
+    },
+    ignore: ["change/**", "*.md", ".github/**"],
+};

package.json

@@ -28,7 +28,7 @@
   },
   "scripts": {
     "bump": "beachball bump",
-    "build": "npm run build --workspaces --if-present",
+    "build": "lage build",
     "change": "beachball change --dependent-change-type none",
     "checkchange": "beachball check  --scope \"!sites/*\" --changehint \"Run 'npm run change' to generate a change file\"",
     "check": "beachball check ",
@@ -39,8 +39,8 @@
     "test:diff:error": "echo \"Untracked files exist, try running npm prepare to identify the culprit.\" && exit 1",
     "test:diff": "git update-index --refresh && git diff-index --quiet HEAD -- || npm run test:diff:error",
     "test:validation": "npm run test:diff",
-    "test": "npm run test:node -ws --if-present && npm run test:playwright -ws --if-present -- --project=*",
-    "test:chromium": "npm run test:node -ws --if-present && npm run test:playwright -ws --if-present -- --project=chromium",
+    "test": "lage test:node test:playwright",
+    "test:chromium": "lage test:node test:chromium",
     "watch": "tsc -p ./tsconfig.json -w --preserveWatchOutput",
     "format:check": "biome format --changed --no-errors-on-unmatched .",
     "format": "biome format --changed --no-errors-on-unmatched --fix --write .",
@@ -64,6 +64,7 @@
     "esm": "3.2.25",
     "express": "4.22.1",
     "glob": "10.5.0",
+    "lage": "2.15.8",
     "lefthook": "2.1.4",
     "rollup": "4.59.0",
     "rollup-plugin-filesize": "10.0.0",

packages/fast-element/package.json

@@ -114,6 +114,7 @@
     "lint": "biome-changed",
     "lint:fix": "biome-changed -- --fix",
     "test:playwright": "playwright test",
+    "test:chromium": "playwright test --project=chromium",
     "test-server": "npx vite test/ --clearScreen false",
     "test": "npm run lint && npm run doc:ci && npm run doc:exports:ci && npm run test:playwright",
     "test:ci": "npm run doc:ci && npm run doc:exports:ci && npm run test:playwright"

packages/fast-html/package.json

@@ -33,10 +33,10 @@
     "lint:fix": "biome-changed -- --fix",
     "install-playwright-browsers": "npm run playwright install",
     "prepublishOnly": "npm run clean && npm run build",
-    "test-server": "npx vite test/ --clearScreen false",
+    "test-server": "npx vite test/ --clearScreen false --port 5174",
     "test:playwright": "playwright test",
-    "test:rules": "sg test --skip-snapshot-tests",
-    "test": "npm run test:playwright && npm run test:rules",
+    "test:chromium": "playwright test --project=chromium",
+    "test": "npm run test:playwright",
     "test:ui": "concurrently -k -n fast-element,fast-html,playwright \"npm run dev --workspace=@microsoft/fast-element\" \"npm:watch\" \"npx playwright test --ui\"",
     "watch": "npm run build:tsc -- -w --preserveWatchOutput"
   },

packages/fast-html/playwright.config.ts

@@ -20,7 +20,7 @@ export default defineConfig({
     ],
     webServer: {
         command: "npm run test-server",
-        port: 5173,
+        port: 5174,
         reuseExistingServer: true,
     },
 });

packages/fast-ssr/package.json

@@ -29,6 +29,7 @@
     "test": "npm run test:node && npm run test:playwright",
     "test:node": "node scripts/run-tests.mjs",
     "test:playwright": "npm run pretest && playwright test",
+    "test:chromium": "npm run pretest && playwright test --project=chromium",
     "test-server": "node server/dist/server.js"
   },
   "deprecated": "This package is deprecated. Please use @microsoft/fast-build and @microsoft/webui instead.",

sites/website/package.json

@@ -27,5 +27,9 @@
     "@11ty/eleventy-navigation": "^1.0.5",
     "@11ty/eleventy-plugin-syntaxhighlight": "^5.0.2",
     "@microsoft/api-documenter": "7.29.7"
+  },
+  "devDependencies": {
+    "@microsoft/fast-build": "^0.3.2",
+    "@microsoft/fast-element": "^2.10.3"
   }
 }