diff --git a/packages/playwright-core/src/server/trace/viewer/traceViewer.ts b/packages/playwright-core/src/server/trace/viewer/traceViewer.ts
index 094a55e780..4f48b0dc9c 100644
--- a/packages/playwright-core/src/server/trace/viewer/traceViewer.ts
+++ b/packages/playwright-core/src/server/trace/viewer/traceViewer.ts
@@ -77,6 +77,6 @@ export async function showTraceViewer(traceUrl: string, browserName: string, hea
   else
     page.on('close', () => process.exit());
 
-  await page.mainFrame().goto(internalCallMetadata(), urlPrefix + `/trace/index.html?trace=${traceUrl}`);
+  await page.mainFrame().goto(internalCallMetadata(), urlPrefix + `/trace/index.html${traceUrl ? '?trace=' + traceUrl : ''}`);
   return context;
 }
diff --git a/packages/playwright-core/src/web/traceViewer/ui/workbench.tsx b/packages/playwright-core/src/web/traceViewer/ui/workbench.tsx
index e693f43ed9..744f8fcf19 100644
--- a/packages/playwright-core/src/web/traceViewer/ui/workbench.tsx
+++ b/packages/playwright-core/src/web/traceViewer/ui/workbench.tsx
@@ -62,8 +62,14 @@ export const Workbench: React.FunctionComponent<{
     onDragOver={event => { event.preventDefault(); }}
     onDrop={event => {
       event.preventDefault();
-      const url = URL.createObjectURL(event.dataTransfer.files[0]);
-      setTraceURL(url.toString());
+      const blobTraceURL = URL.createObjectURL(event.dataTransfer.files[0]);
+      const url = new URL(window.location.href);
+      url.searchParams.set('trace', blobTraceURL);
+      const href = url.toString();
+      // Snapshot loaders will inherit the trace url from the query parameters,
+      // so set it here.
+      window.history.pushState({}, '', href);
+      setTraceURL(blobTraceURL);
     }}>
     <div className='hbox header'>
       <div className='logo'>🎭</div>