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

chore: fix trace viewer backwards compat (#21935)

Browse source
This commit is contained in:
Pavel Feldman 2023-03-23 12:49:53 -07:00 committed by GitHub
parent f5bd236c7b
commit 6b83631f24
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 16 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
packages/trace-viewer/public/watch.webmanifest
View file

@ -4,7 +4,7 @@
"display": "browser", "display": "browser",
"start_url": "watch.html", "start_url": "watch.html",
"name": "Playwright Test", "name": "Playwright Test",
"short_name": "Trace Viewer", "short_name": "Playwright Test",
"icons": [ "icons": [
{ {
"src": "icon-192x192.png", "src": "icon-192x192.png",

1
packages/trace-viewer/src/snapshotRenderer.ts
View file

@ -104,6 +104,7 @@ export class SnapshotRenderer {
const prefix = snapshot.doctype ? `<!DOCTYPE ${snapshot.doctype}>` : ''; const prefix = snapshot.doctype ? `<!DOCTYPE ${snapshot.doctype}>` : '';
html = prefix + [ html = prefix + [
'<style>*,*::before,*::after { visibility: hidden }</style>', '<style>*,*::before,*::after { visibility: hidden }</style>',
`<style>*[__playwright_target__="${this.snapshotName}"] { outline: 2px solid #006ab1 !important; background-color: #6fa8dc7f !important; }</style>`,
`<style>*[__playwright_target__="${this._callId}"] { outline: 2px solid #006ab1 !important; background-color: #6fa8dc7f !important; }</style>`, `<style>*[__playwright_target__="${this._callId}"] { outline: 2px solid #006ab1 !important; background-color: #6fa8dc7f !important; }</style>`,
`<script>${snapshotScript()}</script>` `<script>${snapshotScript()}</script>`
].join('') + html; ].join('') + html;

5
packages/trace-viewer/src/sw.ts
View file

@ -44,9 +44,10 @@ async function loadTrace(traceUrl: string, traceFileName: string | null, clientI
} catch (error: any) { } catch (error: any) {
if (error?.message?.includes('Cannot find .trace file') && await traceModel.hasEntry('index.html')) if (error?.message?.includes('Cannot find .trace file') && await traceModel.hasEntry('index.html'))
throw new Error('Could not load trace. Did you upload a Playwright HTML report instead? Make sure to extract the archive first and then double-click the index.html file or put it on a web server.'); throw new Error('Could not load trace. Did you upload a Playwright HTML report instead? Make sure to extract the archive first and then double-click the index.html file or put it on a web server.');
else if (traceFileName) // eslint-disable-next-line no-console
console.error(error);
if (traceFileName)
throw new Error(`Could not load trace from ${traceFileName}. Make sure to upload a valid Playwright trace.`); throw new Error(`Could not load trace from ${traceFileName}. Make sure to upload a valid Playwright trace.`);
else
throw new Error(`Could not load trace from ${traceUrl}. Make sure a valid Playwright Trace is accessible over this url.`); throw new Error(`Could not load trace from ${traceUrl}. Make sure a valid Playwright Trace is accessible over this url.`);
} }
const snapshotServer = new SnapshotServer(traceModel.storage(), sha1 => traceModel.resourceForSha1(sha1)); const snapshotServer = new SnapshotServer(traceModel.storage(), sha1 => traceModel.resourceForSha1(sha1));

6
packages/trace-viewer/src/traceModel.ts
View file

@ -279,9 +279,9 @@ export class TraceModel {
params: metadata.params, params: metadata.params,
wallTime: metadata.wallTime || Date.now(), wallTime: metadata.wallTime || Date.now(),
log: metadata.log, log: metadata.log,
beforeSnapshot: metadata.snapshots.find(s => s.snapshotName === 'before')?.snapshotName, beforeSnapshot: metadata.snapshots.find(s => s.title === 'before')?.snapshotName,
inputSnapshot: metadata.snapshots.find(s => s.snapshotName === 'input')?.snapshotName, inputSnapshot: metadata.snapshots.find(s => s.title === 'input')?.snapshotName,
afterSnapshot: metadata.snapshots.find(s => s.snapshotName === 'after')?.snapshotName, afterSnapshot: metadata.snapshots.find(s => s.title === 'after')?.snapshotName,
error: metadata.error?.error, error: metadata.error?.error,
result: metadata.result, result: metadata.result,
point: metadata.point, point: metadata.point,

BIN
tests/assets/trace-1.31.zip Normal file
View file

Binary file not shown.

2
tests/library/snapshotter.spec.ts
View file

@ -41,7 +41,7 @@ it.describe('snapshots', () => {
await snapshotter.reset(); await snapshotter.reset();
const snapshot2 = await snapshotter.captureSnapshot(toImpl(page), 'call@2', 'snapshot@call@2'); const snapshot2 = await snapshotter.captureSnapshot(toImpl(page), 'call@2', 'snapshot@call@2');
const html2 = snapshot2.render().html; const html2 = snapshot2.render().html;
expect(html2.replace(`"call@2"`, `"call@1"`)).toEqual(html1); expect(html2.replace(/call@2/g, `call@1`)).toEqual(html1);
}); });
it('should capture resources', async ({ page, toImpl, server, snapshotter }) => { it('should capture resources', async ({ page, toImpl, server, snapshotter }) => {

6
tests/library/trace-viewer.spec.ts
View file

@ -800,3 +800,9 @@ test('should update highlight when typing', async ({ page, runAndTrace, server }
await traceViewer.page.keyboard.type('button'); await traceViewer.page.keyboard.type('button');
await expect(snapshot.locator('x-pw-glass')).toBeVisible(); await expect(snapshot.locator('x-pw-glass')).toBeVisible();
}); });
test('should open trace-1.31', async ({ showTraceViewer }) => {
const traceViewer = await showTraceViewer([path.join(__dirname, '../assets/trace-1.31.zip')]);
const snapshot = await traceViewer.snapshotFrame('locator.click');
await expect(snapshot.locator('[__playwright_target__]')).toHaveText(['Submit']);
});