Add icon color for invisible button #730
Workflow file for this run
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| name: A11y contrast check | |
| on: | |
| pull_request: | |
| branches: | |
| - main | |
| jobs: | |
| changes: | |
| uses: ./.github/workflows/hasChanged.yml | |
| build: | |
| needs: changes | |
| if: needs.changes.outputs.oldTokens == 'true' | |
| name: Check design token color contrast | |
| runs-on: ubuntu-latest | |
| steps: | |
| - name: Checkout repository | |
| uses: actions/checkout@v3 | |
| - name: Set up Node.js | |
| uses: actions/setup-node@v3 | |
| with: | |
| node-version: 18 | |
| cache: 'npm' | |
| - name: Install dependencies | |
| run: npm ci --no-audit --no-fund --ignore-scripts | |
| - name: Build tokens | |
| run: npm run build # building v1 as they are currently used for contrast check | |
| - name: Run required checks | |
| run: | | |
| npx ts-node -e "require('./scripts/color-contrast').check(['light', 'dark'], 'all')" | |
| - name: Report check results | |
| uses: actions/github-script@v6 | |
| with: | |
| script: | | |
| const results = require('./color-contrast-check.json'); | |
| // prepare comment body | |
| const body = '## Design Token Contrast Check\n\n' + | |
| results.map(({theme, failingContrast, markdownTable}) => | |
| "### `"+theme+"`: " + `${failingContrast === 0 ? '✅ all checks passed' : `❌ ${failingContrast} checks failed`}\n\n` + | |
| '<details>' + | |
| `<summary>Show results table for theme: ${theme}</summary>\n` + | |
| " \n"+ | |
| ` ${markdownTable}` + | |
| '\n</details>' | |
| ).join('\n\n') | |
| // get comments | |
| const {data: comments} = await github.rest.issues.listComments({ | |
| issue_number: context.issue.number, | |
| owner: context.repo.owner, | |
| repo: context.repo.repo | |
| }); | |
| // get token issue | |
| const tokenCheckComment = comments.filter(comment => comment.body.includes('## Design Token Contrast Check')); | |
| // if token issue exists, update it | |
| if(tokenCheckComment.length > 0) { | |
| await github.rest.issues.updateComment({ | |
| comment_id: tokenCheckComment[0].id, | |
| owner: context.repo.owner, | |
| repo: context.repo.repo, | |
| body | |
| }) | |
| } | |
| // if token issue does not exist, create it | |
| else { | |
| await github.rest.issues.createComment({ | |
| issue_number: context.issue.number, | |
| owner: context.repo.owner, | |
| repo: context.repo.repo, | |
| body | |
| }) | |
| } |