diff --git a/.github/workflows/a11y_tests.yml b/.github/workflows/a11y_tests.yml index 2b59752ac6..0159c3a868 100644 --- a/.github/workflows/a11y_tests.yml +++ b/.github/workflows/a11y_tests.yml @@ -8,15 +8,12 @@ on: - 'packages/dialtone-vue2' - 'packages/dialtone-vue3' -env: - HUSKY: 0 - concurrency: group: ${{ github.workflow }}-${{ github.ref }} cancel-in-progress: true jobs: - a11y_tests: + dialtone-vue-2: runs-on: ubuntu-latest steps: - name: Check out branch @@ -53,10 +50,55 @@ jobs: run: pnpm install --frozen-lockfile - name: Build Dialtone library and documentation site - run: pnpm nx run --verbose dialtone-vue3-documentation:build + run: pnpm nx run --verbose dialtone-vue2:build-docs - name: Start storybook and run a11y tests run: | pnpm dlx concurrently -k -s first -n "SB,TEST" -c "magenta,blue" \ + "pnpm dlx http-server packages/dialtone-vue2/storybook-static --port 9010 --silent" \ + "pnpm dlx wait-on tcp:9010 && pnpm nx run --verbose dialtone-vue2:test:a11y" + + dialtone-vue-3: + runs-on: ubuntu-latest + steps: + - name: Check out branch + uses: actions/checkout@v4 + with: + ref: "refs/pull/${{ github.event.pull_request.number }}/merge" + + # This hangs on node 18 for some reason. + - name: Use Node.js + uses: actions/setup-node@v3 + with: + node-version: 20 + + - name: Use pnpm + uses: pnpm/action-setup@v2 + with: + version: 8 + run_install: false + + - name: Get pnpm store directory + shell: bash + run: | + echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV + + - name: Setup pnpm cache + uses: actions/cache@v3 + with: + path: ${{ env.STORE_PATH }} + key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }} + restore-keys: | + ${{ runner.os }}-pnpm-store- + + - name: Install dependencies + run: pnpm install --frozen-lockfile + + - name: Build Dialtone library and documentation site + run: pnpm nx run --verbose dialtone-vue3:build-docs + + - name: Start storybook and run a11y tests + run: | + pnpm dlx concurrently -k -s first -n "SB,TEST" -c "green,yellow" \ "pnpm dlx http-server packages/dialtone-vue3/storybook-static --port 9010 --silent" \ - "pnpm dlx wait-on tcp:9010 && pnpm nx run --verbose dialtone-vue3-documentation:test:a11y" + "pnpm dlx wait-on tcp:9010 && pnpm nx run --verbose dialtone-vue3:test:a11y" diff --git a/.github/workflows/visual_tests.yml b/.github/workflows/visual_tests.yml index bcc61dc27c..37bf3af6f7 100644 --- a/.github/workflows/visual_tests.yml +++ b/.github/workflows/visual_tests.yml @@ -6,12 +6,17 @@ on: pull_request: types: [ labeled, synchronize, opened ] +concurrency: + group: ${{ github.workflow }}-${{ github.ref }} + cancel-in-progress: true + jobs: filter-actions: runs-on: ubuntu-latest permissions: pull-requests: read outputs: + dialtone-vue-2: ${{ steps.filter.outputs.dialtone-vue-2 }} dialtone-vue-3: ${{ steps.filter.outputs.dialtone-vue-3 }} steps: - name: Checkout @@ -22,15 +27,20 @@ jobs: id: filter with: filters: | + dialtone-vue-2: + - 'packages/dialtone/**' + - 'packages/dialtone-icons/**' + - 'packages/dialtone-tokens/**' + - 'packages/dialtone-vue2/**' dialtone-vue-3: - 'packages/dialtone/**' - 'packages/dialtone-icons/**' - 'packages/dialtone-tokens/**' - 'packages/dialtone-vue3/**' - prompt_for_label: + prompt-for-label: needs: filter-actions - if: (needs.filter-actions.outputs.dialtone-vue-3 == 'true' && (github.event_name == 'pull_request' && !contains(github.event.pull_request.labels.*.name, 'no-visual-test') && !contains(github.event.pull_request.labels.*.name, 'visual-test-ready'))) + if: ((needs.filter-actions.outputs.dialtone-vue-2 == 'true' || needs.filter-actions.outputs.dialtone-vue-3 == 'true') && (github.event_name == 'pull_request' && !contains(github.event.pull_request.labels.*.name, 'no-visual-test') && !contains(github.event.pull_request.labels.*.name, 'visual-test-ready'))) runs-on: ubuntu-latest steps: - uses: actions/github-script@v6 @@ -38,14 +48,54 @@ jobs: script: | throw "Please add either the visual-test-ready or no-visual-test label to this PR depending on whether you want to run visual tests or not. It is recommended to run visual tests if your PR changes any UI."; - test: + dialtone-vue-2: needs: filter-actions - if: (needs.filter-actions.outputs.dialtone-vue-3 == 'true' && (contains(github.event.pull_request.labels.*.name, 'visual-test-ready') || github.event_name == 'push')) + if: (needs.filter-actions.outputs.dialtone-vue-2 == 'true' && (contains(github.event.pull_request.labels.*.name, 'visual-test-ready') || github.event_name == 'push')) + + runs-on: ubuntu-latest + steps: + - name: Check out branch + uses: actions/checkout@v4 + + - name: Use Node.js + uses: actions/setup-node@v3 + with: + node-version: 20 - concurrency: - group: ${{ github.workflow }}-${{ github.ref }} - cancel-in-progress: true + - name: Use pnpm + uses: pnpm/action-setup@v2 + with: + version: 8 + run_install: false + - name: Get pnpm store directory + shell: bash + run: | + echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV + + - name: Setup pnpm cache + uses: actions/cache@v3 + with: + path: ${{ env.STORE_PATH }} + key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }} + restore-keys: | + ${{ runner.os }}-pnpm-store- + + - name: Install dependencies + run: pnpm install --frozen-lockfile + + - name: Build Dialtone-vue 2 library and documentation site + run: pnpm nx run --verbose dialtone-vue2:build-docs + + - name: Run Dialtone-vue 2 Visual Tests + env: + PERCY_TOKEN: ${{ secrets.PERCY_TOKEN }} + PERCY_TARGET_BRANCH: ${{ github.base_ref }} + run: pnpm nx run --verbose dialtone-vue2:test:visual + + dialtone-vue-3: + needs: filter-actions + if: (needs.filter-actions.outputs.dialtone-vue-3 == 'true' && (contains(github.event.pull_request.labels.*.name, 'visual-test-ready') || github.event_name == 'push')) runs-on: ubuntu-latest steps: - name: Check out branch @@ -78,11 +128,11 @@ jobs: - name: Install dependencies run: pnpm install --frozen-lockfile - - name: Build Dialtone library and documentation site - run: pnpm nx run --verbose dialtone-vue3-documentation:build + - name: Build Dialtone-vue 3 library and documentation site + run: pnpm nx run --verbose dialtone-vue3:build-docs - - name: Run Visual Tests + - name: Run Dialtone-vue 3 Visual Tests env: PERCY_TOKEN: ${{ secrets.PERCY_TOKEN }} PERCY_TARGET_BRANCH: ${{ github.base_ref }} - run: pnpm nx run --verbose dialtone-vue3-documentation:test:visual + run: pnpm nx run --verbose dialtone-vue3:test:visual diff --git a/packages/dialtone-vue2/package.json b/packages/dialtone-vue2/package.json index 8b332726e9..7af5000056 100644 --- a/packages/dialtone-vue2/package.json +++ b/packages/dialtone-vue2/package.json @@ -17,11 +17,11 @@ "prepublishOnly": "pnpm run build", "pretest": "pnpm run clean", "start": "pnpm run storybook", - "storybook": "STORYBOOK_ENV=development storybook dev -p 9010", + "storybook": "STORYBOOK_ENV=development storybook dev -p ${PORT:-9010}", "storybook:clean": "rm -rf ./storybook-static", "storybook:build": "pnpm run storybook:clean && pnpm run build:documentation:functions && STORYBOOK_ENV=production pnpm exec storybook build", "storybook:build:docs-only": "pnpm run storybook:build --docs", - "test:a11y": "pnpm exec test-storybook --url http://localhost:9010/", + "test:a11y": "pnpm exec test-storybook --url http://localhost:${PORT:-9010}/", "test:visual": "pnpm exec percy storybook --disable-cache --config ./percy.config.cjs --verbose ./storybook-static", "test": "pnpm exec vitest run --test-timeout=10000", "test:one": "pnpm exec vitest related --run", diff --git a/packages/dialtone-vue2/project.json b/packages/dialtone-vue2/project.json index ca1c8cc9e7..de918336aa 100644 --- a/packages/dialtone-vue2/project.json +++ b/packages/dialtone-vue2/project.json @@ -20,7 +20,7 @@ "executor": "nx:run-script", "dependsOn": [ { - "projects": [ "dialtone-icons" ], + "projects": [ "dialtone", "dialtone-icons" ], "target": "build", "params": "ignore" } diff --git a/packages/dialtone-vue3/package.json b/packages/dialtone-vue3/package.json index 9ea64a1cd4..bf3e86afcd 100644 --- a/packages/dialtone-vue3/package.json +++ b/packages/dialtone-vue3/package.json @@ -17,11 +17,11 @@ "prepublishOnly": "pnpm run build", "pretest": "pnpm run clean", "start": "pnpm run storybook", - "storybook": "STORYBOOK_ENV=development storybook dev -p 9010", + "storybook": "STORYBOOK_ENV=development storybook dev -p ${PORT:-9010}", "storybook:clean": "rm -rf ./storybook-static", "storybook:build": "pnpm run storybook:clean && pnpm run build:documentation:functions && STORYBOOK_ENV=production pnpm exec storybook build", "storybook:build:docs-only": "pnpm run storybook:build --docs", - "test:a11y": "pnpm exec test-storybook --url http://localhost:9010/", + "test:a11y": "pnpm exec test-storybook --url http://localhost:${PORT:-9010}/", "test:visual": "pnpm exec percy storybook --disable-cache --config ./percy.config.cjs --verbose ./storybook-static", "test": "pnpm exec vitest run --test-timeout=10000", "test:one": "pnpm exec vitest related --run", diff --git a/packages/dialtone-vue3/project.json b/packages/dialtone-vue3/project.json index 4c938f8393..8ec34d2a9a 100644 --- a/packages/dialtone-vue3/project.json +++ b/packages/dialtone-vue3/project.json @@ -20,7 +20,7 @@ "executor": "nx:run-script", "dependsOn": [ { - "projects": [ "dialtone-icons" ], + "projects": [ "dialtone", "dialtone-icons" ], "target": "build", "params": "ignore" }