Skip to content

Maintain DOM tree when top bar is undefined in reframe #11640

Maintain DOM tree when top bar is undefined in reframe

Maintain DOM tree when top bar is undefined in reframe #11640

Workflow file for this run

name: Accessibility and Visual Regression Tests
on:
push:
branches:
- main
- next
paths:
- 'polaris-react/src/**'
- 'polaris-react/playground/**'
- 'polaris-react/.storybook/**'
- 'polaris-tokens/src/**'
pull_request:
paths:
- 'polaris-react/src/**'
- 'polaris-react/playground/**'
- 'polaris-react/.storybook/**'
- 'polaris-tokens/src/**'
jobs:
accessibility_test:
name: 'Accessibility test'
runs-on: ubuntu-latest
steps:
- name: Checkout branch
uses: actions/checkout@v3
- name: Free up space on GitHub image
run: |
# Based on the official advice:
# https://github.com/actions/virtual-environments/issues/2840#issuecomment-790492173
sudo rm -rf /usr/share/dotnet
sudo rm -rf /opt/ghc
sudo rm -rf "/usr/local/share/boost"
sudo rm -rf "$AGENT_TOOLSDIRECTORY"
- name: Setup pnpm
uses: pnpm/action-setup@v3
- name: Setup Node from .nvmrc
uses: actions/setup-node@v4
with:
node-version-file: '.nvmrc'
cache: pnpm
- name: Restore node_module cache
id: node-cache
uses: actions/cache@v3
with:
path: |
**/.turbo
node_modules/.cache/turbo
polaris-react/build-internal/cache
key: ${{ runner.os }}-accessibility-test-v3-${{ github.sha }}
restore-keys: |
${{ runner.os }}-accessibility-test-v3-
- name: Install dependencies
run: pnpm install --frozen-lockfile
# Figures out the version of playwright that's installed.
# 1. Because we don't know what version pnpm will resolve it to, we have
# to use `pnpm why` to get the actual installed version.
# 2. Because we're in a workspace, we need to make sure we get the version
# for the workspace, not the root, hence the `--filter`.
# 3. grep & head come pre-installed in the Ubuntu runner, so we use them
# to get the correct version string.
# 4. Finally, we use sed to extract just the version number (eg; '1.22.0')
# The result is stored in steps.playwright-version.outputs.version
- name: Get installed Playwright version
id: playwright-version
run: echo "version=$(pnpm --filter='@shopify/polaris' why playwright --parseable | grep -E -o '/playwright@[^/]*?/' | head -1 | sed 's,/playwright@\([^/]*\)/,\1,')" >> $GITHUB_OUTPUT
# Attempt to restore the correct Playwright browser binaries based on the
# currently installed version of Playwright (The browser binary versions
# may change with Playwright versions).
# Note: Playwright's cache directory is hard coded because that's what it
# says to do in the docs. There doesn't appear to be a command that prints
# it out for us.
- name: Restore Playwright cache
id: playwright-cache
uses: actions/cache@v3
with:
path: ~/.cache/ms-playwright
key: '${{ runner.os }}-playwright-${{ steps.playwright-version.outputs.version }}'
# As a fallback, if the Playwright version has changed, try use the
# most recently cached version. There's a good chance that at least one
# of the browser binary versions haven't been updated, so Playwright can
# skip installing that in the next step.
# Note: When falling back to an old cache, `cache-hit` (used below)
# will be `false`. This allows us to restore the potentially out of
# date cache, but still let Playwright decide if it needs to download
# new binaries or not.
restore-keys: |
${{ runner.os }}-playwright-
# If the Playwright browser binaries weren't able to be restored, we tell
# paywright to install everything for us.
- name: Install Playwright with dependencies
if: steps.playwright-cache.outputs.cache-hit != 'true'
run: pnpm dlx playwright@"${{ steps.playwright-version.outputs.version }}" install --with-deps
# Even if the Playwright browser binaries were correctly restored from
# cache, we still need to ensure the OS dependencies are reinstalled (they
# can't be cached).
- name: Install Playwright's dependencies
if: steps.playwright-cache.outputs.cache-hit == 'true'
run: pnpm dlx playwright@"${{ steps.playwright-version.outputs.version }}" install-deps
- name: Build packages
run: pnpm run build --filter=@shopify/polaris
- name: Build Storybook
run: pnpm --filter=@shopify/polaris run storybook:build --quiet
- name: Run accessibility test
run: pnpm --filter=@shopify/polaris run storybook:test
visual_regression_test:
name: 'Visual regression test'
runs-on: ubuntu-latest
steps:
- name: Checkout branch
uses: actions/checkout@v3
with:
fetch-depth: 0 # Chromatic git history to track changes
- name: Setup pnpm
uses: pnpm/action-setup@v3
- name: Setup Node from .nvmrc
uses: actions/setup-node@v4
with:
node-version-file: '.nvmrc'
cache: pnpm
- name: Restore cache
uses: actions/cache@v3
with:
path: |
**/.turbo
node_modules/.cache/turbo
polaris-react/build-internal/cache
key: ${{ runner.os }}-visual-regression-test-v2-${{ github.sha }}
restore-keys: |
${{ runner.os }}-visual-regression-test-v2-
- name: Install dependencies
run: pnpm install --frozen-lockfile
- name: Build packages
run: pnpm build --filter=@shopify/polaris
- name: Build Storybook
run: pnpm --filter=@shopify/polaris run storybook:build --quiet
env:
STORYBOOK_GITHUB_SHA: ${{ github.sha }}
STORYBOOK_GITHUB_REPO_URL: ${{ github.server_url }}/${{ github.repository }}
STORYBOOK_GITHUB_PR: ${{ github.event.number }}
- name: Run Chromatic tests
uses: chromaui/action@v1
with:
token: ${{ secrets.GITHUB_TOKEN }}
projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
autoAcceptChanges: 'main'
storybookBuildDir: 'polaris-react/build-internal/storybook/static'
exitZeroOnChanges: true
exitOnceUploaded: true
env:
STORYBOOK_GITHUB_SHA: ${{ github.sha }}
STORYBOOK_GITHUB_REPO_URL: ${{ github.server_url }}/${{ github.repository }}
STORYBOOK_GITHUB_PR: ${{ github.event.number }}