ci: use nx for task orchestration for build/test/lint/type-check

.codesandbox/ci.json

@@ -2,5 +2,5 @@
   "buildCommand": "build:codesandbox",
   "packages": ["packages/react", "packages/react-components/react-components"],
   "sandboxes": ["x5u3t", "spnyu"],
-  "node": "14"
+  "node": "16"
 }

.devops/templates/tools.yml

@@ -2,7 +2,7 @@
 steps:
   - task: NodeTool@0
     inputs:
-      versionSpec: '14.18.1'
+      versionSpec: '16.18.1'
       checkLatest: false
     displayName: 'Install Node.js'
 

.github/CODEOWNERS

@@ -55,9 +55,9 @@
 
 #### NX related files
 /nx.json @microsoft/fluentui-react-build
-/workspace.json @microsoft/fluentui-react-build
 /migrations.json @microsoft/fluentui-react-build
 
+
 #### Meta and License stuff
 /LICENSE @microsoft/fluentui-react-build @justSlone @jurokapsiar @tudorpopams
 /packages/react/LICENSE @microsoft/fluentui-react-build @justSlone @jurokapsiar @tudorpopams
@@ -293,3 +293,4 @@ packages/react-experiments/src/components/TileList @ThomasMichon
 **/api-extractor.json @microsoft/fluentui-react-build
 **/api-extractor.unstable.json @microsoft/fluentui-react-build
 **/.swcrc @microsoft/fluentui-react-build
+**/project.json @microsoft/fluentui-react-build

.github/workflows/check-packages.yml

@@ -12,7 +12,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: 14.18.1
+          node-version: 16.18.1
           cache: 'yarn'
 
       - uses: tj-actions/changed-files@v34
@@ -44,7 +44,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: 14.18.1
+          node-version: 16.18.1
 
       - uses: actions/github-script@v6
         with:
@@ -70,7 +70,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: 14.18.1
+          node-version: 16.18.1
 
       - uses: actions/github-script@v6
         with:

.github/workflows/docsite-publish-chromatic.yml

@@ -37,7 +37,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: 14.18.1
+          node-version: 16.18.1
           cache: 'yarn'
 
       - name: Install packages

.github/workflows/docsite-publish-ghpages.yml

@@ -37,7 +37,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: 14.18.1
+          node-version: 16.18.1
           cache: 'yarn'
 
       - name: Install packages

.github/workflows/pr.yml

@@ -0,0 +1,198 @@
+name: PR CI
+
+on:
+  pull_request:
+    branches:
+      - master
+
+jobs:
+  prepare_env:
+    name: Prepare environment
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Setup node
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16.18.1'
+
+      - name: Cache node_modules
+        id: cache-node-modules
+        uses: actions/cache@v3
+        with:
+          path: '**/node_modules'
+          key: ${{ runner.os }}-node-modules-${{ hashFiles('**/yarn.lock') }}
+
+      - name: Cache Cypress Binary
+        id: cache-cypress-binary
+        uses: actions/cache@v3
+        with:
+          path: ~/.cache/Cypress
+          key: ${{ runner.os }}-cypress-binary-${{ hashFiles('**/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-cypress-binary-${{ hashFiles('**/yarn.lock') }}
+            ${{ runner.os }}-cypress-binary-
+
+      - name: Install packages
+        if: steps.cache-node-modules.outputs.cache-hit != 'true' || steps.cache-cypress-binary.outputs.cache-hit != 'true'
+        run: yarn install --prefer-offline --frozen-lockfile --non-interactive
+
+      - name: List the state of node modules
+        run: yarn list
+
+      - name: List node modules bin
+        continue-on-error: true
+        run: |
+          pwd
+          ls -la ~/.cache/
+          find . -name "node_modules" -prune
+
+  build_test_lint:
+    needs: [prepare_env]
+    name: Build, Test, Lint
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Setup node
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16.18.1'
+
+      - name: Cache node_modules
+        id: cache-node-modules
+        uses: actions/cache@v3
+        with:
+          path: '**/node_modules'
+          key: ${{ runner.os }}-node-modules-${{ hashFiles('**/yarn.lock') }}
+
+      - name: List node modules bin
+        run: |
+          pwd
+          find . -name "node_modules" -prune
+
+      - name: Install packages
+        if: steps.cache-node-modules.outputs.cache-hit != 'true'
+        run: yarn install --prefer-offline --frozen-lockfile --non-interactive
+
+      - name: Build, Test, Lint
+        run: yarn nx run-many --targets=build,test,lint,type-check --parallel=8
+
+  build:
+    needs: [prepare_env]
+    name: Build
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Setup node
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16.18.1'
+
+      - name: Cache node_modules
+        id: cache-node-modules
+        uses: actions/cache@v3
+        with:
+          path: '**/node_modules'
+          key: ${{ runner.os }}-node-modules-${{ hashFiles('**/yarn.lock') }}
+
+      - name: List node modules bin
+        run: |
+          pwd
+          find . -name "node_modules" -prune
+
+      - name: Install packages
+        if: steps.cache-node-modules.outputs.cache-hit != 'true'
+        run: yarn install --prefer-offline --frozen-lockfile --non-interactive
+
+      - name: Build
+        run: yarn nx run-many --targets=build --parallel=8
+
+  e2e:
+    needs: [prepare_env]
+    name: E2E target
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Setup node
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16.18.1'
+
+      - name: Cache node_modules
+        id: cache-node-modules
+        uses: actions/cache@v3
+        with:
+          path: '**/node_modules'
+          key: ${{ runner.os }}-node-modules-${{ hashFiles('**/yarn.lock') }}
+
+      - name: Cache Cypress Binary
+        id: cache-cypress-binary
+        uses: actions/cache@v3
+        with:
+          path: ~/.cache/Cypress
+          key: ${{ runner.os }}-cypress-binary-${{ hashFiles('**/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-cypress-binary-${{ hashFiles('**/yarn.lock') }}
+            ${{ runner.os }}-cypress-binary-
+
+      - name: Install packages
+        if: steps.cache-node-modules.outputs.cache-hit != 'true' || steps.cache-cypress-binary.outputs.cache-hit != 'true'
+        run: yarn install --prefer-offline --frozen-lockfile --non-interactive
+
+      - name: E2E
+        run: yarn nx run-many --targets=e2e
+
+  deploy:
+    needs: [prepare_env]
+    name: Deploy PR web
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Setup node
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16.18.1'
+
+      - name: Cache node_modules
+        id: cache-node-modules
+        uses: actions/cache@v3
+        with:
+          path: '**/node_modules'
+          key: ${{ runner.os }}-node-modules-${{ hashFiles('**/yarn.lock') }}
+
+      - name: Install packages
+        if: steps.cache-node-modules.outputs.cache-hit != 'true'
+        run: yarn install --prefer-offline --frozen-lockfile --non-interactive
+
+      - name: Build storybook
+        run: yarn nx run-many --targets=build-storybook --parallel=8
+
+      - name: Bundle
+        run: yarn nx run-many --targets=bundle --parallel=8
+
+    # - uses: actions/checkout@v3
+    # - uses: actions/setup-node@v3
+    #   with:
+    #     node-version-file: 'package.json'
+    #     cache: 'yarn'
+    #     cache-dependency-path: '**/yarn.lock'
+    # - name: install dependencies
+    #   run: yarn install --frozen-lockfile
+    # - name: NX run-many
+    #   run: yarn nx run-many --targets=build,test,lint,type-check --parallel=8
+
+    # - name: Upload npm package
+    #   uses: actions/upload-artifact@v3
+    #   with:
+    #     name: npm-package
+    #     path: abc

.nxignore

@@ -1,4 +1,5 @@
-#  Northstar files that doesn't belong to actual project to make nx workspace-lint pass
+# Northstar files that doesn't belong to actual project to make nx workspace-lint pass
+
 packages/fluentui/add-a-feature.md
 packages/fluentui/document-a-feature.md
 packages/fluentui/test-a-feature.md
@@ -8,3 +9,4 @@ packages/fluentui/CONTRIBUTING.md
 packages/fluentui/README.md
 packages/fluentui/lerna.json
 packages/fluentui/package.json
+**/dist/**

apps/perf-test-react-components/project.json

@@ -0,0 +1,6 @@
+{
+  "name": "@fluentui/perf-test-react-components",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "projectType": "application",
+  "implicitDependencies": []
+}

apps/perf-test/project.json

@@ -0,0 +1,6 @@
+{
+  "name": "@fluentui/perf-test",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "projectType": "application",
+  "implicitDependencies": []
+}

apps/pr-deploy-site/project.json

@@ -0,0 +1,6 @@
+{
+  "name": "@fluentui/pr-deploy-site",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "projectType": "application",
+  "implicitDependencies": []
+}

apps/public-docsite-resources/project.json

@@ -0,0 +1,6 @@
+{
+  "name": "@fluentui/public-docsite-resources",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "projectType": "application",
+  "implicitDependencies": []
+}

apps/public-docsite-v9/package.json

@@ -5,7 +5,7 @@
   "description": "Fluent UI React v9 documentation",
   "scripts": {
     "build": "just-scripts build",
-    "build-storybook": "build-storybook -o ./dist/storybook --docs && node ./.storybook/fix-title.js 'Fluent UI React v9' ../dist",
+    "build-storybook": "build-storybook --no-manager-cache -o ./dist/storybook --docs && node ./.storybook/fix-title.js 'Fluent UI React v9' ../dist",
     "chromatic:branch": "npx [email protected] --project-token $CHROMATIC_PROJECT_TOKEN --exit-zero-on-changes --build-script-name build-storybook",
     "chromatic": "npx [email protected] --project-token $CHROMATIC_PROJECT_TOKEN --exit-zero-on-changes --build-script-name build-storybook --branch-name microsoft:master",
     "clean": "just-scripts clean",

apps/public-docsite-v9/project.json

@@ -0,0 +1,7 @@
+{
+  "name": "@fluentui/public-docsite-v9",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "projectType": "application",
+  "implicitDependencies": [],
+  "tags": ["platform:web"]
+}

apps/public-docsite/project.json

@@ -0,0 +1,6 @@
+{
+  "name": "@fluentui/public-docsite",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "projectType": "application",
+  "implicitDependencies": []
+}

apps/react-18-tests-v8/cypress.config.ts

@@ -1,3 +1,29 @@
+import * as path from 'path';
 import { baseConfig } from '@fluentui/scripts-cypress';
+import { TsconfigPathsPlugin } from 'tsconfig-paths-webpack-plugin';
+
+registerTsPaths({
+  configFile: path.resolve(__dirname, '../../tsconfig.base.v8.json'),
+  config: baseConfig.component.devServer.webpackConfig,
+});
 
 export default baseConfig;
+
+// TODO copied from scripts/storybook/utils - make it generic helper (out of SB domain)
+function registerTsPaths(options: { configFile: string; config: import('webpack').Configuration }) {
+  // eslint-disable-next-line @typescript-eslint/no-shadow
+  const { config, configFile } = options;
+  const tsPaths = new TsconfigPathsPlugin({
+    configFile,
+  });
+
+  config.resolve = config.resolve ?? {};
+  config.resolve.plugins = config.resolve.plugins ?? [];
+
+  // remove existing to prevent multiple tspaths plugin
+  config.resolve.plugins = config.resolve.plugins.filter(plugin => !(plugin instanceof TsconfigPathsPlugin));
+
+  config.resolve.plugins.push(tsPaths);
+
+  return config;
+}

apps/react-18-tests-v8/jest.config.js

@@ -15,7 +15,8 @@ if (config.globals) {
   // override ts-jest config, otherwise it gets merged
   config.globals['ts-jest'] = {
     tsconfig: '<rootDir>/tsconfig.spec.json',
-    diagnostics: { warnOnly: true /* , exclude: ['packages/**']  */ },
+    // diagnostics: { warnOnly: true /* , exclude: ['packages/**']  */ },
+    isolatedModules: true,
   };
 }
 

apps/react-18-tests-v8/package.json

@@ -4,7 +4,7 @@
   "version": "8.0.0",
   "private": true,
   "scripts": {
-    "type-check": "tsc -p tsconfig.react-compat-check.json",
+    "type-check": "just-scripts type-check",
     "format": "prettier -w . --ignore-path ../.prettierignore",
     "format:check": "yarn format -c",
     "e2e": "cypress run --component",

apps/react-18-tests-v8/project.json

@@ -0,0 +1,6 @@
+{
+  "name": "@fluentui/react-18-tests-v8",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "projectType": "application",
+  "implicitDependencies": []
+}