lighthouse 9.5.0-dev.20230122 → 9.5.0-dev.20230124

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (131) hide show
  1. package/.codecov.yml +0 -5
  2. package/core/audits/audit.js +1 -1
  3. package/core/audits/bf-cache.js +1 -1
  4. package/core/audits/byte-efficiency/legacy-javascript.d.ts +1 -0
  5. package/core/audits/byte-efficiency/legacy-javascript.js +7 -3
  6. package/core/audits/dobetterweb/uses-http2.d.ts +5 -2
  7. package/core/audits/dobetterweb/uses-http2.js +12 -7
  8. package/core/audits/screenshot-thumbnails.d.ts +2 -1
  9. package/core/audits/screenshot-thumbnails.js +14 -9
  10. package/core/audits/third-party-facades.d.ts +3 -2
  11. package/core/audits/third-party-facades.js +12 -9
  12. package/core/audits/third-party-summary.d.ts +7 -6
  13. package/core/audits/third-party-summary.js +16 -14
  14. package/core/audits/valid-source-maps.d.ts +5 -3
  15. package/core/audits/valid-source-maps.js +11 -9
  16. package/core/computed/entity-classification.d.ts +29 -0
  17. package/core/computed/entity-classification.js +102 -0
  18. package/core/computed/processed-navigation.d.ts +12 -6
  19. package/core/computed/processed-navigation.js +19 -6
  20. package/core/computed/resource-summary.d.ts +4 -2
  21. package/core/computed/resource-summary.js +8 -5
  22. package/core/lib/url-utils.js +1 -1
  23. package/core/runner.d.ts +10 -0
  24. package/core/runner.js +48 -0
  25. package/core/util.cjs +43 -10
  26. package/core/util.d.cts +114 -2
  27. package/dist/report/bundle.esm.js +858 -883
  28. package/dist/report/flow.js +33 -23
  29. package/dist/report/standalone.js +27 -17
  30. package/flow-report/assets/standalone-flow-template.html +1 -1
  31. package/flow-report/src/common.tsx +1 -1
  32. package/flow-report/src/i18n/i18n.d.ts +103 -100
  33. package/flow-report/src/i18n/i18n.tsx +23 -18
  34. package/flow-report/src/sidebar/sidebar.tsx +3 -3
  35. package/flow-report/src/summary/category.tsx +7 -7
  36. package/flow-report/src/summary/summary.tsx +2 -2
  37. package/flow-report/src/topbar.tsx +4 -28
  38. package/package.json +5 -5
  39. package/readme.md +1 -1
  40. package/report/assets/standalone-template.html +1 -1
  41. package/report/assets/styles.css +3 -3
  42. package/report/assets/templates.html +4 -28
  43. package/report/renderer/category-renderer.js +19 -17
  44. package/report/renderer/components.js +119 -202
  45. package/report/renderer/crc-details-renderer.js +7 -6
  46. package/report/renderer/details-renderer.js +7 -6
  47. package/report/renderer/dom.js +1 -1
  48. package/report/renderer/element-screenshot-renderer.js +3 -3
  49. package/report/renderer/{i18n.d.ts → i18n-formatter.d.ts} +3 -9
  50. package/report/renderer/{i18n.js → i18n-formatter.js} +2 -11
  51. package/report/renderer/performance-category-renderer.js +17 -15
  52. package/report/renderer/pwa-category-renderer.js +5 -4
  53. package/report/renderer/report-globals.d.ts +21 -0
  54. package/report/renderer/report-globals.js +49 -0
  55. package/report/renderer/report-renderer.js +22 -24
  56. package/report/renderer/report-ui-features.js +9 -8
  57. package/report/renderer/report-utils.d.ts +116 -0
  58. package/report/renderer/{util.js → report-utils.js} +100 -415
  59. package/report/renderer/snippet-renderer.js +3 -2
  60. package/report/test/renderer/category-renderer-test.js +10 -5
  61. package/report/test/renderer/crc-details-renderer-test.js +8 -4
  62. package/report/test/renderer/details-renderer-test.js +8 -4
  63. package/report/test/renderer/dom-test.js +8 -4
  64. package/report/test/renderer/element-screenshot-renderer-test.js +9 -5
  65. package/report/test/renderer/{i18n-test.js → i18n-formatter-test.js} +15 -21
  66. package/report/test/renderer/performance-category-renderer-test.js +15 -10
  67. package/report/test/renderer/pwa-category-renderer-test.js +11 -6
  68. package/report/test/renderer/report-renderer-test.js +2 -2
  69. package/report/test/renderer/report-ui-features-test.js +3 -3
  70. package/report/test/renderer/{util-test.js → report-utils-test.js} +37 -235
  71. package/report/test/renderer/snippet-renderer-test.js +8 -4
  72. package/report/test-assets/lhr-3.0.0.json +2332 -0
  73. package/report/test-assets/lhr-4.3.0.json +4754 -0
  74. package/report/test-assets/lhr-5.0.0.json +5994 -0
  75. package/report/test-assets/lhr-6.0.0.json +7222 -0
  76. package/report/test-assets/lhr-8.5.0.json +8679 -0
  77. package/shared/localization/format.js +5 -2
  78. package/shared/localization/locales/ar-XB.json +50 -50
  79. package/shared/localization/locales/ar.json +50 -50
  80. package/shared/localization/locales/bg.json +50 -50
  81. package/shared/localization/locales/ca.json +50 -50
  82. package/shared/localization/locales/cs.json +50 -50
  83. package/shared/localization/locales/da.json +50 -50
  84. package/shared/localization/locales/de.json +50 -50
  85. package/shared/localization/locales/el.json +50 -50
  86. package/shared/localization/locales/en-GB.json +50 -50
  87. package/shared/localization/locales/en-US.json +55 -55
  88. package/shared/localization/locales/en-XA.json +50 -50
  89. package/shared/localization/locales/en-XL.json +55 -55
  90. package/shared/localization/locales/es-419.json +50 -50
  91. package/shared/localization/locales/es.json +50 -50
  92. package/shared/localization/locales/fi.json +50 -50
  93. package/shared/localization/locales/fil.json +50 -50
  94. package/shared/localization/locales/fr.json +50 -50
  95. package/shared/localization/locales/he.json +50 -50
  96. package/shared/localization/locales/hi.json +50 -50
  97. package/shared/localization/locales/hr.json +50 -50
  98. package/shared/localization/locales/hu.json +50 -50
  99. package/shared/localization/locales/id.json +50 -50
  100. package/shared/localization/locales/it.json +50 -50
  101. package/shared/localization/locales/ja.json +50 -50
  102. package/shared/localization/locales/ko.json +50 -50
  103. package/shared/localization/locales/lt.json +50 -50
  104. package/shared/localization/locales/lv.json +50 -50
  105. package/shared/localization/locales/nl.json +50 -50
  106. package/shared/localization/locales/no.json +50 -50
  107. package/shared/localization/locales/pl.json +50 -50
  108. package/shared/localization/locales/pt-PT.json +50 -50
  109. package/shared/localization/locales/pt.json +50 -50
  110. package/shared/localization/locales/ro.json +50 -50
  111. package/shared/localization/locales/ru.json +50 -50
  112. package/shared/localization/locales/sk.json +50 -50
  113. package/shared/localization/locales/sl.json +50 -50
  114. package/shared/localization/locales/sr-Latn.json +50 -50
  115. package/shared/localization/locales/sr.json +50 -50
  116. package/shared/localization/locales/sv.json +50 -50
  117. package/shared/localization/locales/ta.json +50 -50
  118. package/shared/localization/locales/te.json +50 -50
  119. package/shared/localization/locales/th.json +50 -50
  120. package/shared/localization/locales/tr.json +50 -50
  121. package/shared/localization/locales/uk.json +50 -50
  122. package/shared/localization/locales/vi.json +50 -50
  123. package/shared/localization/locales/zh-HK.json +50 -50
  124. package/shared/localization/locales/zh-TW.json +50 -50
  125. package/shared/localization/locales/zh.json +50 -50
  126. package/shared/test/util-test.js +214 -0
  127. package/shared/util.d.ts +122 -0
  128. package/shared/util.js +332 -0
  129. package/types/artifacts.d.ts +14 -0
  130. package/types/lhr/lhr.d.ts +33 -0
  131. package/report/renderer/util.d.ts +0 -230
@@ -19,7 +19,7 @@ limitations under the License.
19
19
  <head>
20
20
  <meta charset="utf-8">
21
21
  <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
22
- <link rel="icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAEhklEQVR4AWJxL/BhIAesev1U5tcflpncgNrKIsqNIwzC9feMpDUzs70kOczMzMzJJcxwCTMzncPMnOwtzBwzMzPb0vRfeZPp0VhPS5I39V5fdiXV1/VD+9QC7OVn9BsyH1XIoEI1PfmJvLFowVV564+34DFUHudbmfDh4kVXh//7XwE+WjS/YfXZe3yr4j2rqj1AIhSB7hZ8ZtPZu/zw8cK523U4wE1/rvPfWrz4zs0m9ZdC9yUJAlASdBAgocRegfF/f3/h/PuaFsxMdwjAR0vm1+06eMMfIrhLqTWqdH4EumU2SPfMhigJAlRQbZrgrRsl9U+Y2DYDFCz3ILC9kiAiqSrMwbWT0nceEnR+9Kggc2zjOJCASDENkg0a5HfZZgDP81CM3CrQs2Z1+o7DJ6ePr8sK0AOCHv5Jjdt3evyYSaZ351VIStIxPRAUtrBYbxC6w+BZ0ivVSBKkIhJhemSyZpfB00EiPO2VjzYkxhcqXQqCWCShGplvi3y0QxqbuBurMjyJeWnkHZuAEgIQGsUBqwrfjZ+IlBgKyRJzVVYF8O6qFWdh86YzQzMrZigYmxAyfvHgLZQ/LC1CbeniW2Hkqr/PH16SgvGuf2/uzNMBwJA/njxizGPtSyAf7EziJCMGRDRdhoAC4PL1A/SrKQMAAQkEfpJAcRQdrBJ7gNwjSpJsdwK+CANBkqa1LgQB4IicV9nYUct7gaxuDJUErQIiEAiMxLVOFlKzIktPpT0ggpdpC/8YAHnxbgkUY4tAAFSR7AAXNyAAWHJrA/kHGjzg5nleuwFO7Nd/IoDw4Pm58+4jNLmYG0wRA5bErc2Mr3Y+dXTDW1VvwqbJkzMCHQ4S1GTCBOIgUHJrGdEwqzR+jAp/o2qAZelUDoQnruEEdDclJI6576AlNVfc+22XN/+Y1vnJD0Yind6UpEEvn/Hqq15EYjCW7jZCJEpnNvDgkyelDjs106kuux2AAXCSobULOWP8mLhYlpoDMK4qAFXJGk+grtH8YXVz5KJblqaG1+VUdTc0I290bmUQAriGITRbdQnom0aoFj8kx1+wMD2ifncAXUQE4SkDqN1hE0jEophs1SUwZAOhUAiMCLwRtamtTZtbbmZErSAUHbSysaoEmnrsakiMiUAURi283gN6wans9oX8rOCrj7/JP35DFD+iQ7Au/K2KE1jzx6ujjUnXFH9KjEq6ZlhsTBICrNLJf47Pv/pkHzvup1w4dmUbEei0+bcXRqJuh5kVARQ8byyYxOwNGr7A87xh1tp8sGT+uMInrwi++Xj7TQz2d27NvwEkrOflAFQGIDA5khASBCGdO2/Z/MnLPwYfv5TFhjW7QhVKAB6afwe2LpFlFsCnlQEosgQgDsdOG1/LKeNqJS4JCSPJ/i+TakwEARor7gER1Iva5JmPOJK0RUqmoPnnlzFCtmIAhAAQEIQRgDaiYPIauNXcnDlRIrWNFY3hm7PG9YRqr7IV7HrCgAC17befjEvRq2nGhAHtBqDpOuI/I1diUUAMYIxEdyejBJqLnNoszGZtfiX/CztGv2mq+sdaAAAAAElFTkSuQmCC">
22
+ <link rel="icon" href='data:image/svg+xml;utf8,<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><path d="m14 7 10-7 10 7v10h5v7h-5l5 24H9l5-24H9v-7h5V7Z" fill="%23F63"/><path d="M31.561 24H14l-1.689 8.105L31.561 24ZM18.983 48H9l1.022-4.907L35.723 32.27l1.663 7.98L18.983 48Z" fill="%23FFA385"/><path fill="%23FF3" d="M20.5 10h7v7h-7z"/></svg>'>
23
23
  <title>Lighthouse Flow Report</title>
24
24
  <style>/*%%LIGHTHOUSE_FLOW_CSS%%*/</style>
25
25
  <style>body {margin: 0}</style>
@@ -9,7 +9,7 @@ import {useEffect, useState} from 'preact/hooks';
9
9
 
10
10
  import {NavigationIcon, SnapshotIcon, TimespanIcon} from './icons';
11
11
  import {getFilmstripFrames, getScreenDimensions} from './util';
12
- import {Util} from '../../report/renderer/util.js';
12
+ import {Util} from '../../shared/util.js';
13
13
 
14
14
  const ANIMATION_FRAME_DURATION_MS = 500;
15
15
 
@@ -4,106 +4,109 @@
4
4
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
5
5
  */
6
6
  import { FunctionComponent } from 'preact';
7
- import { I18n } from '../../../report/renderer/i18n';
8
- declare function useI18n(): I18n<{
9
- navigationDescription: string;
10
- timespanDescription: string;
11
- snapshotDescription: string;
12
- navigationLongDescription: string;
13
- timespanLongDescription: string;
14
- snapshotLongDescription: string;
15
- navigationReport: string;
16
- timespanReport: string;
17
- snapshotReport: string;
18
- summary: string;
19
- allReports: string;
20
- title: string;
21
- categories: string;
22
- categoryPerformance: string;
23
- categoryAccessibility: string;
24
- categoryBestPractices: string;
25
- categorySeo: string;
26
- categoryProgressiveWebApp: string;
27
- desktop: string;
28
- mobile: string;
29
- ratingPass: string;
30
- ratingAverage: string;
31
- ratingFail: string;
32
- ratingError: string;
33
- navigationReportCount: string;
34
- timespanReportCount: string;
35
- snapshotReportCount: string;
36
- save: string;
37
- helpLabel: string;
38
- helpDialogTitle: string;
39
- helpUseCaseInstructionNavigation: string;
40
- helpUseCaseInstructionTimespan: string;
41
- helpUseCaseInstructionSnapshot: string;
42
- helpUseCaseNavigation1: string;
43
- helpUseCaseNavigation2: string;
44
- helpUseCaseNavigation3: string;
45
- helpUseCaseTimespan1: string;
46
- helpUseCaseTimespan2: string;
47
- helpUseCaseSnapshot1: string;
48
- helpUseCaseSnapshot2: string;
49
- passedAuditCount: string;
50
- passableAuditCount: string;
51
- informativeAuditCount: string;
52
- highestImpact: string;
53
- varianceDisclaimer: string;
54
- calculatorLink: string;
55
- showRelevantAudits: string;
56
- opportunityResourceColumnLabel: string;
57
- opportunitySavingsColumnLabel: string;
58
- errorMissingAuditInfo: string;
59
- errorLabel: string;
60
- warningHeader: string;
61
- warningAuditsGroupTitle: string;
62
- passedAuditsGroupTitle: string;
63
- notApplicableAuditsGroupTitle: string;
64
- manualAuditsGroupTitle: string;
65
- toplevelWarningsMessage: string;
66
- crcInitialNavigation: string;
67
- crcLongestDurationLabel: string;
68
- snippetExpandButtonLabel: string;
69
- snippetCollapseButtonLabel: string;
70
- lsPerformanceCategoryDescription: string;
71
- labDataTitle: string;
72
- thirdPartyResourcesLabel: string;
73
- viewTreemapLabel: string;
74
- viewTraceLabel: string;
75
- viewOriginalTraceLabel: string;
76
- dropdownPrintSummary: string;
77
- dropdownPrintExpanded: string;
78
- dropdownCopyJSON: string;
79
- dropdownSaveHTML: string;
80
- dropdownSaveJSON: string;
81
- dropdownViewer: string;
82
- dropdownSaveGist: string;
83
- dropdownDarkTheme: string;
84
- runtimeSettingsDevice: string;
85
- runtimeSettingsNetworkThrottling: string;
86
- runtimeSettingsCPUThrottling: string;
87
- runtimeSettingsUANetwork: string;
88
- runtimeSettingsBenchmark: string;
89
- runtimeSettingsAxeVersion: string;
90
- runtimeSettingsScreenEmulation: string;
91
- footerIssue: string;
92
- runtimeNoEmulation: string;
93
- runtimeMobileEmulation: string;
94
- runtimeDesktopEmulation: string;
95
- runtimeUnknown: string;
96
- runtimeSingleLoad: string;
97
- runtimeAnalysisWindow: string;
98
- runtimeSingleLoadTooltip: string;
99
- throttlingProvided: string;
100
- show: string;
101
- hide: string;
102
- expandView: string;
103
- collapseView: string;
104
- runtimeSlow4g: string;
105
- runtimeCustom: string;
106
- }>;
7
+ import { I18nFormatter } from '../../../report/renderer/i18n-formatter';
8
+ declare function useI18n(): {
9
+ formatter: I18nFormatter;
10
+ strings: {
11
+ navigationDescription: string;
12
+ timespanDescription: string;
13
+ snapshotDescription: string;
14
+ navigationLongDescription: string;
15
+ timespanLongDescription: string;
16
+ snapshotLongDescription: string;
17
+ navigationReport: string;
18
+ timespanReport: string;
19
+ snapshotReport: string;
20
+ summary: string;
21
+ allReports: string;
22
+ title: string;
23
+ categories: string;
24
+ categoryPerformance: string;
25
+ categoryAccessibility: string;
26
+ categoryBestPractices: string;
27
+ categorySeo: string;
28
+ categoryProgressiveWebApp: string;
29
+ desktop: string;
30
+ mobile: string;
31
+ ratingPass: string;
32
+ ratingAverage: string;
33
+ ratingFail: string;
34
+ ratingError: string;
35
+ navigationReportCount: string;
36
+ timespanReportCount: string;
37
+ snapshotReportCount: string;
38
+ save: string;
39
+ helpLabel: string;
40
+ helpDialogTitle: string;
41
+ helpUseCaseInstructionNavigation: string;
42
+ helpUseCaseInstructionTimespan: string;
43
+ helpUseCaseInstructionSnapshot: string;
44
+ helpUseCaseNavigation1: string;
45
+ helpUseCaseNavigation2: string;
46
+ helpUseCaseNavigation3: string;
47
+ helpUseCaseTimespan1: string;
48
+ helpUseCaseTimespan2: string;
49
+ helpUseCaseSnapshot1: string;
50
+ helpUseCaseSnapshot2: string;
51
+ passedAuditCount: string;
52
+ passableAuditCount: string;
53
+ informativeAuditCount: string;
54
+ highestImpact: string;
55
+ varianceDisclaimer: string;
56
+ calculatorLink: string;
57
+ showRelevantAudits: string;
58
+ opportunityResourceColumnLabel: string;
59
+ opportunitySavingsColumnLabel: string;
60
+ errorMissingAuditInfo: string;
61
+ errorLabel: string;
62
+ warningHeader: string;
63
+ warningAuditsGroupTitle: string;
64
+ passedAuditsGroupTitle: string;
65
+ notApplicableAuditsGroupTitle: string;
66
+ manualAuditsGroupTitle: string;
67
+ toplevelWarningsMessage: string;
68
+ crcInitialNavigation: string;
69
+ crcLongestDurationLabel: string;
70
+ snippetExpandButtonLabel: string;
71
+ snippetCollapseButtonLabel: string;
72
+ lsPerformanceCategoryDescription: string;
73
+ labDataTitle: string;
74
+ thirdPartyResourcesLabel: string;
75
+ viewTreemapLabel: string;
76
+ viewTraceLabel: string;
77
+ viewOriginalTraceLabel: string;
78
+ dropdownPrintSummary: string;
79
+ dropdownPrintExpanded: string;
80
+ dropdownCopyJSON: string;
81
+ dropdownSaveHTML: string;
82
+ dropdownSaveJSON: string;
83
+ dropdownViewer: string;
84
+ dropdownSaveGist: string;
85
+ dropdownDarkTheme: string;
86
+ runtimeSettingsDevice: string;
87
+ runtimeSettingsNetworkThrottling: string;
88
+ runtimeSettingsCPUThrottling: string;
89
+ runtimeSettingsUANetwork: string;
90
+ runtimeSettingsBenchmark: string;
91
+ runtimeSettingsAxeVersion: string;
92
+ runtimeSettingsScreenEmulation: string;
93
+ footerIssue: string;
94
+ runtimeNoEmulation: string;
95
+ runtimeMobileEmulation: string;
96
+ runtimeDesktopEmulation: string;
97
+ runtimeUnknown: string;
98
+ runtimeSingleLoad: string;
99
+ runtimeAnalysisWindow: string;
100
+ runtimeSingleLoadTooltip: string;
101
+ throttlingProvided: string;
102
+ show: string;
103
+ hide: string;
104
+ expandView: string;
105
+ collapseView: string;
106
+ runtimeSlow4g: string;
107
+ runtimeCustom: string;
108
+ };
109
+ };
107
110
  declare function useLocalizedStrings(): {
108
111
  navigationDescription: string;
109
112
  timespanDescription: string;
@@ -8,13 +8,17 @@ import {createContext, FunctionComponent} from 'preact';
8
8
  import {useContext, useMemo} from 'preact/hooks';
9
9
 
10
10
  import {formatMessage} from '../../../shared/localization/format';
11
- import {I18n} from '../../../report/renderer/i18n';
11
+ import {I18nFormatter} from '../../../report/renderer/i18n-formatter';
12
12
  import {UIStrings} from './ui-strings';
13
13
  import {useFlowResult} from '../util';
14
14
  import strings from './localized-strings.js';
15
- import {Util} from '../../../report/renderer/util';
15
+ import {UIStrings as ReportUIStrings} from '../../../report/renderer/report-utils.js';
16
+ import {Globals} from '../../../report/renderer/report-globals.js';
16
17
 
17
- const I18nContext = createContext(new I18n('en-US', {...Util.UIStrings, ...UIStrings}));
18
+ const I18nContext = createContext({
19
+ formatter: new I18nFormatter('en-US'),
20
+ strings: {...ReportUIStrings, ...UIStrings},
21
+ });
18
22
 
19
23
  function useLhrLocale() {
20
24
  const flowResult = useFlowResult();
@@ -51,23 +55,24 @@ const I18nProvider: FunctionComponent = ({children}) => {
51
55
  const {locale, lhrStrings} = useLhrLocale();
52
56
 
53
57
  const i18n = useMemo(() => {
54
- const i18n = new I18n(locale, {
55
- // Set any missing lhr strings to default (english) values.
56
- ...Util.UIStrings,
57
- // Preload with strings from the first lhr.
58
- // Used for legacy report components imported into the flow report.
59
- ...lhrStrings,
60
- // Set any missing flow strings to default (english) values.
61
- ...UIStrings,
62
- // `strings` is generated in build/build-report.js
63
- ...strings[locale],
58
+ Globals.apply({
59
+ providedStrings: {
60
+ // Preload with strings from the first lhr.
61
+ // Used for legacy report components imported into the flow report.
62
+ ...lhrStrings,
63
+ // Set any missing flow strings to default (english) values.
64
+ ...UIStrings,
65
+ // `strings` is generated in build/build-report.js
66
+ ...strings[locale],
67
+ },
68
+ i18n: new I18nFormatter(locale),
69
+ reportJson: null,
64
70
  });
65
71
 
66
- // Initialize renderer util i18n for strings rendered in wrapped components.
67
- // TODO: Don't attach global i18n to `Util`.
68
- Util.i18n = i18n;
69
-
70
- return i18n;
72
+ return {
73
+ formatter: Globals.i18n,
74
+ strings: Globals.strings as typeof UIStrings & typeof ReportUIStrings,
75
+ };
71
76
  }, [locale, lhrStrings]);
72
77
 
73
78
  return (
@@ -6,7 +6,7 @@
6
6
 
7
7
  import {FunctionComponent} from 'preact';
8
8
 
9
- import {Util} from '../../../report/renderer/util';
9
+ import {ReportUtils} from '../../../report/renderer/report-utils.js';
10
10
  import {Separator} from '../common';
11
11
  import {useI18n, useLocalizedStrings} from '../i18n/i18n';
12
12
  import {CpuIcon, EnvIcon, NetworkIcon, SummaryIcon} from '../icons';
@@ -34,7 +34,7 @@ const SidebarSummary: FunctionComponent = () => {
34
34
  const SidebarRuntimeSettings: FunctionComponent<{settings: LH.ConfigSettings}> =
35
35
  ({settings}) => {
36
36
  const strings = useLocalizedStrings();
37
- const env = Util.getEmulationDescriptions(settings);
37
+ const env = ReportUtils.getEmulationDescriptions(settings);
38
38
  const deviceEmulationString = env.screenEmulation ?
39
39
  `${env.deviceEmulation} - ${env.screenEmulation}` :
40
40
  env.deviceEmulation;
@@ -77,7 +77,7 @@ const SidebarHeader: FunctionComponent<{title: string, date: string}> = ({title,
77
77
  return (
78
78
  <div className="SidebarHeader">
79
79
  <div className="SidebarHeader__title">{title}</div>
80
- <div className="SidebarHeader__date">{i18n.formatDateTime(date)}</div>
80
+ <div className="SidebarHeader__date">{i18n.formatter.formatDateTime(date)}</div>
81
81
  </div>
82
82
  );
83
83
  };
@@ -6,7 +6,7 @@
6
6
 
7
7
  import {FunctionComponent} from 'preact';
8
8
 
9
- import {Util} from '../../../report/renderer/util';
9
+ import {ReportUtils} from '../../../report/renderer/report-utils.js';
10
10
  import {Separator} from '../common';
11
11
  import {CategoryScore} from '../wrappers/category-score';
12
12
  import {useI18n, useStringFormatter, useLocalizedStrings} from '../i18n/i18n';
@@ -48,7 +48,7 @@ function getOverallSavings(audit: LH.ReportResult.AuditRef): number {
48
48
  }
49
49
 
50
50
  const SummaryTooltipAudit: FunctionComponent<{audit: LH.ReportResult.AuditRef}> = ({audit}) => {
51
- const rating = Util.calculateRating(audit.result.score, audit.result.scoreDisplayMode);
51
+ const rating = ReportUtils.calculateRating(audit.result.score, audit.result.scoreDisplayMode);
52
52
  return (
53
53
  <div className={`SummaryTooltipAudit SummaryTooltipAudit--${rating}`}>
54
54
  <Markdown text={audit.result.title}/>
@@ -69,7 +69,7 @@ const SummaryTooltipAudits: FunctionComponent<{category: LH.ReportResult.Categor
69
69
  // We don't want unweighted audits except for opportunities with potential savings.
70
70
  (audit.weight > 0 || getOverallSavings(audit) > 0) &&
71
71
  // Passing audits should never be high impact.
72
- !Util.showAsPassed(audit.result);
72
+ !ReportUtils.showAsPassed(audit.result);
73
73
  }
74
74
 
75
75
  const audits = category.auditRefs
@@ -107,14 +107,14 @@ const SummaryTooltip: FunctionComponent<{
107
107
  numPassableAudits,
108
108
  numInformative,
109
109
  totalWeight,
110
- } = Util.calculateCategoryFraction(category);
110
+ } = ReportUtils.calculateCategoryFraction(category);
111
111
 
112
112
  const i18n = useI18n();
113
- const displayAsFraction = Util.shouldDisplayAsFraction(gatherMode);
113
+ const displayAsFraction = ReportUtils.shouldDisplayAsFraction(gatherMode);
114
114
  const score = displayAsFraction ?
115
115
  numPassed / numPassableAudits :
116
116
  category.score;
117
- const rating = score === null ? 'error' : Util.calculateRating(score);
117
+ const rating = score === null ? 'error' : ReportUtils.calculateRating(score);
118
118
 
119
119
  return (
120
120
  <div className="SummaryTooltip">
@@ -132,7 +132,7 @@ const SummaryTooltip: FunctionComponent<{
132
132
  {
133
133
  !displayAsFraction && category.score !== null && <>
134
134
  <span> · </span>
135
- <span>{i18n.formatInteger(category.score * 100)}</span>
135
+ <span>{i18n.formatter.formatInteger(category.score * 100)}</span>
136
136
  </>
137
137
  }
138
138
  </div>
@@ -9,7 +9,7 @@ import {useMemo} from 'preact/hooks';
9
9
 
10
10
  import {FlowSegment, FlowStepThumbnail, Separator} from '../common';
11
11
  import {getModeDescription, useFlowResult} from '../util';
12
- import {Util} from '../../../report/renderer/util';
12
+ import {ReportUtils} from '../../../report/renderer/report-utils.js';
13
13
  import {SummaryCategory} from './category';
14
14
  import {useStringFormatter, useLocalizedStrings} from '../i18n/i18n';
15
15
 
@@ -49,7 +49,7 @@ const SummaryFlowStep: FunctionComponent<{
49
49
  label: string,
50
50
  hashIndex: number,
51
51
  }> = ({lhr, label, hashIndex}) => {
52
- const reportResult = useMemo(() => Util.prepareReportResult(lhr), [lhr]);
52
+ const reportResult = useMemo(() => ReportUtils.prepareReportResult(lhr), [lhr]);
53
53
  const strings = useLocalizedStrings();
54
54
  const modeDescription = getModeDescription(lhr.gatherMode, strings);
55
55
 
@@ -26,34 +26,10 @@ saveHtml.saveFile = saveFile;
26
26
  /* eslint-disable max-len */
27
27
  const Logo: FunctionComponent = () => {
28
28
  return (
29
- <svg height="24" width="24" viewBox="0 0 24 24" role="img">
30
- <defs>
31
- <linearGradient x1="57.456%" y1="13.086%" x2="18.259%" y2="72.322%" id="Topbar__logo--a">
32
- <stop stop-color="#262626" stop-opacity=".1" offset="0%"/>
33
- <stop stop-color="#262626" stop-opacity="0" offset="100%"/>
34
- </linearGradient>
35
- <linearGradient x1="100%" y1="50%" x2="0%" y2="50%" id="Topbar__logo--b">
36
- <stop stop-color="#262626" stop-opacity=".1" offset="0%"/>
37
- <stop stop-color="#262626" stop-opacity="0" offset="100%"/>
38
- </linearGradient>
39
- <linearGradient x1="58.764%" y1="65.756%" x2="36.939%" y2="50.14%" id="Topbar__logo--c">
40
- <stop stop-color="#262626" stop-opacity=".1" offset="0%"/>
41
- <stop stop-color="#262626" stop-opacity="0" offset="100%"/>
42
- </linearGradient>
43
- <linearGradient x1="41.635%" y1="20.358%" x2="72.863%" y2="85.424%" id="Topbar__logo--d">
44
- <stop stop-color="#FFF" stop-opacity=".1" offset="0%"/>
45
- <stop stop-color="#FFF" stop-opacity="0" offset="100%"/>
46
- </linearGradient>
47
- </defs>
48
- <g fill="none" fill-rule="evenodd">
49
- <path d="M12 3l4.125 2.625v3.75H18v2.25h-1.688l1.5 9.375H6.188l1.5-9.375H6v-2.25h1.875V5.648L12 3zm2.201 9.938L9.54 14.633 9 18.028l5.625-2.062-.424-3.028zM12.005 5.67l-1.88 1.207v2.498h3.75V6.86l-1.87-1.19z" fill="#F44B21"/>
50
- <path fill="#FFF" d="M14.201 12.938L9.54 14.633 9 18.028l5.625-2.062z"/>
51
- <path d="M6 18c-2.042 0-3.95-.01-5.813 0l1.5-9.375h4.326L6 18z" fill="url(#Topbar__logo--a)" fill-rule="nonzero" transform="translate(6 3)"/>
52
- <path fill="#FFF176" fill-rule="nonzero" d="M13.875 9.375v-2.56l-1.87-1.19-1.88 1.207v2.543z"/>
53
- <path fill="url(#Topbar__logo--b)" fill-rule="nonzero" d="M0 6.375h6v2.25H0z" transform="translate(6 3)"/>
54
- <path fill="url(#Topbar__logo--c)" fill-rule="nonzero" d="M6 6.375H1.875v-3.75L6 0z" transform="translate(6 3)"/>
55
- <path fill="url(#Topbar__logo--d)" fill-rule="nonzero" d="M6 0l4.125 2.625v3.75H12v2.25h-1.688l1.5 9.375H.188l1.5-9.375H0v-2.25h1.875V2.648z" transform="translate(6 3)"/>
56
- </g>
29
+ <svg role="img" class="lh-topbar__logo" title="Lighthouse logo" width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
30
+ <path d="m14 7 10-7 10 7v10h5v7h-5l5 24H9l5-24H9v-7h5V7Z" fill="#F63"/>
31
+ <path d="M31.561 24H14l-1.689 8.105L31.561 24ZM18.983 48H9l1.022-4.907L35.723 32.27l1.663 7.98L18.983 48Z" fill="#FFA385"/>
32
+ <path fill="#FF3" d="M20.5 10h7v7h-7z"/>
57
33
  </svg>
58
34
  );
59
35
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "lighthouse",
3
3
  "type": "module",
4
- "version": "9.5.0-dev.20230122",
4
+ "version": "9.5.0-dev.20230124",
5
5
  "description": "Automated auditing, performance metrics, and best practices for the web.",
6
6
  "main": "./core/index.js",
7
7
  "bin": {
@@ -26,7 +26,7 @@
26
26
  "build-smokehouse-bundle": "node ./build/build-smokehouse-bundle.js",
27
27
  "build-lr": "yarn reset-link && node ./build/build-lightrider-bundles.js",
28
28
  "build-pack": "bash build/build-pack.sh",
29
- "build-report": "node build/build-report-components.js && bash core/scripts/copy-util-commonjs.sh && node build/build-report.js",
29
+ "build-report": "node build/build-report-components.js && node build/build-report.js",
30
30
  "build-sample-reports": "yarn build-report && node build/build-sample-reports.js",
31
31
  "build-treemap": "node ./build/build-treemap.js",
32
32
  "build-viewer": "node ./build/build-viewer.js",
@@ -169,7 +169,7 @@
169
169
  "pako": "^2.0.3",
170
170
  "preact": "^10.7.2",
171
171
  "pretty-json-stringify": "^0.0.2",
172
- "puppeteer": "^18.0.5",
172
+ "puppeteer": "^19.6.0",
173
173
  "resolve": "^1.20.0",
174
174
  "rollup": "^2.52.7",
175
175
  "rollup-plugin-node-resolve": "^5.2.0",
@@ -200,11 +200,11 @@
200
200
  "lighthouse-stack-packs": "1.8.2",
201
201
  "lodash": "^4.17.21",
202
202
  "lookup-closest-locale": "6.2.0",
203
- "metaviewport-parser": "0.2.0",
203
+ "metaviewport-parser": "0.3.0",
204
204
  "open": "^8.4.0",
205
205
  "parse-cache-control": "1.0.1",
206
206
  "ps-list": "^8.0.0",
207
- "puppeteer-core": "^18.0.5",
207
+ "puppeteer-core": "^19.6.0",
208
208
  "quibble": "connorjclark/quibble#fork",
209
209
  "robots-parser": "^3.0.0",
210
210
  "semver": "^5.3.0",
package/readme.md CHANGED
@@ -461,7 +461,7 @@ See [Contributing](./CONTRIBUTING.md) to get started.
461
461
 
462
462
  ---
463
463
  <p align="center">
464
- <img src="https://raw.githubusercontent.com/GoogleChrome/lighthouse/8b3d7f052b2e64dd857e741d7395647f487697e7/assets/lighthouse-logo.png" alt="Lighthouse logo" height="150">
464
+ <img src="./assets/lighthouse-logo_512px.png" alt="Lighthouse logo" height="150">
465
465
  <br>
466
466
  <b>Lighthouse</b>, ˈlītˌhous (n): a <s>tower or other structure</s> tool containing a beacon light
467
467
  to warn or guide <s>ships at sea</s> developers.
@@ -19,7 +19,7 @@ limitations under the License.
19
19
  <head>
20
20
  <meta charset="utf-8">
21
21
  <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
22
- <link rel="icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAEhklEQVR4AWJxL/BhIAesev1U5tcflpncgNrKIsqNIwzC9feMpDUzs70kOczMzMzJJcxwCTMzncPMnOwtzBwzMzPb0vRfeZPp0VhPS5I39V5fdiXV1/VD+9QC7OVn9BsyH1XIoEI1PfmJvLFowVV564+34DFUHudbmfDh4kVXh//7XwE+WjS/YfXZe3yr4j2rqj1AIhSB7hZ8ZtPZu/zw8cK523U4wE1/rvPfWrz4zs0m9ZdC9yUJAlASdBAgocRegfF/f3/h/PuaFsxMdwjAR0vm1+06eMMfIrhLqTWqdH4EumU2SPfMhigJAlRQbZrgrRsl9U+Y2DYDFCz3ILC9kiAiqSrMwbWT0nceEnR+9Kggc2zjOJCASDENkg0a5HfZZgDP81CM3CrQs2Z1+o7DJ6ePr8sK0AOCHv5Jjdt3evyYSaZ351VIStIxPRAUtrBYbxC6w+BZ0ivVSBKkIhJhemSyZpfB00EiPO2VjzYkxhcqXQqCWCShGplvi3y0QxqbuBurMjyJeWnkHZuAEgIQGsUBqwrfjZ+IlBgKyRJzVVYF8O6qFWdh86YzQzMrZigYmxAyfvHgLZQ/LC1CbeniW2Hkqr/PH16SgvGuf2/uzNMBwJA/njxizGPtSyAf7EziJCMGRDRdhoAC4PL1A/SrKQMAAQkEfpJAcRQdrBJ7gNwjSpJsdwK+CANBkqa1LgQB4IicV9nYUct7gaxuDJUErQIiEAiMxLVOFlKzIktPpT0ggpdpC/8YAHnxbgkUY4tAAFSR7AAXNyAAWHJrA/kHGjzg5nleuwFO7Nd/IoDw4Pm58+4jNLmYG0wRA5bErc2Mr3Y+dXTDW1VvwqbJkzMCHQ4S1GTCBOIgUHJrGdEwqzR+jAp/o2qAZelUDoQnruEEdDclJI6576AlNVfc+22XN/+Y1vnJD0Yind6UpEEvn/Hqq15EYjCW7jZCJEpnNvDgkyelDjs106kuux2AAXCSobULOWP8mLhYlpoDMK4qAFXJGk+grtH8YXVz5KJblqaG1+VUdTc0I290bmUQAriGITRbdQnom0aoFj8kx1+wMD2ifncAXUQE4SkDqN1hE0jEophs1SUwZAOhUAiMCLwRtamtTZtbbmZErSAUHbSysaoEmnrsakiMiUAURi283gN6wans9oX8rOCrj7/JP35DFD+iQ7Au/K2KE1jzx6ujjUnXFH9KjEq6ZlhsTBICrNLJf47Pv/pkHzvup1w4dmUbEei0+bcXRqJuh5kVARQ8byyYxOwNGr7A87xh1tp8sGT+uMInrwi++Xj7TQz2d27NvwEkrOflAFQGIDA5khASBCGdO2/Z/MnLPwYfv5TFhjW7QhVKAB6afwe2LpFlFsCnlQEosgQgDsdOG1/LKeNqJS4JCSPJ/i+TakwEARor7gER1Iva5JmPOJK0RUqmoPnnlzFCtmIAhAAQEIQRgDaiYPIauNXcnDlRIrWNFY3hm7PG9YRqr7IV7HrCgAC17befjEvRq2nGhAHtBqDpOuI/I1diUUAMYIxEdyejBJqLnNoszGZtfiX/CztGv2mq+sdaAAAAAElFTkSuQmCC">
22
+ <link rel="icon" href='data:image/svg+xml;utf8,<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><path d="m14 7 10-7 10 7v10h5v7h-5l5 24H9l5-24H9v-7h5V7Z" fill="%23F63"/><path d="M31.561 24H14l-1.689 8.105L31.561 24ZM18.983 48H9l1.022-4.907L35.723 32.27l1.663 7.98L18.983 48Z" fill="%23FFA385"/><path fill="%23FF3" d="M20.5 10h7v7h-7z"/></svg>'>
23
23
  <title>Lighthouse Report</title>
24
24
  <style>body {margin: 0}</style>
25
25
  </head>
@@ -918,7 +918,7 @@
918
918
  justify-content: space-between;
919
919
  padding-bottom: var(--default-padding);
920
920
  width: 100%;
921
- grid-template-columns: repeat(auto-fit, 60px);
921
+ grid-template-columns: repeat(auto-fit, 90px);
922
922
  }
923
923
 
924
924
  .lh-filmstrip__frame {
@@ -928,8 +928,8 @@
928
928
 
929
929
  .lh-filmstrip__thumbnail {
930
930
  border: 1px solid var(--report-border-color-secondary);
931
- max-height: 100px;
932
- max-width: 60px;
931
+ max-height: 150px;
932
+ max-width: 120px;
933
933
  }
934
934
 
935
935
  /* Audit */
@@ -366,34 +366,10 @@ limitations under the License.
366
366
 
367
367
  <div class="lh-topbar">
368
368
  <!-- Lighthouse logo. -->
369
- <svg class="lh-topbar__logo" viewBox="0 0 24 24">
370
- <defs>
371
- <linearGradient x1="57.456%" y1="13.086%" x2="18.259%" y2="72.322%" id="lh-topbar__logo--a">
372
- <stop stop-color="#262626" stop-opacity=".1" offset="0%"/>
373
- <stop stop-color="#262626" stop-opacity="0" offset="100%"/>
374
- </linearGradient>
375
- <linearGradient x1="100%" y1="50%" x2="0%" y2="50%" id="lh-topbar__logo--b">
376
- <stop stop-color="#262626" stop-opacity=".1" offset="0%"/>
377
- <stop stop-color="#262626" stop-opacity="0" offset="100%"/>
378
- </linearGradient>
379
- <linearGradient x1="58.764%" y1="65.756%" x2="36.939%" y2="50.14%" id="lh-topbar__logo--c">
380
- <stop stop-color="#262626" stop-opacity=".1" offset="0%"/>
381
- <stop stop-color="#262626" stop-opacity="0" offset="100%"/>
382
- </linearGradient>
383
- <linearGradient x1="41.635%" y1="20.358%" x2="72.863%" y2="85.424%" id="lh-topbar__logo--d">
384
- <stop stop-color="#FFF" stop-opacity=".1" offset="0%"/>
385
- <stop stop-color="#FFF" stop-opacity="0" offset="100%"/>
386
- </linearGradient>
387
- </defs>
388
- <g fill="none" fill-rule="evenodd">
389
- <path d="M12 3l4.125 2.625v3.75H18v2.25h-1.688l1.5 9.375H6.188l1.5-9.375H6v-2.25h1.875V5.648L12 3zm2.201 9.938L9.54 14.633 9 18.028l5.625-2.062-.424-3.028zM12.005 5.67l-1.88 1.207v2.498h3.75V6.86l-1.87-1.19z" fill="#F44B21"/>
390
- <path fill="#FFF" d="M14.201 12.938L9.54 14.633 9 18.028l5.625-2.062z"/>
391
- <path d="M6 18c-2.042 0-3.95-.01-5.813 0l1.5-9.375h4.326L6 18z" fill="url(#lh-topbar__logo--a)" fill-rule="nonzero" transform="translate(6 3)"/>
392
- <path fill="#FFF176" fill-rule="nonzero" d="M13.875 9.375v-2.56l-1.87-1.19-1.88 1.207v2.543z"/>
393
- <path fill="url(#lh-topbar__logo--b)" fill-rule="nonzero" d="M0 6.375h6v2.25H0z" transform="translate(6 3)"/>
394
- <path fill="url(#lh-topbar__logo--c)" fill-rule="nonzero" d="M6 6.375H1.875v-3.75L6 0z" transform="translate(6 3)"/>
395
- <path fill="url(#lh-topbar__logo--d)" fill-rule="nonzero" d="M6 0l4.125 2.625v3.75H12v2.25h-1.688l1.5 9.375H.188l1.5-9.375H0v-2.25h1.875V2.648z" transform="translate(6 3)"/>
396
- </g>
369
+ <svg role="img" class="lh-topbar__logo" title="Lighthouse logo" fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
370
+ <path d="m14 7 10-7 10 7v10h5v7h-5l5 24H9l5-24H9v-7h5V7Z" fill="#F63"/>
371
+ <path d="M31.561 24H14l-1.689 8.105L31.561 24ZM18.983 48H9l1.022-4.907L35.723 32.27l1.663 7.98L18.983 48Z" fill="#FFA385"/>
372
+ <path fill="#FF3" d="M20.5 10h7v7h-7z"/>
397
373
  </svg>
398
374
 
399
375
  <a href="" class="lh-topbar__url" target="_blank" rel="noopener"></a>