Skip to content

Commit 041601e

Browse files
authored
Upgrade Argos (#3145)
1 parent 5567281 commit 041601e

File tree

5 files changed

+78
-51
lines changed

5 files changed

+78
-51
lines changed

bun.lock

+18-18
Original file line numberDiff line numberDiff line change
@@ -110,7 +110,7 @@
110110
"zustand": "^5.0.3",
111111
},
112112
"devDependencies": {
113-
"@argos-ci/playwright": "^4.3.0",
113+
"@argos-ci/playwright": "^5.0.2",
114114
"@cloudflare/next-on-pages": "1.13.7",
115115
"@cloudflare/workers-types": "^4.20241230.0",
116116
"@playwright/test": "^1.51.1",
@@ -274,15 +274,15 @@
274274

275275
"@alloc/quick-lru": ["@alloc/[email protected]", "", {}, "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw=="],
276276

277-
"@argos-ci/api-client": ["@argos-ci/[email protected].0", "", { "dependencies": { "debug": "^4.4.0", "openapi-fetch": "0.13.4" } }, "sha512-UHa1vAf8gwHVpkqM/RaSryrFe1juqWH6dHpPeMtT4e/ZMB9hNYwYFinaGq/KRWe88JEi2WeAu776YdoeUSZQkQ=="],
277+
"@argos-ci/api-client": ["@argos-ci/[email protected].1", "", { "dependencies": { "debug": "^4.4.0", "openapi-fetch": "0.13.5" } }, "sha512-3IHv7ANSPNO6OwWgwULlHbP9/tFV9kQDu6+nL9jysfPkGj0GgtrOsyBb+iU931c7wSMo1OD+XNujCnRzDD968w=="],
278278

279-
"@argos-ci/browser": ["@argos-ci/browser@3.2.0", "", {}, "sha512-mHLUamfywbdzrM6SRV4KB4kEQs2lrFxC1yS+QWB/9lME7FKzr7MJW/Q++iWcQli8IbmtLsZ+PqP2eqLaDiRsUw=="],
279+
"@argos-ci/browser": ["@argos-ci/browser@4.1.0", "", {}, "sha512-B5zRl70hfckS8Tpgr35ZPit/87AyIETeqm5f8dfB/qWBdkDuKW2m6tCDnVD1UYdFy4k6tU5DaD/rAMw17swsJQ=="],
280280

281-
"@argos-ci/core": ["@argos-ci/[email protected].0", "", { "dependencies": { "@argos-ci/api-client": "0.8.0", "@argos-ci/util": "2.3.0", "axios": "^1.7.9", "convict": "^6.2.4", "debug": "^4.4.0", "fast-glob": "^3.3.3", "sharp": "^0.33.5", "tmp": "^0.2.3" } }, "sha512-bo/pNKk6P0pz4NRdymgU1letwQrRbMPTeFyMsUEW8fhKNdesSFnFIWZBFGsGkkh05uw75PBjl2ZN4PvQ2TxSog=="],
281+
"@argos-ci/core": ["@argos-ci/[email protected].1", "", { "dependencies": { "@argos-ci/api-client": "0.8.1", "@argos-ci/util": "2.3.1", "axios": "^1.8.4", "convict": "^6.2.4", "debug": "^4.4.0", "fast-glob": "^3.3.3", "sharp": "^0.33.5", "tmp": "^0.2.3" } }, "sha512-7iE3o1XGxlfHC5AF05pzT0OxuO387sryrZt3gKGj/e+6R20DXz7J49yI8++nQ2cuT+wLhcJp8+X0ox+SGMYHmw=="],
282282

283-
"@argos-ci/playwright": ["@argos-ci/playwright@4.3.0", "", { "dependencies": { "@argos-ci/browser": "3.2.0", "@argos-ci/core": "3.1.0", "@argos-ci/util": "2.3.0", "chalk": "^5.4.1", "debug": "^4.4.0" } }, "sha512-UQBC78zWg+bWXDaevWOL4m6zkrNeprMfdqjy6zagvU9kq7sPQC7nN/qZQ15hs/FT+JpTCa8CbbSAq13eQrmxKQ=="],
283+
"@argos-ci/playwright": ["@argos-ci/playwright@5.0.2", "", { "dependencies": { "@argos-ci/browser": "4.1.0", "@argos-ci/core": "3.1.1", "@argos-ci/util": "2.3.1", "chalk": "^5.4.1", "debug": "^4.4.0" } }, "sha512-aOfuvsLZHSrbnOppcY6f36LQR7CQHi8/L1N7qbhVYGMfUL6jVJPzx4XliixgIBcJjCpFmIZ2qoXgQPO/Gp1fHg=="],
284284

285-
"@argos-ci/util": ["@argos-ci/[email protected].0", "", {}, "sha512-tkxnCpaj7yN9nCFzo9MX0FJ5YjUepEOGYfdvF8COQqp+EdY1qubOPpc4Z0l1B60BlC8YtjQv/oRxHSh1XzxWFg=="],
285+
"@argos-ci/util": ["@argos-ci/[email protected].1", "", {}, "sha512-kE61HU2480fbAnimmA4x9HK45ZJvkoqLdW5GxT5uvwhkclQykVd2S6WfGFUr3JokTXfZ5LZEEfoWgtGA316KSQ=="],
286286

287287
"@ast-grep/napi": ["@ast-grep/[email protected]", "", { "optionalDependencies": { "@ast-grep/napi-darwin-arm64": "0.35.0", "@ast-grep/napi-darwin-x64": "0.35.0", "@ast-grep/napi-linux-arm64-gnu": "0.35.0", "@ast-grep/napi-linux-arm64-musl": "0.35.0", "@ast-grep/napi-linux-x64-gnu": "0.35.0", "@ast-grep/napi-linux-x64-musl": "0.35.0", "@ast-grep/napi-win32-arm64-msvc": "0.35.0", "@ast-grep/napi-win32-ia32-msvc": "0.35.0", "@ast-grep/napi-win32-x64-msvc": "0.35.0" } }, "sha512-3ucaaSxV6fxXoqHrE/rxAvP1THnDdY5jNzGlnvx+JvnY9C/dSRKc0jlRMRz59N3El572+/yNRUUpAV1T9aBJug=="],
288288

@@ -1442,7 +1442,7 @@
14421442

14431443
"aws4fetch": ["[email protected]", "", {}, "sha512-/djoAN709iY65ETD6LKCtyyEI04XIBP5xVvfmNxsEP0uJB5tyaGBztSryRr4HqMStr9R06PisQE7m9zDTXKu6g=="],
14441444

1445-
"axios": ["axios@1.7.9", "", { "dependencies": { "follow-redirects": "^1.15.6", "form-data": "^4.0.0", "proxy-from-env": "^1.1.0" } }, "sha512-LhLcE7Hbiryz8oMDdDptSrWowmB4Bl6RCt6sIJKpRB4XtVf0iEgewX3au/pJqm+Py1kCASkb/FFKjxQaLtxJvw=="],
1445+
"axios": ["axios@1.8.4", "", { "dependencies": { "follow-redirects": "^1.15.6", "form-data": "^4.0.0", "proxy-from-env": "^1.1.0" } }, "sha512-eBSYY4Y68NNlHbHBMdeDmKNtDgXWhQsJcGqzO3iLUM0GraQFSS9cVgPX5I9b3lbdFKyYoAEGAZF1DwhTaljNAw=="],
14461446

14471447
"bail": ["[email protected]", "", {}, "sha512-0xO6mYd7JB2YesxDKplafRpsiOzPt9V02ddPCLbY1xYGPOX24NTyN50qnUxgCPcSoYMhKpAuBTjQoRZCAkUDRw=="],
14481448

@@ -2364,7 +2364,7 @@
23642364

23652365
"oniguruma-to-es": ["[email protected]", "", { "dependencies": { "emoji-regex-xs": "^1.0.0", "oniguruma-parser": "^0.5.4", "regex": "^6.0.1", "regex-recursion": "^6.0.2" } }, "sha512-SNwG909cSLo4vPyyPbU/VJkEc9WOXqu2ycBlfd1UCXLqk1IijcQktSBb2yRQ2UFPsDhpkaf+C1dtT3PkLK/yWA=="],
23662366

2367-
"openapi-fetch": ["[email protected].4", "", { "dependencies": { "openapi-typescript-helpers": "^0.0.15" } }, "sha512-JHX7UYjLEiHuQGCPxa3CCCIqe/nc4bTIF9c4UYVC8BegAbWoS3g4gJxKX5XcG7UtYQs2060kY6DH64KkvNZahg=="],
2367+
"openapi-fetch": ["[email protected].5", "", { "dependencies": { "openapi-typescript-helpers": "^0.0.15" } }, "sha512-AQK8T9GSKFREFlN1DBXTYsLjs7YV2tZcJ7zUWxbjMoQmj8dDSFRrzhLCbHPZWA1TMV3vACqfCxLEZcwf2wxV6Q=="],
23682368

23692369
"openapi-types": ["[email protected]", "", {}, "sha512-N4YtSYJqghVu4iek2ZUvcN/0aqH1kRDuNqzcycDxhOUpg7GdvLa2F3DgS6yBNhInhv2r/6I0Flkn7CqL8+nIcw=="],
23702370

@@ -4018,7 +4018,7 @@
40184018

40194019
"gaxios/node-fetch": ["[email protected]", "", { "dependencies": { "whatwg-url": "^5.0.0" }, "peerDependencies": { "encoding": "^0.1.0" }, "optionalPeers": ["encoding"] }, "sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A=="],
40204020

4021-
"gitbook-v2/next": ["[email protected]", "", { "dependencies": { "@next/env": "15.3.1-canary.4", "@swc/counter": "0.1.3", "@swc/helpers": "0.5.15", "busboy": "1.6.0", "caniuse-lite": "^1.0.30001579", "postcss": "8.4.31", "styled-jsx": "5.1.6" }, "optionalDependencies": { "@next/swc-darwin-arm64": "15.3.1-canary.4", "@next/swc-darwin-x64": "15.3.1-canary.4", "@next/swc-linux-arm64-gnu": "15.3.1-canary.4", "@next/swc-linux-arm64-musl": "15.3.1-canary.4", "@next/swc-linux-x64-gnu": "15.3.1-canary.4", "@next/swc-linux-x64-musl": "15.3.1-canary.4", "@next/swc-win32-arm64-msvc": "15.3.1-canary.4", "@next/swc-win32-x64-msvc": "15.3.1-canary.4", "sharp": "^0.34.1" }, "peerDependencies": { "@opentelemetry/api": "^1.1.0", "@playwright/test": "^1.41.2", "babel-plugin-react-compiler": "*", "react": "^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0", "react-dom": "^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0", "sass": "^1.3.0" }, "optionalPeers": ["@opentelemetry/api", "@playwright/test", "babel-plugin-react-compiler", "sass"], "bin": { "next": "dist/bin/next" } }, "sha512-bVUdzmbfd3gEu30Riin463JNwTRbcOY/DlCY/+WhgwUR6Sfu1uJeyl3kGAjw58I+ZoNX2omJVpTd9AMluZ26qA=="],
4021+
"gitbook-v2/next": ["[email protected]", "", { "dependencies": { "@next/env": "15.3.1-canary.6", "@swc/counter": "0.1.3", "@swc/helpers": "0.5.15", "busboy": "1.6.0", "caniuse-lite": "^1.0.30001579", "postcss": "8.4.31", "styled-jsx": "5.1.6" }, "optionalDependencies": { "@next/swc-darwin-arm64": "15.3.1-canary.6", "@next/swc-darwin-x64": "15.3.1-canary.6", "@next/swc-linux-arm64-gnu": "15.3.1-canary.6", "@next/swc-linux-arm64-musl": "15.3.1-canary.6", "@next/swc-linux-x64-gnu": "15.3.1-canary.6", "@next/swc-linux-x64-musl": "15.3.1-canary.6", "@next/swc-win32-arm64-msvc": "15.3.1-canary.6", "@next/swc-win32-x64-msvc": "15.3.1-canary.6", "sharp": "^0.34.1" }, "peerDependencies": { "@opentelemetry/api": "^1.1.0", "@playwright/test": "^1.41.2", "babel-plugin-react-compiler": "*", "react": "^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0", "react-dom": "^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0", "sass": "^1.3.0" }, "optionalPeers": ["@opentelemetry/api", "@playwright/test", "babel-plugin-react-compiler", "sass"], "bin": { "next": "dist/bin/next" } }, "sha512-mw5jVmLEGeDeuRqATKUw/ldoYTqKlz7/Zn8EPaxpOny/yKrpxVCpW8z+ji/jCm8SmyvLYuyn743ll/6tInzCzQ=="],
40224022

40234023
"global-dirs/ini": ["[email protected]", "", {}, "sha512-iKpRpXP+CrP2jyrxvg1kMUpXDyRUFDWurxbnVT1vQPx+Wz9uCYsMIqYuSBLV+PAaZG/d7kRLKRFc9oDMsH+mFQ=="],
40244024

@@ -4886,23 +4886,23 @@
48864886

48874887
"gaxios/https-proxy-agent/debug": ["[email protected]", "", { "dependencies": { "ms": "^2.1.3" } }, "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ=="],
48884888

4889-
"gitbook-v2/next/@next/env": ["@next/[email protected].4", "", {}, "sha512-Bw464vR3fVUrhHQOh0o0ilXQ6wg6OvsNn3afUTjm1a0n0JmJJ+n9M1041xmBHSBGWUfTe74HepSmy79sF8EDlA=="],
4889+
"gitbook-v2/next/@next/env": ["@next/[email protected].6", "", {}, "sha512-RZuPfUpY1Vcc9qFEGgmrl7PlcU+G2e0AZzTGL+amv3y0PXpC6Bp6dNGUSckUAxrzh6j3IQEKSM1cnselxFjCNg=="],
48904890

4891-
"gitbook-v2/next/@next/swc-darwin-arm64": ["@next/[email protected].4", "", { "os": "darwin", "cpu": "arm64" }, "sha512-ZR497D00W62Tf566uakD+VvA/2Cmagix3suVlB7TxLSPxXFAU5DeGQvaT9jkP+x1lEKggcZ+chI1CB9CcjvlTQ=="],
4891+
"gitbook-v2/next/@next/swc-darwin-arm64": ["@next/[email protected].6", "", { "os": "darwin", "cpu": "arm64" }, "sha512-boVBCyPE9Q8QOkgR/JqBzPqmRnPedvzRZVO8/TU388jdNcB2sGhYSdlLAdn3/j3byyi0ne/YN31OwPq/FYdtMw=="],
48924892

4893-
"gitbook-v2/next/@next/swc-darwin-x64": ["@next/[email protected].4", "", { "os": "darwin", "cpu": "x64" }, "sha512-dX0X7NG6goshCgbKsSzn6wVzgkRlUqRXMjO9E46B6HqcV/L8l15rMVhWr8zBzDt/7gEmAylnlnML8Zqv9BiF1Q=="],
4893+
"gitbook-v2/next/@next/swc-darwin-x64": ["@next/[email protected].6", "", { "os": "darwin", "cpu": "x64" }, "sha512-GDiTNrwTB9a6843PBAvKvD7+j6Zvy8PdMQNyF5Q0u58m29s+M9wP2ie0+3wdIdaLX/H2cVKnFGP5fAMzTsAjaw=="],
48944894

4895-
"gitbook-v2/next/@next/swc-linux-arm64-gnu": ["@next/[email protected].4", "", { "os": "linux", "cpu": "arm64" }, "sha512-ehE8KbvyBa7grVzC+n+L9CHbainjg362coYObhak3Jktnvb0uPf/m2kqgfN3UBzGSAczvcAuEbsLulFifAnFrw=="],
4895+
"gitbook-v2/next/@next/swc-linux-arm64-gnu": ["@next/[email protected].6", "", { "os": "linux", "cpu": "arm64" }, "sha512-UUQAAe1vrFWsE94vbmCUMQk3YfOvGAlD+mbwFN5vHprgANvaSoL+kMxnF4K/IqjEltuGaNQyP63omyvPoOvXnQ=="],
48964896

4897-
"gitbook-v2/next/@next/swc-linux-arm64-musl": ["@next/[email protected].4", "", { "os": "linux", "cpu": "arm64" }, "sha512-5NBstNVZeRP0OeRQGZqQGmrUdMVsMS556BekDeFqgwMqN/Ibq/EYwMMn1dkP26Dln9qIOj167Mde9CC2c3SQUg=="],
4897+
"gitbook-v2/next/@next/swc-linux-arm64-musl": ["@next/[email protected].6", "", { "os": "linux", "cpu": "arm64" }, "sha512-jbpLxohCU9VhWBNvIFr2rLDWIqBhmGI4ODSLffqI6dApIc92q+rLYS3YMsu9VWOd1/ivoKpXT1yAWqkfYiJxGQ=="],
48984898

4899-
"gitbook-v2/next/@next/swc-linux-x64-gnu": ["@next/[email protected].4", "", { "os": "linux", "cpu": "x64" }, "sha512-6CVq5yFWj2uZ3VgSl0OcCVVfH+EZhOqDocvCeXRaEvpVWq0s9zXPA6GgZghNY7Z5YSZXkB6z7Qi3xG+hzNLQ0A=="],
4899+
"gitbook-v2/next/@next/swc-linux-x64-gnu": ["@next/[email protected].6", "", { "os": "linux", "cpu": "x64" }, "sha512-0UKu7pOOXi7Kn7rylskI7f4kT57icLnVA2X8y4U1LHs5KOU03uRA9h8ofQgWXgbQigPdBwR1Kn/APmYOyqNWZg=="],
49004900

4901-
"gitbook-v2/next/@next/swc-linux-x64-musl": ["@next/[email protected].4", "", { "os": "linux", "cpu": "x64" }, "sha512-3AiB/lUOa8QMsUM4KW0IYuMqvvMLQyANb13pGKihemtYUEjPS4/Jf5/vkz0qWF0AOP/1DNECdKpCIenU2C2pIA=="],
4901+
"gitbook-v2/next/@next/swc-linux-x64-musl": ["@next/[email protected].6", "", { "os": "linux", "cpu": "x64" }, "sha512-FRTdzhAX5uKb6YQ/o4ykWt3vrpfg1PIOaLh8rriA/DDzzTTBEL/JSMc5Xc/DpnbRJhA/OUHMkNW8Y29qjezKhA=="],
49024902

4903-
"gitbook-v2/next/@next/swc-win32-arm64-msvc": ["@next/[email protected].4", "", { "os": "win32", "cpu": "arm64" }, "sha512-WACNwz1q2DtYqZXj+IjGME3D6XxRkkyuynMyC6d4tH5IahnxiwkJtfaRE1DwWWbVUPQ6TtevSEgCOh3eFk5yFQ=="],
4903+
"gitbook-v2/next/@next/swc-win32-arm64-msvc": ["@next/[email protected].6", "", { "os": "win32", "cpu": "arm64" }, "sha512-SrTGmFwMHagT1CYXTn/xtJFfjuBcYBZNKipmdg8k7mv9ROB5rO47Xeb7tzmbtCL2JQtP2mDg8blIHCfo5HnkwA=="],
49044904

4905-
"gitbook-v2/next/@next/swc-win32-x64-msvc": ["@next/[email protected].4", "", { "os": "win32", "cpu": "x64" }, "sha512-qbmYHxGD3MaI3OJ0NLRcBhfDoSnkvqqrZNmPIuPSlkOUlj+eIuyGtWMRocaYCGTEvQstlspymIsVzSfiyI+6ng=="],
4905+
"gitbook-v2/next/@next/swc-win32-x64-msvc": ["@next/[email protected].6", "", { "os": "win32", "cpu": "x64" }, "sha512-uofQ0olsdSketGLIgTEgXAh9UH4YJK2i1+IJxq+U1H/cqN3yvk9CQ8wrgo9cyKQ1oA/D5IVqzszPGlV9UV8SXQ=="],
49064906

49074907
"gitbook-v2/next/postcss": ["[email protected]", "", { "dependencies": { "nanoid": "^3.3.6", "picocolors": "^1.0.0", "source-map-js": "^1.0.2" } }, "sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ=="],
49084908

packages/gitbook/e2e/util.ts

+42-29
Original file line numberDiff line numberDiff line change
@@ -219,10 +219,10 @@ export function runTestCases(testCases: TestsCase[]) {
219219
fullPage: testEntry.fullPage ?? false,
220220
beforeScreenshot: async ({ runStabilization }) => {
221221
await runStabilization();
222-
await waitForIcons(page);
223222
if (screenshotOptions?.waitForTOCScrolling !== false) {
224223
await waitForTOCScrolling(page);
225224
}
225+
await waitForIcons(page);
226226
},
227227
});
228228
}
@@ -345,61 +345,74 @@ export function getCustomizationURL(partial: DeepPartial<SiteCustomizationSettin
345345
*/
346346
async function waitForIcons(page: Page) {
347347
await page.waitForFunction(() => {
348-
const urls = new Set<string>();
348+
const urlStates: Record<string, 'pending' | 'loaded'> =
349+
(window as any).__ICONS_STATES__ || {};
350+
(window as any).__ICONS_STATES__ = urlStates;
351+
352+
const loadUrl = (url: string) => {
353+
// Mark the URL as pending.
354+
urlStates[url] = 'pending';
355+
356+
const img = new Image();
357+
img.onload = () => {
358+
urlStates[url] = 'loaded';
359+
};
360+
img.src = url;
361+
};
362+
349363
const icons = Array.from(document.querySelectorAll('svg.gb-icon'));
350364
const results = icons.map((icon) => {
351365
if (!(icon instanceof SVGElement)) {
352366
throw new Error('Icon is not an SVGElement');
353367
}
354368

355-
// If loaded, good it passes the test.
356-
if (icon.dataset.loadingState === 'loaded') {
369+
// Ignore icons that are not visible.
370+
if (!icon.checkVisibility()) {
357371
return true;
358372
}
359373

360-
// If not loaded yet, we need to load it.
361-
if (icon.dataset.loadingState === 'pending') {
374+
const state = icon.getAttribute('data-argos-state');
375+
376+
if (state === 'pending') {
362377
return false;
363378
}
364379

365-
// Ignore icons that are not visible.
366-
if (!icon.checkVisibility()) {
380+
if (state === 'loaded') {
367381
return true;
368382
}
369383

370384
// url("https://ka-p.fontawesome.com/releases/v6.6.0/svgs/light/moon.svg?v=2&token=a463935e93")
371385
const maskImage = window.getComputedStyle(icon).getPropertyValue('mask-image');
372386
const urlMatch = maskImage.match(/url\("([^"]+)"\)/);
373-
const url = urlMatch ? urlMatch[1] : null;
387+
const url = urlMatch?.[1];
374388

375389
// If URL is invalid we throw an error.
376390
if (!url) {
377391
throw new Error('No mask-image');
378392
}
379393

380-
// If the URL is already loaded, we just mark it as loaded.
381-
if (urls.has(url)) {
382-
icon.dataset.loadingState = 'loaded';
383-
return true;
384-
}
385-
386-
// Mark the icon as pending and load the image.
387-
icon.dataset.loadingState = 'pending';
388-
389-
// Mark the URL as seen.
390-
urls.add(url);
391-
392-
const img = new Image();
393-
img.src = url;
394-
img.decode().then(() => {
395-
// Wait two frames to let the time to the icon to repaint.
396-
requestAnimationFrame(() => {
394+
// If the URL is already queued for loading, we return the state.
395+
if (urlStates[url]) {
396+
if (urlStates[url] === 'loaded') {
397+
icon.setAttribute('data-argos-state', 'pending');
398+
const bckMaskImage = icon.style.maskImage;
399+
const bckDisplay = icon.style.display;
400+
icon.style.maskImage = '';
401+
icon.style.display = 'none';
402+
// Force re-rendering
403+
icon.getBoundingClientRect();
404+
icon.style.maskImage = bckMaskImage;
405+
icon.style.display = bckDisplay;
397406
requestAnimationFrame(() => {
398-
icon.dataset.loadingState = 'loaded';
407+
icon.setAttribute('data-argos-state', 'loaded');
399408
});
400-
});
401-
});
409+
return false;
410+
}
411+
412+
return false;
413+
}
402414

415+
loadUrl(url);
403416
return false;
404417
});
405418

packages/gitbook/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,7 @@
7575
"zustand": "^5.0.3"
7676
},
7777
"devDependencies": {
78-
"@argos-ci/playwright": "^4.3.0",
78+
"@argos-ci/playwright": "^5.0.2",
7979
"@cloudflare/next-on-pages": "1.13.7",
8080
"@cloudflare/workers-types": "^4.20241230.0",
8181
"@playwright/test": "^1.51.1",

packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx

+10-1
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ export function ClientCodeBlock(props: ClientBlockProps) {
2626
const [isInViewport, setIsInViewport] = useState(false);
2727
const plainLines = useMemo(() => plainHighlight(block, []), [block]);
2828
const [lines, setLines] = useState<null | HighlightLine[]>(null);
29+
const [highlighting, setHighlighting] = useState(false);
2930

3031
// Preload the highlighter when the block is mounted.
3132
useEffect(() => {
@@ -77,13 +78,15 @@ export function ClientCodeBlock(props: ClientBlockProps) {
7778
let cancelled = false;
7879

7980
if (typeof window !== 'undefined') {
81+
setHighlighting(true);
8082
import('./highlight').then(({ highlight }) => {
8183
highlight(block, inlines).then((lines) => {
8284
if (cancelled) {
8385
return;
8486
}
8587

8688
setLines(lines);
89+
setHighlighting(false);
8790
});
8891
});
8992
}
@@ -98,6 +101,12 @@ export function ClientCodeBlock(props: ClientBlockProps) {
98101
}, [isInViewport, block, inlines]);
99102

100103
return (
101-
<CodeBlockRenderer ref={blockRef} block={block} style={style} lines={lines ?? plainLines} />
104+
<CodeBlockRenderer
105+
ref={blockRef}
106+
aria-busy={highlighting}
107+
block={block}
108+
style={style}
109+
lines={lines ?? plainLines}
110+
/>
102111
);
103112
}

packages/gitbook/src/components/DocumentView/CodeBlock/CodeBlockRenderer.tsx

+7-2
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import './CodeBlockRenderer.css';
1414

1515
type CodeBlockRendererProps = Pick<BlockProps<DocumentBlockCode>, 'block' | 'style'> & {
1616
lines: HighlightLine[];
17+
'aria-busy'?: boolean;
1718
};
1819

1920
/**
@@ -23,15 +24,19 @@ export const CodeBlockRenderer = forwardRef(function CodeBlockRenderer(
2324
props: CodeBlockRendererProps,
2425
ref: React.ForwardedRef<HTMLDivElement>
2526
) {
26-
const { block, style, lines } = props;
27+
const { block, style, lines, 'aria-busy': ariaBusy } = props;
2728

2829
const id = useId();
2930
const withLineNumbers = Boolean(block.data.lineNumbers) && block.nodes.length > 1;
3031
const withWrap = block.data.overflow === 'wrap';
3132
const title = block.data.title;
3233

3334
return (
34-
<div ref={ref} className={tcls('group/codeblock grid grid-flow-col', style)}>
35+
<div
36+
ref={ref}
37+
aria-busy={ariaBusy}
38+
className={tcls('group/codeblock grid grid-flow-col', style)}
39+
>
3540
<div className="flex items-center justify-start gap-2 text-sm [grid-area:1/1]">
3641
{title ? (
3742
<div className="inline-flex items-center justify-center rounded-t straight-corners:rounded-t-s bg-tint px-3 py-2 text-tint text-xs leading-none tracking-wide">

0 commit comments

Comments
 (0)