Skip to content

Commit a6ac98a

Browse files
authored
Merge pull request #26 from Webperf-se/test
Add local regression test and fix eslint issues
2 parents 9fa6b40 + 5dbb082 commit a6ac98a

10 files changed

Lines changed: 496 additions & 65 deletions

File tree

.github/workflows/linux.yml

Lines changed: 17 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
name: Run Lighthouse plugin on Linux
1+
name: Run plugin on Linux
22
on:
33
push:
44
branches:
@@ -15,35 +15,27 @@ jobs:
1515
uses: actions/setup-node@v4
1616
with:
1717
node-version: '20.x'
18+
- name: Install latest Chrome
19+
run: |
20+
wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | sudo apt-key add -
21+
sudo sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google.list'
22+
sudo apt-get update
23+
sudo apt-get --only-upgrade install google-chrome-stable
24+
google-chrome --version
25+
- name: Browser versions
26+
run: |
27+
google-chrome --version
1828
- name: Install sitespeed.io
1929
run: |
2030
npm install sitespeed.io -g
21-
npm install @sitespeed.io/plugin-lighthouse -g
22-
cd ../webperf-sitespeedio-plugin
31+
cd ../plugin-css
2332
npm install
33+
- name: Start local HTTP server
34+
run: (npm run start-server&)
2435
- name: Lint
2536
run: npm run lint
2637
- name: Show sitespeed.io version
2738
run: sitespeed.io --version
28-
- name: Run tests using Lighthouse plugin
29-
run: sitespeed.io --plugins.add ./lib/index.js --plugins.remove browsertime https://www.sitespeed.io/
30-
- name: Run tests using Lighthouse plugin as mobile
31-
run: sitespeed.io --plugins.add ./lib/index.js --plugins.remove browsertime https://www.sitespeed.io/ --mobile
32-
- name: Run tests to illustrate maxLoadTime
33-
run: sitespeed.io --maxLoadTime 30000 -b firefox --firefox.includeResponseBodies all --firefox.preference privacy.trackingprotection.enabled:false --firefox.preference privacy.donottrackheader.enabled:false --firefox.preference browser.safebrowsing.malware.enabled:false --firefox.preference browser.safebrowsing.phishing.enabled:false --firefox.preference security.tls.version.min:1 --firefox.preference security.tls.version.max:1 --pageCompleteCheckNetworkIdle true --browsertime.screenshot false --screenshot false --screenshotLCP false --browsertime.screenshotLCP false --videoParams.createFilmstrip false --visualMetrics false --visualMetricsPerceptual false --visualMetricsContentful false --browsertime.headless true --silent true --utc true -n 1 https://webperf.se
34-
35-
36-
# - name: Run tests using Lighthouse plugin as mobile
37-
# run: sitespeed.io --plugins.remove assets --plugins.remove budget --plugins.remove coach --plugins.remove pagexray --plugins.remove thirdparty --plugins.remove domains --maxLoadTime 30000 --shm-size=1g -b firefox --firefox.includeResponseBodies all --firefox.preference privacy.trackingprotection.enabled:false --firefox.preference privacy.donottrackheader.enabled:false --firefox.preference browser.safebrowsing.malware.enabled:false --firefox.preference browser.safebrowsing.phishing.enabled:false --firefox.preference security.tls.version.min:1 --firefox.preference security.tls.version.max:1 --pageCompleteCheckNetworkIdle true --plugins.remove screenshot --plugins.remove html --plugins.remove metrics --browsertime.screenshot false --screenshot false --screenshotLCP false --browsertime.screenshotLCP false --videoParams.createFilmstrip false --visualMetrics false --visualMetricsPerceptual false --visualMetricsContentful false --browsertime.headless true --silent true --utc true -n 1
38-
39-
40-
41-
42-
# - name: Run tests with configuration file
43-
# run: sitespeed.io --plugins.add ./index.js --plugins.remove browsertime https://www.sitespeed.io/ --lighthouse.config ./test/config.js
44-
# - name: Run tests with flag file
45-
# run: sitespeed.io --plugins.add ./index.js --plugins.remove browsertime https://www.sitespeed.io/ --lighthouse.flags ./test/flags.json
46-
# - name: Test global install
47-
# run: |
48-
# npm install -g
49-
# sitespeed.io --plugins.add @sitespeed.io/plugin-lighthouse --plugins.remove browsertime https://www.sitespeed.io/
39+
- name: Run tests using plugin
40+
run: sitespeed.io --plugins.add ./lib/index.js --xvfb -n 1 http://127.0.0.1:3000/
41+

eslint.config.js

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@ export default [
55
languageOptions: {
66
globals: {
77
node: true,
8-
es6: true
8+
es6: true,
9+
URL: "readonly"
910
},
1011
parserOptions: {
1112
ecmaVersion: 'latest',
@@ -20,7 +21,10 @@ export default [
2021
'unicorn/prevent-abbreviations': 0,
2122
'unicorn/no-array-reduce': 0,
2223
'unicorn/prefer-spread': 0
23-
}
24+
},
25+
},
26+
{
27+
ignores: ["test/*"]
2428
},
2529
js.configs.recommended
2630
];

lib/harAnalyzer.js

Lines changed: 30 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ export class HarAnalyzer {
1515
this.config = JSON.parse(readFileSync(configPath, 'utf8'));
1616
}
1717

18-
transform2SimplifiedData(harData, url, group) {
18+
transform2SimplifiedData(harData, url) {
1919
const data = {
2020
'url': url,
2121
'rules': this.config.rules,
@@ -61,7 +61,7 @@ export class HarAnalyzer {
6161
for (const htmlObj of data.htmls) {
6262
const dom = new JSDOM(htmlObj.content);
6363
const styleElements = dom.window.document.querySelectorAll('style');
64-
styleElements.forEach((styleElement, index) => {
64+
styleElements.forEach((styleElement) => {
6565
const styleElementObj = {
6666
'url': htmlObj.url,
6767
'content': styleElement.textContent,
@@ -73,7 +73,7 @@ export class HarAnalyzer {
7373

7474
// Extract style="" attributes from HTML content
7575
const elementsWithStyleAttr = dom.window.document.querySelectorAll('[style]');
76-
elementsWithStyleAttr.forEach((element, index) => {
76+
elementsWithStyleAttr.forEach((element) => {
7777
const styleAttrContent = element.getAttribute('style');
7878
const styleAttrObj = {
7979
'url': htmlObj.url,
@@ -105,38 +105,35 @@ export class HarAnalyzer {
105105
return knowledgeData;
106106
}
107107

108-
try {
109-
// Ensure the correct context for `this` using arrow function
110-
const lintPromises = analyzedData['all-styles'].map(entry => {
111-
return stylelint.lint({
112-
code: entry.content,
113-
config: this.config
114-
}).then(result => {
115-
// Attach warnings along with the entry.url
116-
return result.results.flatMap(res =>
117-
res.warnings.map(warning => ({
118-
url: entry.url,
119-
rule: warning.rule,
120-
category: 'standard',
121-
severity: warning.severity,
122-
text: warning.text,
123-
line: warning.line,
124-
column: warning.column
125-
}))
126-
);
127-
});
108+
// Ensure the correct context for `this` using arrow function
109+
const lintPromises = analyzedData['all-styles'].map(entry => {
110+
return stylelint.lint({
111+
code: entry.content,
112+
config: this.config
113+
}).then(result => {
114+
// Attach warnings along with the entry.url
115+
return result.results.flatMap(res =>
116+
res.warnings.map(warning => ({
117+
url: entry.url,
118+
rule: warning.rule,
119+
category: 'standard',
120+
severity: warning.severity,
121+
text: warning.text,
122+
line: warning.line,
123+
column: warning.column
124+
}))
125+
);
128126
});
127+
});
129128

130-
// Wait for all linting promises to resolve and flatten the results
131-
const lintResults = await Promise.all(lintPromises);
132-
knowledgeData.issues = lintResults.flat();
129+
// Wait for all linting promises to resolve and flatten the results
130+
const lintResults = await Promise.all(lintPromises);
131+
knowledgeData.issues = lintResults.flat();
133132

134-
// Populate "resolved-rules" with rules not mentioned in "issues"
135-
const allRules = Object.keys(this.config.rules);
136-
const mentionedRules = new Set(knowledgeData.issues.map(issue => issue.rule));
137-
knowledgeData['resolved-rules'] = allRules.filter(rule => !mentionedRules.has(rule));
138-
} catch (err) {
139-
}
133+
// Populate "resolved-rules" with rules not mentioned in "issues"
134+
const allRules = Object.keys(this.config.rules);
135+
const mentionedRules = new Set(knowledgeData.issues.map(issue => issue.rule));
136+
knowledgeData['resolved-rules'] = allRules.filter(rule => !mentionedRules.has(rule));
140137

141138
return knowledgeData;
142139
}
@@ -146,7 +143,7 @@ export class HarAnalyzer {
146143
this.groups[group] = {};
147144
}
148145

149-
const analyzedData = this.transform2SimplifiedData(harData, url, group);
146+
const analyzedData = this.transform2SimplifiedData(harData, url);
150147
if (!('analyzedData' in this.groups[group])) {
151148
this.groups[group]['analyzedData'] = []
152149
}

lib/index.js

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,9 @@ import fs from 'node:fs';
66
const fsp = fs.promises;
77

88
// https://www.sitespeed.io/documentation/sitespeed.io/plugins/#create-your-own-plugin
9-
// node bin\sitespeed.js -n 1 --plugins.add analysisstorer --plugins.add ../../../plugin-css/lib/index.js --browsertime.chrome.includeResponseBodies all https://webperf.se
9+
// node bin\sitespeed.js -b edge -n 1 --plugins.add analysisstorer --plugins.add ../../../plugin-css/lib/index.js --browsertime.chrome.includeResponseBodies all https://webperf.se
10+
// node bin\sitespeed.js -b edge -n 1 --plugins.add analysisstorer --plugins.add ../../../plugin-webperf-core/lib/index.js --plugins.add ../../../plugin-css/lib/index.js --plugins.add ../../../plugin-javascript/lib/index.js --browsertime.chrome.includeResponseBodies all https://webperf.se
11+
// node bin\sitespeed.js -b edge -n 1 --plugins.add ../../../plugin-webperf-core/lib/index.js --plugins.add ../../../plugin-css/lib/index.js --plugins.add ../../../plugin-javascript/lib/index.js --browsertime.chrome.includeResponseBodies all https://webperf.se
1012

1113
const pluginname = 'webperf-plugin-css'
1214

@@ -20,6 +22,7 @@ export default class CssPlugin extends SitespeedioPlugin {
2022
this.harAnalyzer = new HarAnalyzer();
2123
const libFolder = fileURLToPath(new URL('..', import.meta.url));
2224
this.pluginFolder = path.resolve(libFolder);
25+
this.options = options;
2326

2427
this.pug = await fsp.readFile(
2528
path.resolve(this.pluginFolder, 'pug', 'index.pug'),
@@ -80,7 +83,7 @@ export default class CssPlugin extends SitespeedioPlugin {
8083
}
8184
}
8285
}
83-
close(options, errors) {
84-
// Cleanup if necessary
85-
}
86+
// close(options, errors) {
87+
// // Cleanup if necessary
88+
// }
8689
}

package.json

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,10 @@
4444
"eslint-config-prettier": "10.1.1",
4545
"eslint-plugin-prettier": "5.2.5",
4646
"eslint-plugin-unicorn": "58.0.0",
47-
"prettier": "3.5.3"
47+
"prettier": "3.5.3",
48+
"serve": "14.2.4",
49+
"serve-handler": "6.1.6",
50+
"typescript": "5.7.2"
4851
},
4952
"dependencies": {
5053
"jsdom": "26.0.0",
@@ -54,6 +57,8 @@
5457
},
5558
"scripts": {
5659
"test": "ava",
60+
"start-server": "serve test/data/",
61+
"stop-server": "sudo pkill serve",
5762
"lint": "eslint .",
5863
"lint:fix": "eslint . --fix",
5964
"eslint-check": "eslint --print-config .eslintrc.js | eslint-config-prettier-check"

test/data/css/bootstrap.min.css

Lines changed: 5 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)