105 lines (94 loc) · 3.56 KB
/
visual-regression.yml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
name: Visual Regression Tests
on:
workflow_dispatch:
inputs:
deployPrimeUrl:
description: Origin to test, e.g. https://deploy-preview-1804--patternfly-elements.netlify.app/
required: true
branch:
description: Branch being run on
required: false
issueNumber:
description: issue or pull request number being run for
required: false
netlifyBuildContext:
description: "The Netlify build context: https://docs.netlify.com/configure-builds/file-based-configuration/#deploy-contexts"
required: false
deployUrl:
description: The deploy url generated by netlify
required: false
url:
description: The url generated by netlify
required: false
jobs:
e2e:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v3
with:
node-version: '20'
cache: npm
- run: npm ci --prefer-offline
- name: Visual Regression Tests
run: npx playwright test
env:
VISUAL_REGRESSION_ORIGIN: ${{ github.event.inputs.deployPrimeUrl }}
PW_EXPERIMENTAL_TS_ESM: 1
lighthouse:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- name: Generate URLs
id: urls
uses: actions/github-script@v6
with:
github-token: ${{ secrets.GITHUB_TOKEN }}
script: |
const deployPrimeUrl = '${{ github.event.inputs.deployPrimeUrl }}';
const globber = await glob.create('elements/*/demo/pfe-*.html');
const files = await globber.glob();
const urls = files
.map(x => x.match(/pfe-([\w-]+)/)[1])
.map(x => `${deployPrimeUrl}/components/${x}/demo/`)
.join('\n');
core.setOutput('urls', urls);
- name: Lighthouse CI Action
id: lighthouse
uses: treosh/lighthouse-ci-action@v8
with:
configPath: .lighthouserc.yml
uploadArtifacts: true # save results as an action artifacts
temporaryPublicStorage: true
urls: |
${{ github.event.inputs.deployPrimeUrl }}/kitchen-sink/
${{ github.event.inputs.deployPrimeUrl }}/core/styles/demo/
${{ steps.urls.outputs.urls }}
- name: Format lighthouse score
id: format
if: ${{ always() }}
uses: actions/github-script@v6
with:
github-token: ${{secrets.GITHUB_TOKEN}}
script: |
try {
const getComment = require('./scripts/format-lighthouse.cjs');
const resultsPath = '${{ steps.lighthouse.outputs.resultsPath }}';
const links = ${{ steps.lighthouse.outputs.links || '{}' }};
const assertionResults = ${{ steps.lighthouse.outputs.assertionResults }};
const manifest = ${{ steps.lighthouse.outputs.manifest }};
const comment = manifest.reduce(getComment({ links, assertionResults, resultsPath }), '## 🏮 Lighthouse report for the changes in this PR:');
core.setOutput('comment', comment);
} catch (error) {
core.setFailed(error);
}
- name: Add comment to PR
if: ${{ always() && steps.format.outputs.comment }}
id: comment
uses: marocchino/sticky-pull-request-comment@v2
with:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
number: ${{ github.event.inputs.issueNumber }}
header: lighthouse
message: |
${{ steps.format.outputs.comment }}