Skip to content

feat(blade-core): auto-generate theme.css from bladeTheme tokens #20064

feat(blade-core): auto-generate theme.css from bladeTheme tokens

feat(blade-core): auto-generate theme.css from bladeTheme tokens #20064

name: Blade Chromatic
on:
push:
pull_request:
types: [labeled]
env:
GITHUB_ACCESS_TOKEN: ${{ secrets.CI_BOT_TOKEN }}
jobs:
chromatic-deployment:
name: Chromatic Deployment
runs-on: ubuntu-latest # nosemgrep: non-self-hosted-runner
if: ${{ github.event_name == 'push' || github.event.label.name == 'Run Interaction Tests' }}
outputs:
storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
steps:
- name: Checkout Codebase
uses: actions/checkout@v3
with:
fetch-depth: 0
- name: Use Node v20
uses: actions/setup-node@v3
with:
node-version: 20.19.5
- name: Setup Cache & Install Dependencies
uses: ./.github/actions/install-dependencies
- name: Install Dashboard Playground Dependencies
working-directory: packages/blade/blade-dashboard-template
run: yarn install
- name: Build Dashboard Playground
working-directory: packages/blade/blade-dashboard-template
run: yarn run build
- name: Copy Dashboard to Storybook Site
working-directory: packages/blade
run: |
if [ -d "storybook-site/dashboard" ]; then
rm -rf storybook-site/dashboard
fi
mkdir -p storybook-site/dashboard
if [ -d "blade-dashboard-template/dist" ]; then
cp -r blade-dashboard-template/dist/* storybook-site/dashboard/
echo "✓ Dashboard build output copied to storybook-site/dashboard/"
else
echo "✗ Dashboard dist directory not found"
exit 1
fi
- name: Build blade-core
run: yarn build:blade-core
- name: Build Svelte Storybook
working-directory: packages/blade-svelte
run: yarn build-storybook
- name: Copy Svelte Storybook to Storybook Site
working-directory: packages/blade
run: |
if [ -d "storybook-site/svelte" ]; then
rm -rf storybook-site/svelte
fi
mkdir -p storybook-site/svelte
if [ -d "../blade-svelte/storybook-static" ]; then
cp -r ../blade-svelte/storybook-static/* storybook-site/svelte/
echo "✓ Svelte Storybook copied to storybook-site/svelte/"
else
echo "✗ Svelte Storybook not found"
exit 1
fi
- name: Publish to Chromatic
id: chromatic
uses: chromaui/action@v1
with:
token: ${{ env.GITHUB_ACCESS_TOKEN }}
projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
workingDir: packages/blade
storybookBaseDir: packages/blade
buildScriptName: react:storybook:build
exitOnceUploaded: true
onlyChanged: true
untraced: '**/package.json'
traceChanged: 'expanded'
env:
GITHUB_SHA: ${{ github.sha }}
GITHUB_REF: ${{ github.ref }}
browserstack-tests:
name: BrowserStack Tests
needs: chromatic-deployment
if: ${{ github.event.label.name == 'Run Interaction Tests' || (github.event_name == 'push' && github.ref == 'refs/heads/master') }}
uses: ./.github/workflows/blade-browserstack.yml
with:
chromatic_url: ${{ needs.chromatic-deployment.outputs.storybookUrl }}
secrets: inherit