Filip/playwright
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

simplify

Browse source
This commit is contained in:
Simon Knott 2024-10-15 15:16:34 +02:00
parent e19f0ee735
commit 8687e5505e
No known key found for this signature in database
GPG key ID: 8CEDC00028084AEC
3 changed files with 13 additions and 39 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
packages/trace-viewer/src/sw/main.ts
View file

@ -129,13 +129,6 @@ async function doFetch(event: FetchEvent): Promise<Response> {
return response; return response;
} }
if (relativePath.startsWith('/screenshot/')) {
const { snapshotServer } = loadedTraces.get(traceUrl!) || {};
if (!snapshotServer)
return new Response(null, { status: 404 });
return snapshotServer.serveClosestScreenshot(relativePath, url.searchParams);
}
if (relativePath.startsWith('/sha1/')) { if (relativePath.startsWith('/sha1/')) {
// Sha1 for sources is based on the file path, can't load it of a random model. // Sha1 for sources is based on the file path, can't load it of a random model.
const sha1 = relativePath.slice('/sha1/'.length); const sha1 = relativePath.slice('/sha1/'.length);

8
packages/trace-viewer/src/sw/snapshotRenderer.ts
View file

@ -78,7 +78,7 @@ export class SnapshotRenderer {
return this._snapshots[this._index].viewport; return this._snapshots[this._index].viewport;
} }
render(swScope: string, traceURL: string): RenderedFrameSnapshot { render(screenshotUrl: string | undefined): RenderedFrameSnapshot {
const result: string[] = []; const result: string[] = [];
const visit = (n: NodeSnapshot, snapshotIndex: number, parentTag: string | undefined, parentAttrs: [string, string][] | undefined) => { const visit = (n: NodeSnapshot, snapshotIndex: number, parentTag: string | undefined, parentAttrs: [string, string][] | undefined) => {
// Text node. // Text node.
@ -154,16 +154,12 @@ export class SnapshotRenderer {
const html = lruCache(this, () => { const html = lruCache(this, () => {
visit(snapshot.html, this._index, undefined, undefined); visit(snapshot.html, this._index, undefined, undefined);
const screenshotURL = new URL(`./screenshot/${snapshot.pageId}`, swScope);
screenshotURL.searchParams.set('trace', traceURL);
screenshotURL.searchParams.set('name', this.snapshotName!);
const html = result.join(''); const html = result.join('');
// Hide the document in order to prevent flickering. We will unhide once script has processed shadow. // Hide the document in order to prevent flickering. We will unhide once script has processed shadow.
const prefix = snapshot.doctype ? `<!DOCTYPE ${snapshot.doctype}>` : ''; const prefix = snapshot.doctype ? `<!DOCTYPE ${snapshot.doctype}>` : '';
return prefix + [ return prefix + [
'<style>*,*::before,*::after { visibility: hidden }</style>', '<style>*,*::before,*::after { visibility: hidden }</style>',
`<script>${snapshotScript(screenshotURL.toString(), this._callId, this.snapshotName)}</script>` `<script>${snapshotScript(screenshotUrl, this._callId, this.snapshotName)}</script>`
].join('') + html; ].join('') + html;
}); });

37
packages/trace-viewer/src/sw/snapshotServer.ts
View file

@ -47,34 +47,19 @@ export class SnapshotServer {
const snapshot = this._snapshot(pathname.substring('/snapshot'.length), searchParams); const snapshot = this._snapshot(pathname.substring('/snapshot'.length), searchParams);
if (!snapshot) if (!snapshot)
return new Response(null, { status: 404 }); return new Response(null, { status: 404 });
const renderedSnapshot = snapshot.render(swScope, traceUrl);
this._snapshotIds.set(snapshotUrl, snapshot); let screenshotUrl: URL | undefined;
return new Response(renderedSnapshot.html, { status: 200, headers: { 'Content-Type': 'text/html; charset=utf-8' } }); const { wallTime, timestamp, pageId } = snapshot.snapshot();
const page = this._pages.get(pageId);
if (page) {
const closestFrame = (wallTime && page.screencastFrames[0]?.frameSwapWallTime) ? findClosest(page.screencastFrames, frame => frame.frameSwapWallTime!, wallTime) : findClosest(page.screencastFrames, frame => frame.timestamp, timestamp);
if (closestFrame)
screenshotUrl = new URL(`./sha1/${closestFrame.sha1}`, swScope);
} }
async serveClosestScreenshot(pathname: string, searchParams: URLSearchParams): Promise<Response> { const renderedSnapshot = snapshot.render(screenshotUrl?.toString());
const snapshotRenderer = this._snapshot(pathname.substring('/screenshot'.length), searchParams); this._snapshotIds.set(snapshotUrl, snapshot);
if (!snapshotRenderer) return new Response(renderedSnapshot.html, { status: 200, headers: { 'Content-Type': 'text/html; charset=utf-8' } });
return new Response(undefined, { status: 404 });
const { wallTime, timestamp, pageId } = snapshotRenderer.snapshot();
const page = this._pages.get(pageId);
if (!page)
return new Response(undefined, { status: 404 });
let sha1 = undefined;
if (wallTime && page.screencastFrames[0]?.frameSwapWallTime)
sha1 = findClosest(page.screencastFrames, frame => frame.frameSwapWallTime!, wallTime)?.sha1;
sha1 ??= findClosest(page.screencastFrames, frame => frame.timestamp, timestamp)?.sha1;
if (!sha1)
return new Response(undefined, { status: 404 });
const blob = await this._resourceLoader(sha1);
if (!blob)
return new Response(undefined, { status: 404 });
return new Response(blob);
} }
serveSnapshotInfo(pathname: string, searchParams: URLSearchParams): Response { serveSnapshotInfo(pathname: string, searchParams: URLSearchParams): Response {