yujunjun/playwright
1
0
Fork 0
mirror of https://github.com/microsoft/playwright.git synced 2025-06-26 21:40:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: simplify overrides management in trace viewer (#5606)

Browse Source
This commit is contained in:
Pavel Feldman 2021-02-24 18:38:04 -08:00 committed by GitHub
parent 0102e080f6
commit 5ae2661134
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 39 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/server/trace/viewer/frameSnapshot.ts
View File

@ -15,23 +15,25 @@
*/
import * as trace from '../common/traceEvents';
import { ContextEntry } from './traceModel';
import { ContextEntry, ContextResources } from './traceModel';
export * as trace from '../common/traceEvents';
export type SerializedFrameSnapshot = {
html: string;
resourcesByUrl: { [key: string]: { resourceId: string, frameId: string }[] };
overriddenUrls: { [key: string]: boolean };
resourceOverrides: { [key: string]: string };
resources: { [key: string]: { resourceId: string, sha1?: string } };
};
export class FrameSnapshot {
private _snapshots: trace.FrameSnapshotTraceEvent[];
private _index: number;
contextEntry: ContextEntry;
private _contextEntry: ContextEntry;
private _contextResources: ContextResources;
private _frameId: string;
constructor(contextEntry: ContextEntry, events: trace.FrameSnapshotTraceEvent[], index: number) {
this.contextEntry = contextEntry;
constructor(frameId: string, contextEntry: ContextEntry, contextResources: ContextResources, events: trace.FrameSnapshotTraceEvent[], index: number) {
this._frameId = frameId;
this._contextEntry = contextEntry;
this._contextResources = contextResources;
this._snapshots = events;
this._index = index;
}
@ -80,14 +82,19 @@ export class FrameSnapshot {
let html = visit(snapshot.html, this._index);
if (snapshot.doctype)
html = `<!DOCTYPE ${snapshot.doctype}>` + html;
html += `<script>${this.contextEntry.created.snapshotScript}</script>`;
html += `<script>${this._contextEntry.created.snapshotScript}</script>`;
const resourcesByUrl = this.contextEntry.resourcesByUrl;
const overriddenUrls = this.contextEntry.overriddenUrls;
const resourceOverrides: any = {};
for (const o of this._snapshots[this._index].snapshot.resourceOverrides)
resourceOverrides[o.url] = o.sha1;
return { html, resourcesByUrl, overriddenUrls: overriddenUrls, resourceOverrides };
const resources: { [key: string]: { resourceId: string, sha1?: string } } = {};
for (const [url, contextResources] of this._contextResources) {
const contextResource = contextResources.find(r => r.frameId === this._frameId) || contextResources[0];
if (contextResource)
resources[url] = { resourceId: contextResource.resourceId };
}
for (const o of this.traceEvent().snapshot.resourceOverrides) {
const resource = resources[o.url];
resource.sha1 = o.sha1;
}
return { html, resources };
}
}

25
src/server/trace/viewer/snapshotServer.ts
View File

@ -20,6 +20,7 @@ import path from 'path';
import querystring from 'querystring';
import type { TraceModel } from './traceModel';
import { TraceServer } from './traceServer';
import type { SerializedFrameSnapshot } from './frameSnapshot';
export class SnapshotServer {
private _resourcesDir: string | undefined;
@ -104,9 +105,7 @@ export class SnapshotServer {
private _serveServiceWorker(request: http.IncomingMessage, response: http.ServerResponse): boolean {
function serviceWorkerMain(self: any /* ServiceWorkerGlobalScope */) {
const pageToResourcesByUrl = new Map<string, { [key: string]: { resourceId: string, frameId: string }[] }>();
const pageToOverriddenUrls = new Map<string, { [key: string]: boolean }>();
const snapshotToResourceOverrides = new Map<string, { [key: string]: string | undefined }>();
const snapshotResources = new Map<string, { [key: string]: { resourceId?: string, sha1?: string } }>();
self.addEventListener('install', function(event: any) {
});
@ -171,28 +170,22 @@ export class SnapshotServer {
if (request.mode === 'navigate') {
const htmlResponse = await fetch(`/snapshot-data?pageId=${parsed.pageId}&snapshotId=${parsed.snapshotId || ''}&timestamp=${parsed.timestamp || ''}&frameId=${parsed.frameId || ''}`);
const { html, resourcesByUrl, overriddenUrls, resourceOverrides } = await htmlResponse.json();
const { html, resources }: SerializedFrameSnapshot = await htmlResponse.json();
if (!html)
return respondNotAvailable();
pageToResourcesByUrl.set(parsed.pageId, resourcesByUrl);
pageToOverriddenUrls.set(parsed.pageId, overriddenUrls);
snapshotToResourceOverrides.set(parsed.snapshotId + '@' + parsed.timestamp, resourceOverrides);
snapshotResources.set(parsed.snapshotId + '@' + parsed.timestamp, resources);
const response = new Response(html, { status: 200, headers: { 'Content-Type': 'text/html' } });
return response;
}
const resourcesByUrl = pageToResourcesByUrl.get(parsed.pageId);
const overriddenUrls = pageToOverriddenUrls.get(parsed.pageId);
const resourceOverrides = snapshotToResourceOverrides.get(parsed.snapshotId + '@' + parsed.timestamp);
const resources = snapshotResources.get(parsed.snapshotId + '@' + parsed.timestamp)!;
const urlWithoutHash = removeHash(request.url);
const resourcesWithUrl = resourcesByUrl?.[urlWithoutHash] || [];
const resource = resourcesWithUrl.find(r => r.frameId === parsed.frameId) || resourcesWithUrl[0];
const resource = resources[urlWithoutHash];
if (!resource)
return respond404();
const overrideSha1 = resourceOverrides?.[urlWithoutHash];
const fetchUrl = overrideSha1 ?
`/resources/${resource.resourceId}/override/${overrideSha1}` :
const fetchUrl = resource.sha1 ?
`/resources/${resource.resourceId}/override/${resource.sha1}` :
`/resources/${resource.resourceId}`;
const fetchedResponse = await fetch(fetchUrl);
const headers = new Headers(fetchedResponse.headers);
@ -201,7 +194,7 @@ export class SnapshotServer {
// as the original request url.
// Response url turns into resource base uri that is used to resolve
// relative links, e.g. url(/foo/bar) in style sheets.
if (overriddenUrls?.[urlWithoutHash]) {
if (resource.sha1) {
// No cache, so that we refetch overridden resources.
headers.set('Cache-Control', 'no-cache');
}

20
src/server/trace/viewer/traceModel.ts
View File

@ -23,6 +23,7 @@ export class TraceModel {
contextEntries = new Map<string, ContextEntry>();
pageEntries = new Map<string, { contextEntry: ContextEntry, pageEntry: PageEntry }>();
resourceById = new Map<string, trace.NetworkResourceTraceEvent>();
contextResources = new Map<string, ContextResources>();
appendEvents(events: trace.TraceEvent[]) {
for (const event of events)
@ -39,9 +40,8 @@ export class TraceModel {
created: event,
destroyed: undefined as any,
pages: [],
resourcesByUrl: {},
overriddenUrls: {}
});
this.contextResources.set(event.contextId, new Map());
break;
}
case 'context-destroyed': {
@ -104,14 +104,12 @@ export class TraceModel {
pageEntry.snapshotsByFrameId[event.frameId] = snapshots;
}
snapshots.push(event);
const contextEntry = this.contextEntries.get(event.contextId)!;
for (const override of event.snapshot.resourceOverrides) {
if (override.ref) {
const refOverride = snapshots[snapshots.length - 1 - override.ref]?.snapshot.resourceOverrides.find(o => o.url === override.url);
override.sha1 = refOverride?.sha1;
delete override.ref;
}
contextEntry.overriddenUrls[override.url] = true;
}
break;
}
@ -122,11 +120,11 @@ export class TraceModel {
}
appendResource(event: trace.NetworkResourceTraceEvent) {
const contextEntry = this.contextEntries.get(event.contextId)!;
let responseEvents = contextEntry.resourcesByUrl[event.url];
const contextResources = this.contextResources.get(event.contextId)!;
let responseEvents = contextResources.get(event.url);
if (!responseEvents) {
responseEvents = [];
contextEntry.resourcesByUrl[event.url] = responseEvents;
contextResources.set(event.url, responseEvents);
}
responseEvents.push({ frameId: event.frameId, resourceId: event.resourceId });
this.resourceById.set(event.resourceId, event);
@ -159,7 +157,7 @@ export class TraceModel {
const frameSnapshots = pageEntry.snapshotsByFrameId[frameId];
for (let index = 0; index < frameSnapshots.length; index++) {
if (frameSnapshots[index].snapshotId === snapshotId)
return new FrameSnapshot(contextEntry, frameSnapshots, index);
return new FrameSnapshot(frameId, contextEntry, this.contextResources.get(contextEntry.created.contextId)!, frameSnapshots, index);
}
}
@ -172,7 +170,7 @@ export class TraceModel {
if (timestamp && snapshot.timestamp <= timestamp)
snapshotIndex = index;
}
return snapshotIndex >= 0 ? new FrameSnapshot(contextEntry, frameSnapshots, snapshotIndex) : undefined;
return snapshotIndex >= 0 ? new FrameSnapshot(frameId, contextEntry, this.contextResources.get(contextEntry.created.contextId)!, frameSnapshots, snapshotIndex) : undefined;
}
}
@ -183,10 +181,10 @@ export type ContextEntry = {
created: trace.ContextCreatedTraceEvent;
destroyed: trace.ContextDestroyedTraceEvent;
pages: PageEntry[];
resourcesByUrl: { [key: string]: { resourceId: string, frameId: string }[] };
overriddenUrls: { [key: string]: boolean };
}
export type ContextResources = Map<string, { resourceId: string, frameId: string }[]>;
export type InterestingPageEvent = trace.DialogOpenedEvent | trace.DialogClosedEvent | trace.NavigationEvent | trace.LoadEvent;
export type PageEntry = {