@checkly/playwright-core 1.41.26 → 1.42.12

package/lib/vite/traceViewer/codeMirrorModule.svF_VrcJ.css

@@ -0,0 +1,344 @@
+/* BASICS */
+
+.CodeMirror {
+  /* Set height, width, borders, and global font properties here */
+  font-family: monospace;
+  height: 300px;
+  color: black;
+  direction: ltr;
+}
+
+/* PADDING */
+
+.CodeMirror-lines {
+  padding: 4px 0; /* Vertical padding around content */
+}
+.CodeMirror pre.CodeMirror-line,
+.CodeMirror pre.CodeMirror-line-like {
+  padding: 0 4px; /* Horizontal padding of content */
+}
+
+.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
+  background-color: white; /* The little square between H and V scrollbars */
+}
+
+/* GUTTER */
+
+.CodeMirror-gutters {
+  border-right: 1px solid #ddd;
+  background-color: #f7f7f7;
+  white-space: nowrap;
+}
+.CodeMirror-linenumbers {}
+.CodeMirror-linenumber {
+  padding: 0 3px 0 5px;
+  min-width: 20px;
+  text-align: right;
+  color: #999;
+  white-space: nowrap;
+}
+
+.CodeMirror-guttermarker { color: black; }
+.CodeMirror-guttermarker-subtle { color: #999; }
+
+/* CURSOR */
+
+.CodeMirror-cursor {
+  border-left: 1px solid black;
+  border-right: none;
+  width: 0;
+}
+/* Shown when moving in bi-directional text */
+.CodeMirror div.CodeMirror-secondarycursor {
+  border-left: 1px solid silver;
+}
+.cm-fat-cursor .CodeMirror-cursor {
+  width: auto;
+  border: 0 !important;
+  background: #7e7;
+}
+.cm-fat-cursor div.CodeMirror-cursors {
+  z-index: 1;
+}
+.cm-fat-cursor .CodeMirror-line::selection,
+.cm-fat-cursor .CodeMirror-line > span::selection, 
+.cm-fat-cursor .CodeMirror-line > span > span::selection { background: transparent; }
+.cm-fat-cursor .CodeMirror-line::-moz-selection,
+.cm-fat-cursor .CodeMirror-line > span::-moz-selection,
+.cm-fat-cursor .CodeMirror-line > span > span::-moz-selection { background: transparent; }
+.cm-fat-cursor { caret-color: transparent; }
+@-moz-keyframes blink {
+  0% {}
+  50% { background-color: transparent; }
+  100% {}
+}
+@-webkit-keyframes blink {
+  0% {}
+  50% { background-color: transparent; }
+  100% {}
+}
+@keyframes blink {
+  0% {}
+  50% { background-color: transparent; }
+  100% {}
+}
+
+/* Can style cursor different in overwrite (non-insert) mode */
+.CodeMirror-overwrite .CodeMirror-cursor {}
+
+.cm-tab { display: inline-block; text-decoration: inherit; }
+
+.CodeMirror-rulers {
+  position: absolute;
+  left: 0; right: 0; top: -50px; bottom: 0;
+  overflow: hidden;
+}
+.CodeMirror-ruler {
+  border-left: 1px solid #ccc;
+  top: 0; bottom: 0;
+  position: absolute;
+}
+
+/* DEFAULT THEME */
+
+.cm-s-default .cm-header {color: blue;}
+.cm-s-default .cm-quote {color: #090;}
+.cm-negative {color: #d44;}
+.cm-positive {color: #292;}
+.cm-header, .cm-strong {font-weight: bold;}
+.cm-em {font-style: italic;}
+.cm-link {text-decoration: underline;}
+.cm-strikethrough {text-decoration: line-through;}
+
+.cm-s-default .cm-keyword {color: #708;}
+.cm-s-default .cm-atom {color: #219;}
+.cm-s-default .cm-number {color: #164;}
+.cm-s-default .cm-def {color: #00f;}
+.cm-s-default .cm-variable,
+.cm-s-default .cm-punctuation,
+.cm-s-default .cm-property,
+.cm-s-default .cm-operator {}
+.cm-s-default .cm-variable-2 {color: #05a;}
+.cm-s-default .cm-variable-3, .cm-s-default .cm-type {color: #085;}
+.cm-s-default .cm-comment {color: #a50;}
+.cm-s-default .cm-string {color: #a11;}
+.cm-s-default .cm-string-2 {color: #f50;}
+.cm-s-default .cm-meta {color: #555;}
+.cm-s-default .cm-qualifier {color: #555;}
+.cm-s-default .cm-builtin {color: #30a;}
+.cm-s-default .cm-bracket {color: #997;}
+.cm-s-default .cm-tag {color: #170;}
+.cm-s-default .cm-attribute {color: #00c;}
+.cm-s-default .cm-hr {color: #999;}
+.cm-s-default .cm-link {color: #00c;}
+
+.cm-s-default .cm-error {color: #f00;}
+.cm-invalidchar {color: #f00;}
+
+.CodeMirror-composing { border-bottom: 2px solid; }
+
+/* Default styles for common addons */
+
+div.CodeMirror span.CodeMirror-matchingbracket {color: #0b0;}
+div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #a22;}
+.CodeMirror-matchingtag { background: rgba(255, 150, 0, .3); }
+.CodeMirror-activeline-background {background: #e8f2ff;}
+
+/* STOP */
+
+/* The rest of this file contains styles related to the mechanics of
+   the editor. You probably shouldn't touch them. */
+
+.CodeMirror {
+  position: relative;
+  overflow: hidden;
+  background: white;
+}
+
+.CodeMirror-scroll {
+  overflow: scroll !important; /* Things will break if this is overridden */
+  /* 50px is the magic margin used to hide the element's real scrollbars */
+  /* See overflow: hidden in .CodeMirror */
+  margin-bottom: -50px; margin-right: -50px;
+  padding-bottom: 50px;
+  height: 100%;
+  outline: none; /* Prevent dragging from highlighting the element */
+  position: relative;
+  z-index: 0;
+}
+.CodeMirror-sizer {
+  position: relative;
+  border-right: 50px solid transparent;
+}
+
+/* The fake, visible scrollbars. Used to force redraw during scrolling
+   before actual scrolling happens, thus preventing shaking and
+   flickering artifacts. */
+.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
+  position: absolute;
+  z-index: 6;
+  display: none;
+  outline: none;
+}
+.CodeMirror-vscrollbar {
+  right: 0; top: 0;
+  overflow-x: hidden;
+  overflow-y: scroll;
+}
+.CodeMirror-hscrollbar {
+  bottom: 0; left: 0;
+  overflow-y: hidden;
+  overflow-x: scroll;
+}
+.CodeMirror-scrollbar-filler {
+  right: 0; bottom: 0;
+}
+.CodeMirror-gutter-filler {
+  left: 0; bottom: 0;
+}
+
+.CodeMirror-gutters {
+  position: absolute; left: 0; top: 0;
+  min-height: 100%;
+  z-index: 3;
+}
+.CodeMirror-gutter {
+  white-space: normal;
+  height: 100%;
+  display: inline-block;
+  vertical-align: top;
+  margin-bottom: -50px;
+}
+.CodeMirror-gutter-wrapper {
+  position: absolute;
+  z-index: 4;
+  background: none !important;
+  border: none !important;
+}
+.CodeMirror-gutter-background {
+  position: absolute;
+  top: 0; bottom: 0;
+  z-index: 4;
+}
+.CodeMirror-gutter-elt {
+  position: absolute;
+  cursor: default;
+  z-index: 4;
+}
+.CodeMirror-gutter-wrapper ::selection { background-color: transparent }
+.CodeMirror-gutter-wrapper ::-moz-selection { background-color: transparent }
+
+.CodeMirror-lines {
+  cursor: text;
+  min-height: 1px; /* prevents collapsing before first draw */
+}
+.CodeMirror pre.CodeMirror-line,
+.CodeMirror pre.CodeMirror-line-like {
+  /* Reset some styles that the rest of the page might have set */
+  -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;
+  border-width: 0;
+  background: transparent;
+  font-family: inherit;
+  font-size: inherit;
+  margin: 0;
+  white-space: pre;
+  word-wrap: normal;
+  line-height: inherit;
+  color: inherit;
+  z-index: 2;
+  position: relative;
+  overflow: visible;
+  -webkit-tap-highlight-color: transparent;
+  -webkit-font-variant-ligatures: contextual;
+  font-variant-ligatures: contextual;
+}
+.CodeMirror-wrap pre.CodeMirror-line,
+.CodeMirror-wrap pre.CodeMirror-line-like {
+  word-wrap: break-word;
+  white-space: pre-wrap;
+  word-break: normal;
+}
+
+.CodeMirror-linebackground {
+  position: absolute;
+  left: 0; right: 0; top: 0; bottom: 0;
+  z-index: 0;
+}
+
+.CodeMirror-linewidget {
+  position: relative;
+  z-index: 2;
+  padding: 0.1px; /* Force widget margins to stay inside of the container */
+}
+
+.CodeMirror-widget {}
+
+.CodeMirror-rtl pre { direction: rtl; }
+
+.CodeMirror-code {
+  outline: none;
+}
+
+/* Force content-box sizing for the elements where we expect it */
+.CodeMirror-scroll,
+.CodeMirror-sizer,
+.CodeMirror-gutter,
+.CodeMirror-gutters,
+.CodeMirror-linenumber {
+  -moz-box-sizing: content-box;
+  box-sizing: content-box;
+}
+
+.CodeMirror-measure {
+  position: absolute;
+  width: 100%;
+  height: 0;
+  overflow: hidden;
+  visibility: hidden;
+}
+
+.CodeMirror-cursor {
+  position: absolute;
+  pointer-events: none;
+}
+.CodeMirror-measure pre { position: static; }
+
+div.CodeMirror-cursors {
+  visibility: hidden;
+  position: relative;
+  z-index: 3;
+}
+div.CodeMirror-dragcursors {
+  visibility: visible;
+}
+
+.CodeMirror-focused div.CodeMirror-cursors {
+  visibility: visible;
+}
+
+.CodeMirror-selected { background: #d9d9d9; }
+.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
+.CodeMirror-crosshair { cursor: crosshair; }
+.CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection { background: #d7d4f0; }
+.CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection { background: #d7d4f0; }
+
+.cm-searching {
+  background-color: #ffa;
+  background-color: rgba(255, 255, 0, .4);
+}
+
+/* Used to force a border model for a node */
+.cm-force-border { padding-right: .1px; }
+
+@media print {
+  /* Hide the cursor when printing */
+  .CodeMirror div.CodeMirror-cursors {
+    visibility: hidden;
+  }
+}
+
+/* See issue #2901 */
+.cm-tab-wrap-hack:after { content: ''; }
+
+/* Help users use markselection to safely style text background */
+span.CodeMirror-selectedtext { background: none; }

package/lib/vite/traceViewer/{index.LR1HufLs.js → index.-_8-eHEE.js}

@@ -1,2 +1,2 @@
-import{M as b,r as a,c as U,j as e,T as D,t as R,W as M,a as C,b as F}from"./assets/wsPort-qI0zJPR7.js";const O=()=>{const[l,k]=a.useState(!1),[c,d]=a.useState([]),[u,E]=a.useState([]),[p,j]=a.useState(N),[v,m]=a.useState({done:0,total:0}),[T,h]=a.useState(!1),[y,f]=a.useState(null),[w,L]=a.useState(null),g=a.useCallback(r=>{const o=[],t=[],s=new URL(window.location.href);for(let i=0;i<r.length;i++){const n=r.item(i);if(!n)continue;const S=URL.createObjectURL(n);o.push(S),t.push(n.name),s.searchParams.append("trace",S),s.searchParams.append("traceFileName",n.name)}const x=s.toString();window.history.pushState({},"",x),d(o),E(t),h(!1),f(null)},[]),P=a.useCallback(r=>{r.preventDefault(),g(r.dataTransfer.files)},[g]),W=a.useCallback(r=>{r.preventDefault(),r.target.files&&g(r.target.files)},[g]);return a.useEffect(()=>{const r=new URL(window.location.href).searchParams,o=r.getAll("trace");k(r.has("isServer"));for(const t of o)if(t.startsWith("file:")){L(t||null);return}r.has("isServer")?U({onEvent(t,s){t==="loadTrace"&&(d(s.url?[s.url]:[]),h(!1),f(null))},onClose(){}}).then(t=>{t("ready")}):o.some(t=>t.startsWith("blob:"))||d(o)},[]),a.useEffect(()=>{(async()=>{if(c.length){const r=s=>{s.data.method==="progress"&&m(s.data.params)};navigator.serviceWorker.addEventListener("message",r),m({done:0,total:1});const o=[];for(let s=0;s<c.length;s++){const x=c[s],i=new URLSearchParams;i.set("trace",x),u.length&&i.set("traceFileName",u[s]);const n=await fetch(`contexts?${i.toString()}`);if(!n.ok){l||d([]),f((await n.json()).error);return}o.push(...await n.json())}navigator.serviceWorker.removeEventListener("message",r);const t=new b(o);m({done:0,total:0}),j(t)}else j(N)})()},[l,c,u]),e.jsxs("div",{className:"vbox workbench-loader",onDragOver:r=>{r.preventDefault(),h(!0)},children:[e.jsxs("div",{className:"hbox header",children:[e.jsx("div",{className:"logo",children:e.jsx("img",{src:"playwright-logo.svg",alt:"Playwright logo"})}),e.jsx("div",{className:"product",children:"Playwright"}),p.title&&e.jsx("div",{className:"title",children:p.title}),e.jsx("div",{className:"spacer"}),e.jsx(D,{icon:"color-mode",title:"Toggle color mode",toggled:!1,onClick:()=>R()})]}),e.jsx("div",{className:"progress",children:e.jsx("div",{className:"inner-progress",style:{width:v.total?100*v.done/v.total+"%":0}})}),e.jsx(M,{model:p}),w&&e.jsxs("div",{className:"drop-target",children:[e.jsx("div",{children:"Trace Viewer uses Service Workers to show traces. To view trace:"}),e.jsxs("div",{style:{paddingTop:20},children:[e.jsxs("div",{children:["1. Click ",e.jsx("a",{href:w,children:"here"})," to put your trace into the download shelf"]}),e.jsxs("div",{children:["2. Go to ",e.jsx("a",{href:"https://trace.playwright.dev",children:"trace.playwright.dev"})]}),e.jsx("div",{children:"3. Drop the trace from the download shelf into the page"})]})]}),!l&&!T&&!w&&(!c.length||y)&&e.jsxs("div",{className:"drop-target",children:[e.jsx("div",{className:"processing-error",children:y}),e.jsx("div",{className:"title",children:"Drop Playwright Trace to load"}),e.jsx("div",{children:"or"}),e.jsx("button",{onClick:()=>{const r=document.createElement("input");r.type="file",r.multiple=!0,r.click(),r.addEventListener("change",o=>W(o))},children:"Select file(s)"}),e.jsx("div",{style:{maxWidth:400},children:"Playwright Trace Viewer is a Progressive Web App, it does not send your trace anywhere, it opens it locally."})]}),l&&!c.length&&e.jsx("div",{className:"drop-target",children:e.jsx("div",{className:"title",children:"Select test to see the trace"})}),T&&e.jsx("div",{className:"drop-target",onDragLeave:()=>{h(!1)},onDrop:r=>P(r),children:e.jsx("div",{className:"title",children:"Release to analyse the Playwright Trace"})})]})},N=new b([]);(async()=>{if(C(),window.location.protocol!=="file:"){if(window.location.href.includes("isUnderTest=true")&&await new Promise(l=>setTimeout(l,1e3)),!navigator.serviceWorker)throw new Error(`Service workers are not supported.
+import{M as b,r as a,c as U,j as e,T as D,t as R,W as M,a as C,b as F}from"./assets/wsPort-f2dAQL4I.js";const O=()=>{const[l,k]=a.useState(!1),[c,d]=a.useState([]),[u,E]=a.useState([]),[p,j]=a.useState(N),[v,m]=a.useState({done:0,total:0}),[T,h]=a.useState(!1),[y,f]=a.useState(null),[w,L]=a.useState(null),g=a.useCallback(r=>{const o=[],t=[],s=new URL(window.location.href);for(let i=0;i<r.length;i++){const n=r.item(i);if(!n)continue;const S=URL.createObjectURL(n);o.push(S),t.push(n.name),s.searchParams.append("trace",S),s.searchParams.append("traceFileName",n.name)}const x=s.toString();window.history.pushState({},"",x),d(o),E(t),h(!1),f(null)},[]),P=a.useCallback(r=>{r.preventDefault(),g(r.dataTransfer.files)},[g]),W=a.useCallback(r=>{r.preventDefault(),r.target.files&&g(r.target.files)},[g]);return a.useEffect(()=>{const r=new URL(window.location.href).searchParams,o=r.getAll("trace");k(r.has("isServer"));for(const t of o)if(t.startsWith("file:")){L(t||null);return}r.has("isServer")?U({onEvent(t,s){t==="loadTrace"&&(d(s.url?[s.url]:[]),h(!1),f(null))},onClose(){}}).then(t=>{t("ready")}):o.some(t=>t.startsWith("blob:"))||d(o)},[]),a.useEffect(()=>{(async()=>{if(c.length){const r=s=>{s.data.method==="progress"&&m(s.data.params)};navigator.serviceWorker.addEventListener("message",r),m({done:0,total:1});const o=[];for(let s=0;s<c.length;s++){const x=c[s],i=new URLSearchParams;i.set("trace",x),u.length&&i.set("traceFileName",u[s]);const n=await fetch(`contexts?${i.toString()}`);if(!n.ok){l||d([]),f((await n.json()).error);return}o.push(...await n.json())}navigator.serviceWorker.removeEventListener("message",r);const t=new b(o);m({done:0,total:0}),j(t)}else j(N)})()},[l,c,u]),e.jsxs("div",{className:"vbox workbench-loader",onDragOver:r=>{r.preventDefault(),h(!0)},children:[e.jsxs("div",{className:"hbox header",children:[e.jsx("div",{className:"logo",children:e.jsx("img",{src:"playwright-logo.svg",alt:"Playwright logo"})}),e.jsx("div",{className:"product",children:"Playwright"}),p.title&&e.jsx("div",{className:"title",children:p.title}),e.jsx("div",{className:"spacer"}),e.jsx(D,{icon:"color-mode",title:"Toggle color mode",toggled:!1,onClick:()=>R()})]}),e.jsx("div",{className:"progress",children:e.jsx("div",{className:"inner-progress",style:{width:v.total?100*v.done/v.total+"%":0}})}),e.jsx(M,{model:p}),w&&e.jsxs("div",{className:"drop-target",children:[e.jsx("div",{children:"Trace Viewer uses Service Workers to show traces. To view trace:"}),e.jsxs("div",{style:{paddingTop:20},children:[e.jsxs("div",{children:["1. Click ",e.jsx("a",{href:w,children:"here"})," to put your trace into the download shelf"]}),e.jsxs("div",{children:["2. Go to ",e.jsx("a",{href:"https://trace.playwright.dev",children:"trace.playwright.dev"})]}),e.jsx("div",{children:"3. Drop the trace from the download shelf into the page"})]})]}),!l&&!T&&!w&&(!c.length||y)&&e.jsxs("div",{className:"drop-target",children:[e.jsx("div",{className:"processing-error",children:y}),e.jsx("div",{className:"title",children:"Drop Playwright Trace to load"}),e.jsx("div",{children:"or"}),e.jsx("button",{onClick:()=>{const r=document.createElement("input");r.type="file",r.multiple=!0,r.click(),r.addEventListener("change",o=>W(o))},children:"Select file(s)"}),e.jsx("div",{style:{maxWidth:400},children:"Playwright Trace Viewer is a Progressive Web App, it does not send your trace anywhere, it opens it locally."})]}),l&&!c.length&&e.jsx("div",{className:"drop-target",children:e.jsx("div",{className:"title",children:"Select test to see the trace"})}),T&&e.jsx("div",{className:"drop-target",onDragLeave:()=>{h(!1)},onDrop:r=>P(r),children:e.jsx("div",{className:"title",children:"Release to analyse the Playwright Trace"})})]})},N=new b([]);(async()=>{if(C(),window.location.protocol!=="file:"){if(window.location.href.includes("isUnderTest=true")&&await new Promise(l=>setTimeout(l,1e3)),!navigator.serviceWorker)throw new Error(`Service workers are not supported.
 Make sure to serve the Trace Viewer (${window.location}) via HTTPS or localhost.`);navigator.serviceWorker.register("sw.bundle.js"),navigator.serviceWorker.controller||await new Promise(l=>{navigator.serviceWorker.oncontrollerchange=()=>l()}),setInterval(function(){fetch("ping")},1e4)}F.render(e.jsx(O,{}),document.querySelector("#root"))})();

package/lib/vite/traceViewer/index.5mge2rY_.css

@@ -0,0 +1,124 @@
+/*
+  Copyright (c) Microsoft Corporation.
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/
+
+.drop-target {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex: auto;
+  flex-direction: column;
+  background-color: var(--vscode-editor-background);
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 100;
+  line-height: 24px;
+}
+
+body .drop-target {
+  background: rgba(255, 255, 255, 0.8);
+}
+
+body.dark-mode .drop-target {
+  background: rgba(0, 0, 0, 0.8);
+}
+
+.drop-target .title {
+  font-size: 24px;
+  font-weight: bold;
+  margin-bottom: 30px;
+}
+
+.drop-target .processing-error {
+  font-size: 24px;
+  color: #e74c3c;
+  font-weight: bold;
+  text-align: center;
+  margin: 30px;
+}
+
+.drop-target input {
+  margin-top: 50px;
+}
+
+.drop-target button {
+  color: rgb(255, 255, 255);
+  background-color: rgb(0, 122, 204);
+  padding: 8px 12px;
+  border: none;
+  margin: 30px 0;
+  cursor: pointer;
+}
+
+.progress {
+  flex: none;
+  width: 100%;
+  height: 3px;
+  margin-top: -3px;
+  z-index: 10;
+}
+
+.inner-progress {
+  background-color: var(--vscode-progressBar-background);
+  height: 100%;
+}
+
+.header {
+  display: flex;
+  background-color: #000;
+  flex: none;
+  flex-basis: 48px;
+  line-height: 48px;
+  font-size: 16px;
+  color: #cccccc;
+}
+
+.workbench-loader {
+  contain: size;
+}
+
+.workbench-loader .header .toolbar-button {
+  margin: 12px;
+  padding: 8px 4px;
+}
+
+.workbench-loader .logo {
+  margin-left: 16px;
+  display: flex;
+  align-items: center;
+}
+
+.workbench-loader .logo img {
+  height: 32px;
+  width: 32px;
+  pointer-events: none;
+  flex: none;
+}
+
+.workbench-loader .product {
+  font-weight: 600;
+  margin-left: 16px;
+  flex: none;
+}
+
+.workbench-loader .header .title {
+  margin-left: 16px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  text-wrap: nowrap;
+}

package/lib/vite/traceViewer/index.6KJ-JQ0L.js

@@ -0,0 +1,180 @@
+import { M as MultiTraceModel, r as reactExports, c as connect, j as jsxRuntimeExports, T as ToolbarButton, t as toggleTheme, W as Workbench, a as applyTheme, b as reactDomExports } from "./assets/wsPort-EUvw-dwH.js";
+const WorkbenchLoader = () => {
+  const [isServer, setIsServer] = reactExports.useState(false);
+  const [traceURLs, setTraceURLs] = reactExports.useState([]);
+  const [uploadedTraceNames, setUploadedTraceNames] = reactExports.useState([]);
+  const [model, setModel] = reactExports.useState(emptyModel);
+  const [progress, setProgress] = reactExports.useState({ done: 0, total: 0 });
+  const [dragOver, setDragOver] = reactExports.useState(false);
+  const [processingErrorMessage, setProcessingErrorMessage] = reactExports.useState(null);
+  const [fileForLocalModeError, setFileForLocalModeError] = reactExports.useState(null);
+  const processTraceFiles = reactExports.useCallback((files) => {
+    const blobUrls = [];
+    const fileNames = [];
+    const url = new URL(window.location.href);
+    for (let i = 0; i < files.length; i++) {
+      const file = files.item(i);
+      if (!file)
+        continue;
+      const blobTraceURL = URL.createObjectURL(file);
+      blobUrls.push(blobTraceURL);
+      fileNames.push(file.name);
+      url.searchParams.append("trace", blobTraceURL);
+      url.searchParams.append("traceFileName", file.name);
+    }
+    const href = url.toString();
+    window.history.pushState({}, "", href);
+    setTraceURLs(blobUrls);
+    setUploadedTraceNames(fileNames);
+    setDragOver(false);
+    setProcessingErrorMessage(null);
+  }, []);
+  const handleDropEvent = reactExports.useCallback((event) => {
+    event.preventDefault();
+    processTraceFiles(event.dataTransfer.files);
+  }, [processTraceFiles]);
+  const handleFileInputChange = reactExports.useCallback((event) => {
+    event.preventDefault();
+    if (!event.target.files)
+      return;
+    processTraceFiles(event.target.files);
+  }, [processTraceFiles]);
+  reactExports.useEffect(() => {
+    const params = new URL(window.location.href).searchParams;
+    const newTraceURLs = params.getAll("trace");
+    setIsServer(params.has("isServer"));
+    for (const url of newTraceURLs) {
+      if (url.startsWith("file:")) {
+        setFileForLocalModeError(url || null);
+        return;
+      }
+    }
+    if (params.has("isServer")) {
+      connect({
+        onEvent(method, params2) {
+          if (method === "loadTrace") {
+            setTraceURLs(params2.url ? [params2.url] : []);
+            setDragOver(false);
+            setProcessingErrorMessage(null);
+          }
+        },
+        onClose() {
+        }
+      }).then((sendMessage) => {
+        sendMessage("ready");
+      });
+    } else if (!newTraceURLs.some((url) => url.startsWith("blob:"))) {
+      setTraceURLs(newTraceURLs);
+    }
+  }, []);
+  reactExports.useEffect(() => {
+    (async () => {
+      if (traceURLs.length) {
+        const swListener = (event) => {
+          if (event.data.method === "progress")
+            setProgress(event.data.params);
+        };
+        navigator.serviceWorker.addEventListener("message", swListener);
+        setProgress({ done: 0, total: 1 });
+        const contextEntries = [];
+        for (let i = 0; i < traceURLs.length; i++) {
+          const url = traceURLs[i];
+          const params = new URLSearchParams();
+          params.set("trace", url);
+          if (uploadedTraceNames.length)
+            params.set("traceFileName", uploadedTraceNames[i]);
+          const response = await fetch(`contexts?${params.toString()}`);
+          if (!response.ok) {
+            if (!isServer)
+              setTraceURLs([]);
+            setProcessingErrorMessage((await response.json()).error);
+            return;
+          }
+          contextEntries.push(...await response.json());
+        }
+        navigator.serviceWorker.removeEventListener("message", swListener);
+        const model2 = new MultiTraceModel(contextEntries);
+        setProgress({ done: 0, total: 0 });
+        setModel(model2);
+      } else {
+        setModel(emptyModel);
+      }
+    })();
+  }, [isServer, traceURLs, uploadedTraceNames]);
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "vbox workbench-loader", onDragOver: (event) => {
+    event.preventDefault();
+    setDragOver(true);
+  }, children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "hbox header", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "logo", children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: "playwright-logo.svg", alt: "Playwright logo" }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "product", children: "Playwright" }),
+      model.title && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "title", children: model.title }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "spacer" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(ToolbarButton, { icon: "color-mode", title: "Toggle color mode", toggled: false, onClick: () => toggleTheme() })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "progress", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "inner-progress", style: { width: progress.total ? 100 * progress.done / progress.total + "%" : 0 } }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(Workbench, { model }),
+    fileForLocalModeError && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "drop-target", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: "Trace Viewer uses Service Workers to show traces. To view trace:" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { paddingTop: 20 }, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+          "1. Click ",
+          /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: fileForLocalModeError, children: "here" }),
+          " to put your trace into the download shelf"
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+          "2. Go to ",
+          /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: "https://trace.playwright.dev", children: "trace.playwright.dev" })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: "3. Drop the trace from the download shelf into the page" })
+      ] })
+    ] }),
+    !isServer && !dragOver && !fileForLocalModeError && (!traceURLs.length || processingErrorMessage) && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "drop-target", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "processing-error", children: processingErrorMessage }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "title", children: "Drop Playwright Trace to load" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: "or" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("button", { onClick: () => {
+        const input = document.createElement("input");
+        input.type = "file";
+        input.multiple = true;
+        input.click();
+        input.addEventListener("change", (e) => handleFileInputChange(e));
+      }, children: "Select file(s)" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { maxWidth: 400 }, children: "Playwright Trace Viewer is a Progressive Web App, it does not send your trace anywhere, it opens it locally." })
+    ] }),
+    isServer && !traceURLs.length && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "drop-target", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "title", children: "Select test to see the trace" }) }),
+    dragOver && /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "div",
+      {
+        className: "drop-target",
+        onDragLeave: () => {
+          setDragOver(false);
+        },
+        onDrop: (event) => handleDropEvent(event),
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "title", children: "Release to analyse the Playwright Trace" })
+      }
+    )
+  ] });
+};
+const emptyModel = new MultiTraceModel([]);
+(async () => {
+  applyTheme();
+  if (window.location.protocol !== "file:") {
+    if (window.location.href.includes("isUnderTest=true"))
+      await new Promise((f) => setTimeout(f, 1e3));
+    if (!navigator.serviceWorker)
+      throw new Error(`Service workers are not supported.
+Make sure to serve the Trace Viewer (${window.location}) via HTTPS or localhost.`);
+    navigator.serviceWorker.register("sw.bundle.js");
+    if (!navigator.serviceWorker.controller) {
+      await new Promise((f) => {
+        navigator.serviceWorker.oncontrollerchange = () => f();
+      });
+    }
+    setInterval(function() {
+      fetch("ping");
+    }, 1e4);
+  }
+  reactDomExports.render(/* @__PURE__ */ jsxRuntimeExports.jsx(WorkbenchLoader, {}), document.querySelector("#root"));
+})();
+//# sourceMappingURL=index.6KJ-JQ0L.js.map