From 0164c920f8abfe2939daac5348bf7069612a9dbf Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 22 Oct 2025 09:18:37 +0000 Subject: [PATCH 1/3] chore(deps-dev): bump chrome-devtools-frontend Bumps the chrome-devtools-frontend group with 1 update: [chrome-devtools-frontend](https://github.com/ChromeDevTools/devtools-frontend). Updates `chrome-devtools-frontend` from 1.0.1524741 to 1.0.1531367 - [Commits](https://github.com/ChromeDevTools/devtools-frontend/compare/v1.0.1524741...v1.0.1531367) --- updated-dependencies: - dependency-name: chrome-devtools-frontend dependency-version: 1.0.1531367 dependency-type: direct:development update-type: version-update:semver-patch dependency-group: chrome-devtools-frontend ... Signed-off-by: dependabot[bot] --- package-lock.json | 8 ++++---- package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index 76d2bc00..f7a50bbd 100644 --- a/package-lock.json +++ b/package-lock.json @@ -25,7 +25,7 @@ "@types/yargs": "^17.0.33", "@typescript-eslint/eslint-plugin": "^8.43.0", "@typescript-eslint/parser": "^8.43.0", - "chrome-devtools-frontend": "1.0.1524741", + "chrome-devtools-frontend": "1.0.1532884", "core-js": "3.46.0", "debug": "4.4.3", "eslint": "^9.35.0", @@ -2224,9 +2224,9 @@ } }, "node_modules/chrome-devtools-frontend": { - "version": "1.0.1524741", - "resolved": "https://registry.npmjs.org/chrome-devtools-frontend/-/chrome-devtools-frontend-1.0.1524741.tgz", - "integrity": "sha512-F2K56RgHeF+8JvQIcIm6GyWNEOqql0eeKwIXLziS//LPBy7/7I6zCko/poRU07U3xlIajhjkZO3dSuimn3fg8Q==", + "version": "1.0.1532884", + "resolved": "https://registry.npmjs.org/chrome-devtools-frontend/-/chrome-devtools-frontend-1.0.1532884.tgz", + "integrity": "sha512-AX7J+CHhwKEgN3+8g3DEl60IiVTGxaC8lHM3X9UjfOSFvBFvSUnHXfZ2Dlc0xa+xQJgcuHlyounCSNkyBIYAoQ==", "dev": true, "license": "BSD-3-Clause" }, diff --git a/package.json b/package.json index a71b47ff..8e866c61 100644 --- a/package.json +++ b/package.json @@ -51,7 +51,7 @@ "@types/yargs": "^17.0.33", "@typescript-eslint/eslint-plugin": "^8.43.0", "@typescript-eslint/parser": "^8.43.0", - "chrome-devtools-frontend": "1.0.1524741", + "chrome-devtools-frontend": "1.0.1532884", "core-js": "3.46.0", "debug": "4.4.3", "eslint": "^9.35.0", From b822b6d12de0541f279c57e59caccd470c2c2ae5 Mon Sep 17 00:00:00 2001 From: Alex Rudenko Date: Wed, 22 Oct 2025 12:31:59 +0200 Subject: [PATCH 2/3] chore: fix connection transport --- src/DevToolsConnectionAdapter.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/DevToolsConnectionAdapter.ts b/src/DevToolsConnectionAdapter.ts index 5a6491e3..94b5240f 100644 --- a/src/DevToolsConnectionAdapter.ts +++ b/src/DevToolsConnectionAdapter.ts @@ -4,14 +4,14 @@ * SPDX-License-Identifier: Apache-2.0 */ -import {Connection} from '../node_modules/chrome-devtools-frontend/front_end/core/protocol_client/InspectorBackend.js'; +import {ConnectionTransport as DevToolsConnectionTransport} from '../node_modules/chrome-devtools-frontend/front_end/core/protocol_client/ConnectionTransport.js'; import {type ConnectionTransport} from './third_party/index.js'; /** * Allows a puppeteer {@link ConnectionTransport} to act like a DevTools {@link Connection}. */ -export class DevToolsConnectionAdapter extends Connection { +export class DevToolsConnectionAdapter extends DevToolsConnectionTransport { #transport: ConnectionTransport | null; #onDisconnect: ((arg0: string) => void) | null = null; From 505904000011c5961ca581e6015d09d4bc54882f Mon Sep 17 00:00:00 2001 From: Alex Rudenko Date: Wed, 22 Oct 2025 12:51:25 +0200 Subject: [PATCH 3/3] chore: fix in prepare --- scripts/post-build.ts | 18 ++----------- scripts/prepare.ts | 24 +++++++++++++++++ scripts/sed.ts | 27 +++++++++++++++++++ tests/tools/performance.test.js.snapshot | 11 ++++---- tests/trace-processing/parse.test.js.snapshot | 10 +++---- 5 files changed, 64 insertions(+), 26 deletions(-) create mode 100644 scripts/sed.ts diff --git a/scripts/post-build.ts b/scripts/post-build.ts index 9cac3788..5fa66d5b 100644 --- a/scripts/post-build.ts +++ b/scripts/post-build.ts @@ -9,6 +9,8 @@ import * as path from 'node:path'; import tsConfig from '../tsconfig.json' with {type: 'json'}; +import {sed} from './sed.ts'; + const BUILD_DIR = path.join(process.cwd(), 'build'); /** @@ -20,22 +22,6 @@ function writeFile(filePath: string, content: string): void { fs.writeFileSync(filePath, content, 'utf-8'); } -/** - * Replaces content in a file. - * @param filePath The path to the file. - * @param find The regex to find. - * @param replace The string to replace with. - */ -function sed(filePath: string, find: RegExp, replace: string): void { - if (!fs.existsSync(filePath)) { - console.warn(`File not found for sed operation: ${filePath}`); - return; - } - const content = fs.readFileSync(filePath, 'utf-8'); - const newContent = content.replace(find, replace); - fs.writeFileSync(filePath, newContent, 'utf-8'); -} - /** * Ensures that licenses for third party files we use gets copied into the build/ dir. */ diff --git a/scripts/prepare.ts b/scripts/prepare.ts index ed8b5ab6..07dc1104 100644 --- a/scripts/prepare.ts +++ b/scripts/prepare.ts @@ -7,6 +7,8 @@ import {rm} from 'node:fs/promises'; import {resolve} from 'node:path'; +import {sed} from './sed.ts'; + const projectRoot = process.cwd(); const filesToRemove = [ @@ -28,6 +30,28 @@ async function main() { process.exit(1); } } + // TODO: remove once https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/7072054 is available. + sed( + 'node_modules/chrome-devtools-frontend/front_end/core/sdk/NetworkManager.ts', + `declare global { + // TS typedefs are not up to date + interface URLPattern { + hash: string; + hostname: string; + password: string; + pathname: string; + port: string; + protocol: string; + search: string; + username: string; + hasRegExpGroups: boolean; + test(url: string): boolean; + } + /* eslint-disable-next-line @typescript-eslint/naming-convention */ + var URLPattern: {prototype: URLPattern, new (input: string): URLPattern}; +}`, + '', + ); console.log('Clean up of chrome-devtools-frontend complete.'); } diff --git a/scripts/sed.ts b/scripts/sed.ts new file mode 100644 index 00000000..817a269a --- /dev/null +++ b/scripts/sed.ts @@ -0,0 +1,27 @@ +/** + * @license + * Copyright 2025 Google LLC + * SPDX-License-Identifier: Apache-2.0 + */ + +import * as fs from 'node:fs'; + +/** + * Replaces content in a file. + * @param filePath The path to the file. + * @param find The regex to find. + * @param replace The string to replace with. + */ +export function sed( + filePath: string, + find: RegExp | string, + replace: string, +): void { + if (!fs.existsSync(filePath)) { + console.warn(`File not found for sed operation: ${filePath}`); + return; + } + const content = fs.readFileSync(filePath, 'utf-8'); + const newContent = content.replace(find, replace); + fs.writeFileSync(filePath, newContent, 'utf-8'); +} diff --git a/tests/tools/performance.test.js.snapshot b/tests/tools/performance.test.js.snapshot index ba704151..f38c86ac 100644 --- a/tests/tools/performance.test.js.snapshot +++ b/tests/tools/performance.test.js.snapshot @@ -38,6 +38,7 @@ We can break this time down into the 4 phases that combine to make the LCP time: ## Estimated savings: none ## External resources: +- https://developer.chrome.com/docs/performance/insights/lcp-breakdown - https://web.dev/articles/lcp - https://web.dev/articles/optimize-lcp `; @@ -66,31 +67,31 @@ Metrics (lab / observed): Metrics (field / real users): n/a – no data for this page in CrUX Available insights: - insight name: LCPBreakdown - description: Each [subpart has specific improvement strategies](https://web.dev/articles/optimize-lcp#lcp-breakdown). Ideally, most of the LCP time should be spent on loading the resources, not within delays. + description: Each [subpart has specific improvement strategies](https://developer.chrome.com/docs/performance/insights/lcp-breakdown). Ideally, most of the LCP time should be spent on loading the resources, not within delays. relevant trace bounds: {min: 122410996889, max: 122411126100} example question: Help me optimize my LCP score example question: Which LCP phase was most problematic? example question: What can I do to reduce the LCP time for this page load? - insight name: LCPDiscovery - description: Optimize LCP by making the LCP image [discoverable](https://web.dev/articles/optimize-lcp#1_eliminate_resource_load_delay) from the HTML immediately, and [avoiding lazy-loading](https://web.dev/articles/lcp-lazy-loading) + description: [Optimize LCP](https://developer.chrome.com/docs/performance/insights/lcp-discovery) by making the LCP image discoverable from the HTML immediately, and avoiding lazy-loading relevant trace bounds: {min: 122411004828, max: 122411055039} example question: Suggest fixes to reduce my LCP example question: What can I do to reduce my LCP discovery time? example question: Why is LCP discovery time important? - insight name: RenderBlocking - description: Requests are blocking the page's initial render, which may delay LCP. [Deferring or inlining](https://web.dev/learn/performance/understanding-the-critical-path#render-blocking_resources) can move these network requests out of the critical path. + description: Requests are blocking the page's initial render, which may delay LCP. [Deferring or inlining](https://developer.chrome.com/docs/performance/insights/render-blocking) can move these network requests out of the critical path. relevant trace bounds: {min: 122411037528, max: 122411053852} example question: Show me the most impactful render blocking requests that I should focus on example question: How can I reduce the number of render blocking requests? - insight name: DocumentLatency - description: Your first network request is the most important. Reduce its latency by avoiding redirects, ensuring a fast server response, and enabling text compression. + description: Your first network request is the most important. [Reduce its latency](https://developer.chrome.com/docs/performance/insights/document-latency) by avoiding redirects, ensuring a fast server response, and enabling text compression. relevant trace bounds: {min: 122410998910, max: 122411043781} estimated metric savings: FCP 0 ms, LCP 0 ms estimated wasted bytes: 77.1 kB example question: How do I decrease the initial loading time of my page? example question: Did anything slow down the request for this document? - insight name: ThirdParties - description: 3rd party code can significantly impact load performance. [Reduce and defer loading of 3rd party code](https://web.dev/articles/optimizing-content-efficiency-loading-third-party-javascript/) to prioritize your page's content. + description: 3rd party code can significantly impact load performance. [Reduce and defer loading of 3rd party code](https://developer.chrome.com/docs/performance/insights/third-parties) to prioritize your page's content. relevant trace bounds: {min: 122411037881, max: 122416229595} example question: Which third parties are having the largest impact on my page performance? diff --git a/tests/trace-processing/parse.test.js.snapshot b/tests/trace-processing/parse.test.js.snapshot index 815206d5..5d26a47e 100644 --- a/tests/trace-processing/parse.test.js.snapshot +++ b/tests/trace-processing/parse.test.js.snapshot @@ -15,31 +15,31 @@ Metrics (lab / observed): Metrics (field / real users): n/a – no data for this page in CrUX Available insights: - insight name: LCPBreakdown - description: Each [subpart has specific improvement strategies](https://web.dev/articles/optimize-lcp#lcp-breakdown). Ideally, most of the LCP time should be spent on loading the resources, not within delays. + description: Each [subpart has specific improvement strategies](https://developer.chrome.com/docs/performance/insights/lcp-breakdown). Ideally, most of the LCP time should be spent on loading the resources, not within delays. relevant trace bounds: {min: 122410996889, max: 122411126100} example question: Help me optimize my LCP score example question: Which LCP phase was most problematic? example question: What can I do to reduce the LCP time for this page load? - insight name: LCPDiscovery - description: Optimize LCP by making the LCP image [discoverable](https://web.dev/articles/optimize-lcp#1_eliminate_resource_load_delay) from the HTML immediately, and [avoiding lazy-loading](https://web.dev/articles/lcp-lazy-loading) + description: [Optimize LCP](https://developer.chrome.com/docs/performance/insights/lcp-discovery) by making the LCP image discoverable from the HTML immediately, and avoiding lazy-loading relevant trace bounds: {min: 122411004828, max: 122411055039} example question: Suggest fixes to reduce my LCP example question: What can I do to reduce my LCP discovery time? example question: Why is LCP discovery time important? - insight name: RenderBlocking - description: Requests are blocking the page's initial render, which may delay LCP. [Deferring or inlining](https://web.dev/learn/performance/understanding-the-critical-path#render-blocking_resources) can move these network requests out of the critical path. + description: Requests are blocking the page's initial render, which may delay LCP. [Deferring or inlining](https://developer.chrome.com/docs/performance/insights/render-blocking) can move these network requests out of the critical path. relevant trace bounds: {min: 122411037528, max: 122411053852} example question: Show me the most impactful render blocking requests that I should focus on example question: How can I reduce the number of render blocking requests? - insight name: DocumentLatency - description: Your first network request is the most important. Reduce its latency by avoiding redirects, ensuring a fast server response, and enabling text compression. + description: Your first network request is the most important. [Reduce its latency](https://developer.chrome.com/docs/performance/insights/document-latency) by avoiding redirects, ensuring a fast server response, and enabling text compression. relevant trace bounds: {min: 122410998910, max: 122411043781} estimated metric savings: FCP 0 ms, LCP 0 ms estimated wasted bytes: 77.1 kB example question: How do I decrease the initial loading time of my page? example question: Did anything slow down the request for this document? - insight name: ThirdParties - description: 3rd party code can significantly impact load performance. [Reduce and defer loading of 3rd party code](https://web.dev/articles/optimizing-content-efficiency-loading-third-party-javascript/) to prioritize your page's content. + description: 3rd party code can significantly impact load performance. [Reduce and defer loading of 3rd party code](https://developer.chrome.com/docs/performance/insights/third-parties) to prioritize your page's content. relevant trace bounds: {min: 122411037881, max: 122416229595} example question: Which third parties are having the largest impact on my page performance?