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

fix(trace-viewer): file path contains encoded characters (#23893)

Browse Source 
This fixes:

```
npx playwright show-trace %20I%20Love%20Node.zip
```

Extracted from https://github.com/microsoft/playwright/pull/23414.
This commit is contained in:
Max Schmitt 2023-06-26 18:13:40 +02:00 committed by GitHub
parent 6f67f6b52b
commit e1c220a37b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 9 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/playwright-core/src/server/trace/viewer/traceViewer.ts
View File

@ -93,7 +93,7 @@ async function startTraceViewerServer(traceUrls: string[], options?: Options): P
return server.serveFile(request, response, absolutePath); return server.serveFile(request, response, absolutePath);
}); });
const params = traceUrls.map(t => `trace=${t}`); const params = traceUrls.map(t => `trace=${encodeURIComponent(t)}`);
const transport = options?.transport || (options?.isServer ? new StdinServer() : undefined); const transport = options?.transport || (options?.isServer ? new StdinServer() : undefined);
if (transport) { if (transport) {

2
packages/trace-viewer/src/sw.ts
View File

@ -47,6 +47,8 @@ async function loadTrace(traceUrl: string, traceFileName: string | null, clientI
const backend = traceUrl.endsWith('json') ? new FetchTraceModelBackend(traceUrl) : new ZipTraceModelBackend(traceUrl, fetchProgress); const backend = traceUrl.endsWith('json') ? new FetchTraceModelBackend(traceUrl) : new ZipTraceModelBackend(traceUrl, fetchProgress);
await traceModel.load(backend, unzipProgress); await traceModel.load(backend, unzipProgress);
} catch (error: any) { } catch (error: any) {
// eslint-disable-next-line no-console
console.error(error);
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.');
if (traceFileName) if (traceFileName)

6
packages/trace-viewer/src/traceModelBackends.ts
View File

@ -86,7 +86,7 @@ export class FetchTraceModelBackend implements TraceModelBackend {
constructor(traceURL: string) { constructor(traceURL: string) {
this._traceURL = traceURL; this._traceURL = traceURL;
this._entriesPromise = fetch('/trace/file?path=' + encodeURI(traceURL)).then(async response => { this._entriesPromise = fetch('/trace/file?path=' + encodeURIComponent(traceURL)).then(async response => {
const json = JSON.parse(await response.text()); const json = JSON.parse(await response.text());
const entries = new Map<string, string>(); const entries = new Map<string, string>();
for (const entry of json.entries) for (const entry of json.entries)
@ -128,12 +128,12 @@ export class FetchTraceModelBackend implements TraceModelBackend {
const fileName = entries.get(entryName); const fileName = entries.get(entryName);
if (!fileName) if (!fileName)
return; return;
return fetch('/trace/file?path=' + encodeURI(fileName)); return fetch('/trace/file?path=' + encodeURIComponent(fileName));
} }
} }
function formatUrl(trace: string) { function formatUrl(trace: string) {
let url = trace.startsWith('http') || trace.startsWith('blob') ? trace : `file?path=${trace}`; let url = trace.startsWith('http') || trace.startsWith('blob') ? trace : `file?path=${encodeURIComponent(trace)}`;
// Dropbox does not support cors. // Dropbox does not support cors.
if (url.startsWith('https://www.dropbox.com/')) if (url.startsWith('https://www.dropbox.com/'))
url = 'https://dl.dropboxusercontent.com/' + url.substring('https://www.dropbox.com/'.length); url = 'https://dl.dropboxusercontent.com/' + url.substring('https://www.dropbox.com/'.length);

4
packages/trace-viewer/src/ui/attachmentsTab.tsx
View File

@ -66,6 +66,6 @@ function attachmentURL(traceUrl: string, attachment: {
body?: string; body?: string;
}) { }) {
if (attachment.sha1) if (attachment.sha1)
return 'sha1/' + attachment.sha1 + '?trace=' + traceUrl; return 'sha1/' + attachment.sha1 + '?trace=' + encodeURIComponent(traceUrl);
return 'file?path=' + attachment.path; return 'file?path=' + encodeURIComponent(attachment.path!);
} }

2
packages/trace-viewer/src/ui/sourceTab.tsx
View File

@ -66,7 +66,7 @@ export const SourceTab: React.FunctionComponent<{
try { try {
let response = await fetch(`sha1/src@${sha1}.txt`); let response = await fetch(`sha1/src@${sha1}.txt`);
if (response.status === 404) if (response.status === 404)
response = await fetch(`file?path=${file}`); response = await fetch(`file?path=${encodeURIComponent(file)}`);
source.content = await response.text(); source.content = await response.text();
} catch { } catch {
source.content = `<Unable to read "${file}">`; source.content = `<Unable to read "${file}">`;