diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 386a277..c0ca752 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -34,6 +34,6 @@ We use [JSDoc](http://usejsdoc.org/) with [TypeScript](https://github.com/Micros ```bash npm test # run all linters && tests npx tsc -p . # run typescript checks -npx ava test/index.js # run just AVA tests -npx ava test/index.js -u # update AVA snapshots +npm run ava # run just AVA tests +npm run ava -u # update AVA snapshots ``` diff --git a/lighthouse-plugin-field-performance/utils/audit-helpers.js b/lighthouse-plugin-field-performance/utils/audit-helpers.js index 72a666b..c8fd1d1 100644 --- a/lighthouse-plugin-field-performance/utils/audit-helpers.js +++ b/lighthouse-plugin-field-performance/utils/audit-helpers.js @@ -117,11 +117,11 @@ function createDistributionsTable({ distributions }, timeUnit) { const normMax = formatValue(max, { isMs: isMs(timeUnit) }) if (min === 0) { - item.category = `Fast (faster than ${normMax}${timeUnit})` + item.category = `Fast (faster than ${normMax} ${timeUnit})` } else if (max && min === distributions[index - 1].max) { - item.category = `Average (from ${normMin}${timeUnit} to ${normMax}${timeUnit})` + item.category = `Average (from ${normMin} ${timeUnit} to ${normMax} ${timeUnit})` } else { - item.category = `Slow (longer than ${normMin}${timeUnit})` + item.category = `Slow (longer than ${normMin} ${timeUnit})` } item.distribution = `${(proportion * 100).toFixed()} %` diff --git a/package.json b/package.json index e369e7e..57cfdbc 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,8 @@ "first input delay" ], "scripts": { - "test": "prettier -c lighthouse-plugin-field-performance/** script/** package.json README.md && tsc -p . && ava test/index.js", + "test": "prettier -c lighthouse-plugin-field-performance/** script/** package.json README.md && tsc -p .", + "ava": "mkdir -p results && ava test/index.js", "mock-run": "node ./test/mock-run.js", "test-run": "lighthouse --plugins=lighthouse-plugin-field-performance --view --chrome-flags='--headless' --output-path=./results/result.html" }, diff --git a/test/snapshots/test/index.js.md b/test/snapshots/test/index.js.md index 82f815c..3fcf944 100644 --- a/test/snapshots/test/index.js.md +++ b/test/snapshots/test/index.js.md @@ -9,7 +9,7 @@ Generated by [AVA](https://ava.li). > Snapshot 1 { - description: 'First Contentful Paint marks the time at which the first text or image is painted.', + description: 'First Contentful Paint marks the time at which the first text or image painted. The value represents the 90th percentile of the page traffic. [Learn More](https://developers.google.com/speed/docs/insights/v5/about#faq)', details: { headings: [ { @@ -20,20 +20,20 @@ Generated by [AVA](https://ava.li). { itemType: 'text', key: 'distribution', - text: 'Distribution', + text: 'Percent of traffic', }, ], items: [ { - category: 'Fast (faster than 1.0s)', + category: 'Fast (faster than 1 s)', distribution: '78 %', }, { - category: 'Average (from 1.0s to 2.5s)', + category: 'Average (from 1 s to 2.5 s)', distribution: '17 %', }, { - category: 'Slow (longer than 2.5s)', + category: 'Slow (longer than 2.5 s)', distribution: '5 %', }, ], @@ -50,7 +50,7 @@ Generated by [AVA](https://ava.li). > Snapshot 2 { - description: 'First Input Delay shows how fast UI responded after the first interaction.', + description: 'First Input Delay indicates how fast UI responded after the first interaction. The value represents the 95th percentile of the page traffic. [Learn More](https://developers.google.com/speed/docs/insights/v5/about#faq)', details: { headings: [ { @@ -61,20 +61,20 @@ Generated by [AVA](https://ava.li). { itemType: 'text', key: 'distribution', - text: 'Distribution', + text: 'Percent of traffic', }, ], items: [ { - category: 'Fast (faster than 50ms)', + category: 'Fast (faster than 50 ms)', distribution: '75 %', }, { - category: 'Average (from 50ms to 250ms)', + category: 'Average (from 50 ms to 250 ms)', distribution: '19 %', }, { - category: 'Slow (longer than 250ms)', + category: 'Slow (longer than 250 ms)', distribution: '6 %', }, ], @@ -91,7 +91,7 @@ Generated by [AVA](https://ava.li). > Snapshot 3 { - description: 'First Contentful Paint marks the time at which the first text or image is painted.', + description: 'First Contentful Paint marks the time at which the first text or image painted. The value represents the 90th percentile of all origin traffic. [Learn More](https://developers.google.com/speed/docs/insights/v5/about#faq)', details: { headings: [ { @@ -102,20 +102,20 @@ Generated by [AVA](https://ava.li). { itemType: 'text', key: 'distribution', - text: 'Distribution', + text: 'Percent of traffic', }, ], items: [ { - category: 'Fast (faster than 1.0s)', + category: 'Fast (faster than 1 s)', distribution: '84 %', }, { - category: 'Average (from 1.0s to 2.5s)', + category: 'Average (from 1 s to 2.5 s)', distribution: '13 %', }, { - category: 'Slow (longer than 2.5s)', + category: 'Slow (longer than 2.5 s)', distribution: '4 %', }, ], @@ -132,7 +132,7 @@ Generated by [AVA](https://ava.li). > Snapshot 4 { - description: 'First Input Delay shows how fast UI responded after the first interaction.', + description: 'First Input Delay indicates how fast UI responded after the first interaction. The value represents the 95th percentile of all origin traffic. [Learn More](https://developers.google.com/speed/docs/insights/v5/about#faq)', details: { headings: [ { @@ -143,20 +143,20 @@ Generated by [AVA](https://ava.li). { itemType: 'text', key: 'distribution', - text: 'Distribution', + text: 'Percent of traffic', }, ], items: [ { - category: 'Fast (faster than 50ms)', + category: 'Fast (faster than 50 ms)', distribution: '74 %', }, { - category: 'Average (from 50ms to 250ms)', + category: 'Average (from 50 ms to 250 ms)', distribution: '17 %', }, { - category: 'Slow (longer than 250ms)', + category: 'Slow (longer than 250 ms)', distribution: '9 %', }, ], @@ -195,7 +195,7 @@ Generated by [AVA](https://ava.li). weight: 0, }, ], - description: 'Real Chrome users metrics over the last 30 days.', + description: 'These performance metrics show the performance of the page for real-world Chrome users over the last 30 days. Data is collected anonymously in the "field" and provided by Chrome UX Report. [Learn More](https://developers.google.com/web/tools/chrome-user-experience-report/)', id: 'lighthouse-plugin-field-performance', score: 0.63, title: 'Field Performance', @@ -206,7 +206,7 @@ Generated by [AVA](https://ava.li). > Snapshot 1 { - description: 'First Contentful Paint marks the time at which the first text or image is painted.', + description: 'First Contentful Paint marks the time at which the first text or image painted. The value represents the 90th percentile of the page traffic. [Learn More](https://developers.google.com/speed/docs/insights/v5/about#faq)', details: { headings: [ { @@ -217,20 +217,20 @@ Generated by [AVA](https://ava.li). { itemType: 'text', key: 'distribution', - text: 'Distribution', + text: 'Percent of traffic', }, ], items: [ { - category: 'Fast (faster than 1.0s)', + category: 'Fast (faster than 1 s)', distribution: '68 %', }, { - category: 'Average (from 1.0s to 2.5s)', + category: 'Average (from 1 s to 2.5 s)', distribution: '26 %', }, { - category: 'Slow (longer than 2.5s)', + category: 'Slow (longer than 2.5 s)', distribution: '6 %', }, ], @@ -247,7 +247,7 @@ Generated by [AVA](https://ava.li). > Snapshot 2 { - description: 'First Input Delay shows how fast UI responded after the first interaction.', + description: 'First Input Delay indicates how fast UI responded after the first interaction. The value represents the 95th percentile of the page traffic. [Learn More](https://developers.google.com/speed/docs/insights/v5/about#faq)', details: { headings: [ { @@ -258,20 +258,20 @@ Generated by [AVA](https://ava.li). { itemType: 'text', key: 'distribution', - text: 'Distribution', + text: 'Percent of traffic', }, ], items: [ { - category: 'Fast (faster than 50ms)', + category: 'Fast (faster than 50 ms)', distribution: '96 %', }, { - category: 'Average (from 50ms to 250ms)', + category: 'Average (from 50 ms to 250 ms)', distribution: '2 %', }, { - category: 'Slow (longer than 250ms)', + category: 'Slow (longer than 250 ms)', distribution: '2 %', }, ], @@ -288,7 +288,7 @@ Generated by [AVA](https://ava.li). > Snapshot 3 { - description: 'First Contentful Paint marks the time at which the first text or image is painted.', + description: 'First Contentful Paint marks the time at which the first text or image painted. The value represents the 90th percentile of all origin traffic. [Learn More](https://developers.google.com/speed/docs/insights/v5/about#faq)', details: { headings: [ { @@ -299,26 +299,26 @@ Generated by [AVA](https://ava.li). { itemType: 'text', key: 'distribution', - text: 'Distribution', + text: 'Percent of traffic', }, ], items: [ { - category: 'Fast (faster than 1.0s)', + category: 'Fast (faster than 1 s)', distribution: '67 %', }, { - category: 'Average (from 1.0s to 2.5s)', + category: 'Average (from 1 s to 2.5 s)', distribution: '26 %', }, { - category: 'Slow (longer than 2.5s)', + category: 'Slow (longer than 2.5 s)', distribution: '6 %', }, ], type: 'table', }, - displayValue: '2.0 s', + displayValue: '2 s', id: 'field-fcp-origin', numericValue: 1981, score: 0.68, @@ -329,7 +329,7 @@ Generated by [AVA](https://ava.li). > Snapshot 4 { - description: 'First Input Delay shows how fast UI responded after the first interaction.', + description: 'First Input Delay indicates how fast UI responded after the first interaction. The value represents the 95th percentile of all origin traffic. [Learn More](https://developers.google.com/speed/docs/insights/v5/about#faq)', details: { headings: [ { @@ -340,20 +340,20 @@ Generated by [AVA](https://ava.li). { itemType: 'text', key: 'distribution', - text: 'Distribution', + text: 'Percent of traffic', }, ], items: [ { - category: 'Fast (faster than 50ms)', + category: 'Fast (faster than 50 ms)', distribution: '95 %', }, { - category: 'Average (from 50ms to 250ms)', + category: 'Average (from 50 ms to 250 ms)', distribution: '3 %', }, { - category: 'Slow (longer than 250ms)', + category: 'Slow (longer than 250 ms)', distribution: '2 %', }, ], @@ -392,7 +392,7 @@ Generated by [AVA](https://ava.li). weight: 0, }, ], - description: 'Real Chrome users metrics over the last 30 days.', + description: 'These performance metrics show the performance of the page for real-world Chrome users over the last 30 days. Data is collected anonymously in the "field" and provided by Chrome UX Report. [Learn More](https://developers.google.com/web/tools/chrome-user-experience-report/)', id: 'lighthouse-plugin-field-performance', score: 0.85, title: 'Field Performance', diff --git a/test/snapshots/test/index.js.snap b/test/snapshots/test/index.js.snap index c2132bd..59b3fac 100644 Binary files a/test/snapshots/test/index.js.snap and b/test/snapshots/test/index.js.snap differ