Skip to content

WB-1808: Button - Use CSS pseudo-classes for styling states (hover, focus, etc) #4877

WB-1808: Button - Use CSS pseudo-classes for styling states (hover, focus, etc)

WB-1808: Button - Use CSS pseudo-classes for styling states (hover, focus, etc) #4877

Workflow file for this run

name: Node CI (PR)
on:
pull_request:
# ready_for_review is useful for when a PR is converted from "draft" to "not
# draft".
types: [edited, opened, synchronize, ready_for_review, reopened]
# Our jobs run like this to minimize wasting resource cycles:
# 1. Prime caches for primary configuration (ubuntu on node 16).
# This way the next two jobs can run in parallel but rely on this primed
# cache.
# 2. Lint and Test
# a. Lint
# b. Test/Coverage
# 3. Verify that build sizes are reasonable
jobs:
prime_cache_primary:
name: Prime node_modules cache for primary configuration
runs-on: ${{ matrix.os }}
strategy:
matrix:
os: [ubuntu-latest]
node-version: [20.x]
steps:
- uses: actions/checkout@v4
- name: Install & cache node_modules
uses: Khan/actions@shared-node-cache-v2
with:
node-version: ${{ matrix.node-version }}
changeset:
name: Check for .changeset entries for all changed files
if: github.actor != 'dependabot[bot]' && github.actor != 'dependabot-preview[bot]'
runs-on: ${{ matrix.os }}
strategy:
matrix:
os: [ubuntu-latest]
node-version: [20.x]
steps:
- name: Checkout repository
uses: actions/checkout@v4
with:
fetch-depth: 0
- name: Get changed files
uses: Khan/actions@get-changed-files-v2
id: changed
- name: Filter out files that don't need a changeset
uses: Khan/actions@filter-files-v1
id: match
with:
changed-files: ${{ steps.changed.outputs.files }}
files: packages/ # Only look for changes in packages
globs: "!(**/__tests__/**), !(**/dist/*), !(**/*.test.{ts,tsx})" # Ignore test files
matchAllGlobs: true # All globs must match (disjunction is the default)
conjunctive: true # Only return files that match all of the above
- name: Verify changeset entries
uses: Khan/[email protected]
with:
changed_files: ${{ steps.match.outputs.filtered }}
lint:
name: Lint
needs: prime_cache_primary
uses: ./.github/workflows/node-ci-lint.yml
test:
name: Test
needs: prime_cache_primary
uses: ./.github/workflows/node-ci-test.yml
secrets:
CODECOV_TOKEN: ${{ secrets.CODECOV_TOKEN }}
check_builds:
name: Check build sizes
needs: prime_cache_primary
runs-on: ${{ matrix.os }}
strategy:
matrix:
os: [ubuntu-latest]
node-version: [20.x]
steps:
- uses: actions/checkout@v4
- name: Use Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v4
with:
node-version: ${{ matrix.node-version }}
- name: Install & cache node_modules
uses: Khan/actions@shared-node-cache-v2
with:
node-version: ${{ matrix.node-version }}
# Make sure our packages aren't growing unexpectedly
- name: Check Builds
uses: preactjs/compressed-size-action@v2
with:
# Specify our custom build script
build-script: "build"
# Clean up state between builds
clean-script: "clean"
# Any JS files anywhere within a dist directory:
pattern: "**/dist/es/*.js"
# Always ignore SourceMaps and node_modules:
exclude: "{**/*.map,**/node_modules/**}"
publish_snapshot:
name: Publish npm snapshot
# We don't publish snapshots on draft PRs or
# on the main Changeset "Version Packages" PR
if: |
github.event.pull_request.draft == false
&& !startsWith(github.head_ref, 'changeset-release/')
runs-on: ${{ matrix.os }}
strategy:
matrix:
os: [ubuntu-latest]
node-version: [20.x]
steps:
# We need to checkout all history, so that the changeset tool can diff it
- name: Checkout current commit
uses: actions/checkout@v4
with:
fetch-depth: "0"
- name: Ensure main branch is avaialble
run: |
REF=$(git rev-parse HEAD)
git checkout main
git checkout $REF
- name: Use Node.js ${{ matrix.node-version }} & Install & cache node_modules
uses: Khan/actions@shared-node-cache-v2
with:
node-version: ${{ matrix.node-version }}
- name: Publish snapshot release to npm
id: publish-snapshot
run: ./utils/publish/publish-snapshot.sh # All config is via Github env vars
env:
NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
- name: Calculate short SHA for this commit
id: short-sha
run: echo "short_sha=$(echo ${GITHUB_SHA} | cut -c1-8)" >> $GITHUB_OUTPUT
# Note: these two actions are locked to the latest version that were
# published when @jeremy (Jeremy Wiebe) created the original job in Perseus.
- name: Find existing comment
uses: peter-evans/find-comment@3eae4d37986fb5a8592848f6a574fdf654e61f9e
id: find-comment
with:
issue-number: ${{ github.event.pull_request.number }}
comment-author: "github-actions[bot]"
body-includes: "npm Snapshot:"
- name: Create or update npm snapshot comment - Success
if: steps.publish-snapshot.outputs.npm_snapshot_tag != ''
uses: peter-evans/create-or-update-comment@71345be0265236311c031f5c7866368bd1eff043
with:
issue-number: ${{ github.event.pull_request.number }}
comment-id: ${{ steps.find-comment.outputs.comment-id }}
edit-mode: replace
body: |
## npm Snapshot: Published
🎉 Good news!! We've packaged up the latest commit from this PR (${{
steps.short-sha.outputs.short_sha }}) and published all packages with changesets to npm.
You can install the packages in webapp by running:
```sh
./services/static/dev/tools/deploy_wonder_blocks.js --tag="${{
steps.publish-snapshot.outputs.npm_snapshot_tag }}"
```
Packages can also be installed manually by running:
```sh
yarn add @khanacademy/wonder-blocks-<package-name>@${{
steps.publish-snapshot.outputs.npm_snapshot_tag }}
```
- name: Create or update npm snapshot comment - Failure
if: steps.publish-snapshot.outputs.npm_snapshot_tag == ''
uses: peter-evans/create-or-update-comment@71345be0265236311c031f5c7866368bd1eff043
with:
issue-number: ${{ github.event.pull_request.number }}
comment-id: ${{ steps.find-comment.outputs.comment-id }}
edit-mode: replace
body: |
## npm Snapshot: **NOT** Published
🤕 Oh noes!! We couldn't find any changesets in this PR (${{
steps.short-sha.outputs.short_sha }}). As a result, we did **not** publish an npm snapshot for you.