@checkly/playwright-core 1.51.17-beta.1 → 1.54.2-beta.0

package/lib/vite/traceViewer/assets/workbench-CWZselvp.js

@@ -1,2470 +0,0 @@
-var __defProp = Object.defineProperty;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-import { r as reactExports, j as jsxRuntimeExports, f as clsx, k as scrollIntoViewIfNeeded, l as buildActionTree, n as stats, m as msToString, T as ToolbarButton, o as asLocator, P as PlaceholderPanel, C as CopyToClipboard, L as ListView, p as ansi2html, q as useCookies, u as useMeasure, v as ResizeView, w as kWebLinkRe, x as useFlash, y as lineHeight, z as CodeMirrorWrapper, A as useAsyncMemo, B as CopyToClipboardTextButton, D as upperBound, G as GlassPane, h as useSetting, E as useConsoleTabModel, F as useNetworkTabModel, S as SplitView, H as TabbedPane, I as SnapshotTabsView, J as InspectorTab, K as ConsoleTab, N as NetworkTab, O as SourceTab } from "./inspectorTab-CwgfffWb.js";
-const scrollPositions = /* @__PURE__ */ new Map();
-function TreeView({
-  name,
-  rootItem,
-  render,
-  title,
-  icon,
-  isError,
-  isVisible,
-  selectedItem,
-  onAccepted,
-  onSelected,
-  onHighlighted,
-  treeState,
-  setTreeState,
-  noItemsMessage,
-  dataTestId,
-  autoExpandDepth
-}) {
-  const treeItems = reactExports.useMemo(() => {
-    return indexTree(rootItem, selectedItem, treeState.expandedItems, autoExpandDepth || 0, isVisible);
-  }, [rootItem, selectedItem, treeState, autoExpandDepth, isVisible]);
-  const itemListRef = reactExports.useRef(null);
-  const [highlightedItem, setHighlightedItem] = reactExports.useState();
-  const [isKeyboardNavigation, setIsKeyboardNavigation] = reactExports.useState(false);
-  reactExports.useEffect(() => {
-    onHighlighted == null ? void 0 : onHighlighted(highlightedItem);
-  }, [onHighlighted, highlightedItem]);
-  reactExports.useEffect(() => {
-    const treeElem = itemListRef.current;
-    if (!treeElem)
-      return;
-    const saveScrollPosition = () => {
-      scrollPositions.set(name, treeElem.scrollTop);
-    };
-    treeElem.addEventListener("scroll", saveScrollPosition, { passive: true });
-    return () => treeElem.removeEventListener("scroll", saveScrollPosition);
-  }, [name]);
-  reactExports.useEffect(() => {
-    if (itemListRef.current)
-      itemListRef.current.scrollTop = scrollPositions.get(name) || 0;
-  }, [name]);
-  const toggleExpanded = reactExports.useCallback((item) => {
-    const { expanded } = treeItems.get(item);
-    if (expanded) {
-      for (let i2 = selectedItem; i2; i2 = i2.parent) {
-        if (i2 === item) {
-          onSelected == null ? void 0 : onSelected(item);
-          break;
-        }
-      }
-      treeState.expandedItems.set(item.id, false);
-    } else {
-      treeState.expandedItems.set(item.id, true);
-    }
-    setTreeState({ ...treeState });
-  }, [treeItems, selectedItem, onSelected, treeState, setTreeState]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: clsx(`tree-view vbox`, name + "-tree-view"), role: "tree", "data-testid": dataTestId || name + "-tree", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    "div",
-    {
-      className: clsx("tree-view-content"),
-      tabIndex: 0,
-      onKeyDown: (event) => {
-        if (selectedItem && event.key === "Enter") {
-          onAccepted == null ? void 0 : onAccepted(selectedItem);
-          return;
-        }
-        if (event.key !== "ArrowDown" && event.key !== "ArrowUp" && event.key !== "ArrowLeft" && event.key !== "ArrowRight")
-          return;
-        event.stopPropagation();
-        event.preventDefault();
-        if (selectedItem && event.key === "ArrowLeft") {
-          const { expanded, parent } = treeItems.get(selectedItem);
-          if (expanded) {
-            treeState.expandedItems.set(selectedItem.id, false);
-            setTreeState({ ...treeState });
-          } else if (parent) {
-            onSelected == null ? void 0 : onSelected(parent);
-          }
-          return;
-        }
-        if (selectedItem && event.key === "ArrowRight") {
-          if (selectedItem.children.length) {
-            treeState.expandedItems.set(selectedItem.id, true);
-            setTreeState({ ...treeState });
-          }
-          return;
-        }
-        let newSelectedItem = selectedItem;
-        if (event.key === "ArrowDown") {
-          if (selectedItem) {
-            const itemData = treeItems.get(selectedItem);
-            newSelectedItem = itemData.next;
-          } else if (treeItems.size) {
-            const itemList = [...treeItems.keys()];
-            newSelectedItem = itemList[0];
-          }
-        }
-        if (event.key === "ArrowUp") {
-          if (selectedItem) {
-            const itemData = treeItems.get(selectedItem);
-            newSelectedItem = itemData.prev;
-          } else if (treeItems.size) {
-            const itemList = [...treeItems.keys()];
-            newSelectedItem = itemList[itemList.length - 1];
-          }
-        }
-        onHighlighted == null ? void 0 : onHighlighted(void 0);
-        if (newSelectedItem) {
-          setIsKeyboardNavigation(true);
-          onSelected == null ? void 0 : onSelected(newSelectedItem);
-        }
-        setHighlightedItem(void 0);
-      },
-      ref: itemListRef,
-      children: [
-        noItemsMessage && treeItems.size === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "tree-view-empty", children: noItemsMessage }),
-        rootItem.children.map((child) => {
-          const itemData = treeItems.get(child);
-          return itemData && /* @__PURE__ */ jsxRuntimeExports.jsx(
-            TreeItemHeader,
-            {
-              item: child,
-              treeItems,
-              selectedItem,
-              onSelected,
-              onAccepted,
-              isError,
-              toggleExpanded,
-              highlightedItem,
-              setHighlightedItem,
-              render,
-              icon,
-              title,
-              isKeyboardNavigation,
-              setIsKeyboardNavigation
-            },
-            child.id
-          );
-        })
-      ]
-    }
-  ) });
-}
-function TreeItemHeader({
-  item,
-  treeItems,
-  selectedItem,
-  onSelected,
-  highlightedItem,
-  setHighlightedItem,
-  isError,
-  onAccepted,
-  toggleExpanded,
-  render,
-  title,
-  icon,
-  isKeyboardNavigation,
-  setIsKeyboardNavigation
-}) {
-  const groupId = reactExports.useId();
-  const itemRef = reactExports.useRef(null);
-  reactExports.useEffect(() => {
-    if (selectedItem === item && isKeyboardNavigation && itemRef.current) {
-      scrollIntoViewIfNeeded(itemRef.current);
-      setIsKeyboardNavigation(false);
-    }
-  }, [item, selectedItem, isKeyboardNavigation, setIsKeyboardNavigation]);
-  const itemData = treeItems.get(item);
-  const indentation = itemData.depth;
-  const expanded = itemData.expanded;
-  let expandIcon = "codicon-blank";
-  if (typeof expanded === "boolean")
-    expandIcon = expanded ? "codicon-chevron-down" : "codicon-chevron-right";
-  const rendered = render(item);
-  const children = expanded && item.children.length ? item.children : [];
-  const titled = title == null ? void 0 : title(item);
-  const iconed = (icon == null ? void 0 : icon(item)) || "codicon-blank";
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: itemRef, role: "treeitem", "aria-selected": item === selectedItem, "aria-expanded": expanded, "aria-controls": groupId, title: titled, className: "vbox", style: { flex: "none" }, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      "div",
-      {
-        onDoubleClick: () => onAccepted == null ? void 0 : onAccepted(item),
-        className: clsx(
-          "tree-view-entry",
-          selectedItem === item && "selected",
-          highlightedItem === item && "highlighted",
-          (isError == null ? void 0 : isError(item)) && "error"
-        ),
-        onClick: () => onSelected == null ? void 0 : onSelected(item),
-        onMouseEnter: () => setHighlightedItem(item),
-        onMouseLeave: () => setHighlightedItem(void 0),
-        children: [
-          indentation ? new Array(indentation).fill(0).map((_2, i2) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "tree-view-indent" }, "indent-" + i2)) : void 0,
-          /* @__PURE__ */ jsxRuntimeExports.jsx(
-            "div",
-            {
-              "aria-hidden": "true",
-              className: "codicon " + expandIcon,
-              style: { minWidth: 16, marginRight: 4 },
-              onDoubleClick: (e) => {
-                e.preventDefault();
-                e.stopPropagation();
-              },
-              onClick: (e) => {
-                e.stopPropagation();
-                e.preventDefault();
-                toggleExpanded(item);
-              }
-            }
-          ),
-          icon && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "codicon " + iconed, style: { minWidth: 16, marginRight: 4 }, "aria-label": "[" + iconed.replace("codicon", "icon") + "]" }),
-          typeof rendered === "string" ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { textOverflow: "ellipsis", overflow: "hidden" }, children: rendered }) : rendered
-        ]
-      }
-    ),
-    !!children.length && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { id: groupId, role: "group", children: children.map((child) => {
-      const itemData2 = treeItems.get(child);
-      return itemData2 && /* @__PURE__ */ jsxRuntimeExports.jsx(
-        TreeItemHeader,
-        {
-          item: child,
-          treeItems,
-          selectedItem,
-          onSelected,
-          onAccepted,
-          isError,
-          toggleExpanded,
-          highlightedItem,
-          setHighlightedItem,
-          render,
-          title,
-          icon,
-          isKeyboardNavigation,
-          setIsKeyboardNavigation
-        },
-        child.id
-      );
-    }) })
-  ] });
-}
-function indexTree(rootItem, selectedItem, expandedItems, autoExpandDepth, isVisible = () => true) {
-  if (!isVisible(rootItem))
-    return /* @__PURE__ */ new Map();
-  const result = /* @__PURE__ */ new Map();
-  const temporaryExpanded = /* @__PURE__ */ new Set();
-  for (let item = selectedItem == null ? void 0 : selectedItem.parent; item; item = item.parent)
-    temporaryExpanded.add(item.id);
-  let lastItem = null;
-  const appendChildren = (parent, depth) => {
-    for (const item of parent.children) {
-      if (!isVisible(item))
-        continue;
-      const expandState = temporaryExpanded.has(item.id) || expandedItems.get(item.id);
-      const autoExpandMatches = autoExpandDepth > depth && result.size < 25 && expandState !== false;
-      const expanded = item.children.length ? expandState ?? autoExpandMatches : void 0;
-      const itemData = {
-        depth,
-        expanded,
-        parent: rootItem === parent ? null : parent,
-        next: null,
-        prev: lastItem
-      };
-      if (lastItem)
-        result.get(lastItem).next = item;
-      lastItem = item;
-      result.set(item, itemData);
-      if (expanded)
-        appendChildren(item, depth + 1);
-    }
-  };
-  appendChildren(rootItem, 0);
-  return result;
-}
-function testStatusIcon(status) {
-  if (status === "scheduled")
-    return "codicon-clock";
-  if (status === "running")
-    return "codicon-loading";
-  if (status === "failed")
-    return "codicon-error";
-  if (status === "passed")
-    return "codicon-check";
-  if (status === "skipped")
-    return "codicon-circle-slash";
-  return "codicon-circle-outline";
-}
-function testStatusText(status) {
-  if (status === "scheduled")
-    return "Pending";
-  if (status === "running")
-    return "Running";
-  if (status === "failed")
-    return "Failed";
-  if (status === "passed")
-    return "Passed";
-  if (status === "skipped")
-    return "Skipped";
-  return "Did not run";
-}
-const ActionTreeView = TreeView;
-const ActionList = ({
-  actions,
-  selectedAction,
-  selectedTime,
-  setSelectedTime,
-  sdkLanguage,
-  onSelected,
-  onHighlighted,
-  revealConsole,
-  revealAttachment,
-  isLive
-}) => {
-  const [treeState, setTreeState] = reactExports.useState({ expandedItems: /* @__PURE__ */ new Map() });
-  const { rootItem, itemMap } = reactExports.useMemo(() => buildActionTree(actions), [actions]);
-  const { selectedItem } = reactExports.useMemo(() => {
-    const selectedItem2 = selectedAction ? itemMap.get(selectedAction.callId) : void 0;
-    return { selectedItem: selectedItem2 };
-  }, [itemMap, selectedAction]);
-  const isError = reactExports.useCallback((item) => {
-    var _a, _b;
-    return !!((_b = (_a = item.action) == null ? void 0 : _a.error) == null ? void 0 : _b.message);
-  }, []);
-  const onAccepted = reactExports.useCallback((item) => {
-    return setSelectedTime({ minimum: item.action.startTime, maximum: item.action.endTime });
-  }, [setSelectedTime]);
-  const render = reactExports.useCallback((item) => {
-    return renderAction(item.action, { sdkLanguage, revealConsole, revealAttachment, isLive, showDuration: true, showBadges: true });
-  }, [isLive, revealConsole, revealAttachment, sdkLanguage]);
-  const isVisible = reactExports.useCallback((item) => {
-    return !selectedTime || !item.action || item.action.startTime <= selectedTime.maximum && item.action.endTime >= selectedTime.minimum;
-  }, [selectedTime]);
-  const onSelectedAction = reactExports.useCallback((item) => {
-    onSelected == null ? void 0 : onSelected(item.action);
-  }, [onSelected]);
-  const onHighlightedAction = reactExports.useCallback((item) => {
-    onHighlighted == null ? void 0 : onHighlighted(item == null ? void 0 : item.action);
-  }, [onHighlighted]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "vbox", children: [
-    selectedTime && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "action-list-show-all", onClick: () => setSelectedTime(void 0), children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "codicon codicon-triangle-left" }),
-      "Show all"
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(
-      ActionTreeView,
-      {
-        name: "actions",
-        rootItem,
-        treeState,
-        setTreeState,
-        selectedItem,
-        onSelected: onSelectedAction,
-        onHighlighted: onHighlightedAction,
-        onAccepted,
-        isError,
-        isVisible,
-        render
-      }
-    )
-  ] });
-};
-const renderAction = (action, options) => {
-  var _a, _b;
-  const { sdkLanguage, revealConsole, revealAttachment, isLive, showDuration, showBadges } = options;
-  const { errors, warnings } = stats(action);
-  const showAttachments = !!((_a = action.attachments) == null ? void 0 : _a.length) && !!revealAttachment;
-  const parameterString = actionParameterDisplayString(action, sdkLanguage || "javascript");
-  const isSkipped = action.class === "Test" && action.method === "step" && ((_b = action.annotations) == null ? void 0 : _b.some((a2) => a2.type === "skip"));
-  let time = "";
-  if (action.endTime)
-    time = msToString(action.endTime - action.startTime);
-  else if (action.error)
-    time = "Timed out";
-  else if (!isLive)
-    time = "-";
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "action-title", title: action.apiName, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: action.apiName }),
-      parameterString && (parameterString.type === "locator" ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "action-parameter action-locator-parameter", children: parameterString.value }),
-        parameterString.childDisplayString && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "action-parameter action-generic-parameter", children: parameterString.childDisplayString.value })
-      ] }) : /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "action-parameter action-generic-parameter", children: parameterString.value })),
-      action.method === "goto" && action.params.url && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "action-url", title: action.params.url, children: action.params.url }),
-      action.class === "APIRequestContext" && action.params.url && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "action-url", title: action.params.url, children: excludeOrigin(action.params.url) })
-    ] }),
-    (showDuration || showBadges || showAttachments || isSkipped) && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "spacer" }),
-    showAttachments && /* @__PURE__ */ jsxRuntimeExports.jsx(ToolbarButton, { icon: "attach", title: "Open Attachment", onClick: () => revealAttachment(action.attachments[0]) }),
-    showDuration && !isSkipped && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "action-duration", children: time || /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "codicon codicon-loading" }) }),
-    isSkipped && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: clsx("action-skipped", "codicon", testStatusIcon("skipped")), title: "skipped" }),
-    showBadges && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "action-icons", onClick: () => revealConsole == null ? void 0 : revealConsole(), children: [
-      !!errors && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "action-icon", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "codicon codicon-error" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "action-icon-value", children: errors })
-      ] }),
-      !!warnings && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "action-icon", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "codicon codicon-warning" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "action-icon-value", children: warnings })
-      ] })
-    ] })
-  ] });
-};
-function excludeOrigin(url) {
-  try {
-    const urlObject = new URL(url);
-    return urlObject.pathname + urlObject.search;
-  } catch (error) {
-    return url;
-  }
-}
-const clockDisplayString = (action) => {
-  switch (action.method) {
-    case "clockPauseAt":
-    case "clockSetFixedTime":
-    case "clockSetSystemTime": {
-      if (action.params.timeString === void 0 && action.params.timeNumber === void 0)
-        return void 0;
-      return {
-        type: "generic",
-        value: new Date(
-          action.params.timeString ?? action.params.timeNumber
-        ).toLocaleString(void 0, { timeZone: "UTC" })
-      };
-    }
-    case "clockFastForward":
-    case "clockRunFor": {
-      if (action.params.ticksNumber === void 0 && action.params.ticksString === void 0)
-        return void 0;
-      return {
-        type: "generic",
-        value: action.params.ticksString ?? `${action.params.ticksNumber}ms`
-      };
-    }
-  }
-  return void 0;
-};
-const keyboardDisplayString = (action) => {
-  switch (action.method) {
-    case "press":
-    case "keyboardPress":
-    case "keyboardDown":
-    case "keyboardUp": {
-      if (action.params.key === void 0)
-        return void 0;
-      return { type: "generic", value: action.params.key };
-    }
-    case "type":
-    case "fill":
-    case "keyboardType":
-    case "keyboardInsertText": {
-      const string = action.params.text ?? action.params.value;
-      if (string === void 0)
-        return void 0;
-      return { type: "generic", value: `"${string}"` };
-    }
-  }
-};
-const mouseDisplayString = (action) => {
-  switch (action.method) {
-    case "click":
-    case "dblclick":
-    case "mouseClick":
-    case "mouseMove": {
-      if (action.params.x === void 0 || action.params.y === void 0)
-        return void 0;
-      return {
-        type: "generic",
-        value: `(${action.params.x}, ${action.params.y})`
-      };
-    }
-    case "mouseWheel": {
-      if (action.params.deltaX === void 0 || action.params.deltaY === void 0)
-        return void 0;
-      return {
-        type: "generic",
-        value: `(${action.params.deltaX}, ${action.params.deltaY})`
-      };
-    }
-  }
-};
-const touchscreenDisplayString = (action) => {
-  switch (action.method) {
-    case "tap": {
-      if (action.params.x === void 0 || action.params.y === void 0)
-        return void 0;
-      return {
-        type: "generic",
-        value: `(${action.params.x}, ${action.params.y})`
-      };
-    }
-  }
-};
-const actionParameterDisplayString = (action, sdkLanguage, ignoreLocator = false) => {
-  const params = action.params;
-  if (!ignoreLocator && params.selector !== void 0) {
-    return {
-      type: "locator",
-      value: asLocator(sdkLanguage, params.selector),
-      childDisplayString: actionParameterDisplayString(
-        action,
-        sdkLanguage,
-        true
-      )
-    };
-  }
-  switch (action.class.toLowerCase()) {
-    case "browsercontext":
-      return clockDisplayString(action);
-    case "page":
-    case "frame":
-    case "elementhandle":
-      return keyboardDisplayString(action) ?? mouseDisplayString(action) ?? touchscreenDisplayString(action);
-  }
-  return void 0;
-};
-const CallTab = ({ action, startTimeOffset, sdkLanguage }) => {
-  const paramKeys = reactExports.useMemo(() => Object.keys((action == null ? void 0 : action.params) ?? {}).filter((name) => name !== "info"), [action]);
-  if (!action)
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(PlaceholderPanel, { text: "No action selected" });
-  const startTimeMillis = action.startTime - startTimeOffset;
-  const startTime = msToString(startTimeMillis);
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-tab", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "call-line", children: action.apiName }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "call-section", children: "Time" }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(DateTimeCallLine, { name: "start:", value: startTime }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(DateTimeCallLine, { name: "duration:", value: renderDuration(action) }),
-    !!paramKeys.length && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "call-section", children: "Parameters" }),
-      paramKeys.map((name) => renderProperty(propertyToString(action, name, action.params[name], sdkLanguage)))
-    ] }),
-    !!action.result && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "call-section", children: "Return value" }),
-      Object.keys(action.result).map(
-        (name) => renderProperty(propertyToString(action, name, action.result[name], sdkLanguage))
-      )
-    ] })
-  ] });
-};
-const DateTimeCallLine = ({ name, value }) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-  name,
-  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value datetime", title: value, children: value })
-] });
-function renderDuration(action) {
-  if (action.endTime)
-    return msToString(action.endTime - action.startTime);
-  else if (!!action.error)
-    return "Timed Out";
-  else
-    return "Running";
-}
-function renderProperty(property) {
-  let text = property.text.replace(/\n/g, "↵");
-  if (property.type === "string")
-    text = `"${text}"`;
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-    property.name,
-    ":",
-    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: clsx("call-value", property.type), title: property.text, children: text }),
-    ["string", "number", "object", "locator"].includes(property.type) && /* @__PURE__ */ jsxRuntimeExports.jsx(CopyToClipboard, { value: property.text })
-  ] }, property.name);
-}
-function propertyToString(event, name, value, sdkLanguage) {
-  const isEval = event.method.includes("eval") || event.method === "waitForFunction";
-  if (name === "files")
-    return { text: "<files>", type: "string", name };
-  if (name === "eventInit" || name === "expectedValue" || name === "arg" && isEval)
-    value = parseSerializedValue(value.value, new Array(10).fill({ handle: "<handle>" }));
-  if (name === "value" && isEval || name === "received" && event.method === "expect")
-    value = parseSerializedValue(value, new Array(10).fill({ handle: "<handle>" }));
-  if (name === "selector")
-    return { text: asLocator(sdkLanguage || "javascript", event.params.selector), type: "locator", name: "locator" };
-  const type = typeof value;
-  if (type !== "object" || value === null)
-    return { text: String(value), type, name };
-  if (value.guid)
-    return { text: "<handle>", type: "handle", name };
-  return { text: JSON.stringify(value).slice(0, 1e3), type: "object", name };
-}
-function parseSerializedValue(value, handles) {
-  if (value.n !== void 0)
-    return value.n;
-  if (value.s !== void 0)
-    return value.s;
-  if (value.b !== void 0)
-    return value.b;
-  if (value.v !== void 0) {
-    if (value.v === "undefined")
-      return void 0;
-    if (value.v === "null")
-      return null;
-    if (value.v === "NaN")
-      return NaN;
-    if (value.v === "Infinity")
-      return Infinity;
-    if (value.v === "-Infinity")
-      return -Infinity;
-    if (value.v === "-0")
-      return -0;
-  }
-  if (value.d !== void 0)
-    return new Date(value.d);
-  if (value.r !== void 0)
-    return new RegExp(value.r.p, value.r.f);
-  if (value.a !== void 0)
-    return value.a.map((a2) => parseSerializedValue(a2, handles));
-  if (value.o !== void 0) {
-    const result = {};
-    for (const { k: k2, v: v2 } of value.o)
-      result[k2] = parseSerializedValue(v2, handles);
-    return result;
-  }
-  if (value.h !== void 0) {
-    if (handles === void 0)
-      return "<object>";
-    return handles[value.h];
-  }
-  return "<object>";
-}
-const LogList = ListView;
-const LogTab = ({ action, isLive }) => {
-  const entries = reactExports.useMemo(() => {
-    var _a;
-    if (!action || !action.log.length)
-      return [];
-    const log = action.log;
-    const wallTimeOffset = action.context.wallTime - action.context.startTime;
-    const entries2 = [];
-    for (let i2 = 0; i2 < log.length; ++i2) {
-      let time = "";
-      if (log[i2].time !== -1) {
-        const timeStart = (_a = log[i2]) == null ? void 0 : _a.time;
-        if (i2 + 1 < log.length)
-          time = msToString(log[i2 + 1].time - timeStart);
-        else if (action.endTime > 0)
-          time = msToString(action.endTime - timeStart);
-        else if (isLive)
-          time = msToString(Date.now() - wallTimeOffset - timeStart);
-        else
-          time = "-";
-      }
-      entries2.push({
-        message: log[i2].message,
-        time
-      });
-    }
-    return entries2;
-  }, [action, isLive]);
-  if (!entries.length)
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(PlaceholderPanel, { text: "No log entries" });
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    LogList,
-    {
-      name: "log",
-      items: entries,
-      render: (entry) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "log-list-item", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "log-list-duration", children: entry.time }),
-        entry.message
-      ] }),
-      notSelectable: true
-    }
-  );
-};
-const ErrorMessage = ({ error }) => {
-  const html = reactExports.useMemo(() => ansi2html(error), [error]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "error-message", dangerouslySetInnerHTML: { __html: html || "" } });
-};
-function t() {
-  return t = Object.assign ? Object.assign.bind() : function(e) {
-    for (var t2 = 1; t2 < arguments.length; t2++) {
-      var n2 = arguments[t2];
-      for (var r2 in n2) Object.prototype.hasOwnProperty.call(n2, r2) && (e[r2] = n2[r2]);
-    }
-    return e;
-  }, t.apply(this, arguments);
-}
-const n = ["children", "options"], r = { blockQuote: "0", breakLine: "1", breakThematic: "2", codeBlock: "3", codeFenced: "4", codeInline: "5", footnote: "6", footnoteReference: "7", gfmTask: "8", heading: "9", headingSetext: "10", htmlBlock: "11", htmlComment: "12", htmlSelfClosing: "13", image: "14", link: "15", linkAngleBraceStyleDetector: "16", linkBareUrlDetector: "17", linkMailtoDetector: "18", newlineCoalescer: "19", orderedList: "20", paragraph: "21", ref: "22", refImage: "23", refLink: "24", table: "25", text: "27", textBolded: "28", textEmphasized: "29", textEscaped: "30", textMarked: "31", textStrikethroughed: "32", unorderedList: "33" };
-var i;
-!function(e) {
-  e[e.MAX = 0] = "MAX", e[e.HIGH = 1] = "HIGH", e[e.MED = 2] = "MED", e[e.LOW = 3] = "LOW", e[e.MIN = 4] = "MIN";
-}(i || (i = {}));
-const l = ["allowFullScreen", "allowTransparency", "autoComplete", "autoFocus", "autoPlay", "cellPadding", "cellSpacing", "charSet", "classId", "colSpan", "contentEditable", "contextMenu", "crossOrigin", "encType", "formAction", "formEncType", "formMethod", "formNoValidate", "formTarget", "frameBorder", "hrefLang", "inputMode", "keyParams", "keyType", "marginHeight", "marginWidth", "maxLength", "mediaGroup", "minLength", "noValidate", "radioGroup", "readOnly", "rowSpan", "spellCheck", "srcDoc", "srcLang", "srcSet", "tabIndex", "useMap"].reduce((e, t2) => (e[t2.toLowerCase()] = t2, e), { class: "className", for: "htmlFor" }), a = { amp: "&", apos: "'", gt: ">", lt: "<", nbsp: " ", quot: "“" }, o = ["style", "script"], c = /([-A-Z0-9_:]+)(?:\s*=\s*(?:(?:"((?:\\.|[^"])*)")|(?:'((?:\\.|[^'])*)')|(?:\{((?:\\.|{[^}]*?}|[^}])*)\})))?/gi, s = /mailto:/i, d = /\n{2,}$/, u = /^(\s*>[\s\S]*?)(?=\n\n|$)/, p = /^ *> ?/gm, f = /^(?:\[!([^\]]*)\]\n)?([\s\S]*)/, h = /^ {2,}\n/, m = /^(?:( *[-*_])){3,} *(?:\n *)+\n/, g = /^(?: {1,3})?(`{3,}|~{3,}) *(\S+)? *([^\n]*?)?\n([\s\S]*?)(?:\1\n?|$)/, y = /^(?: {4}[^\n]+\n*)+(?:\n *)+\n?/, k = /^(`+)((?:\\`|[^`])+)\1/, x = /^(?:\n *)*\n/, b = /\r\n?/g, v = /^\[\^([^\]]+)](:(.*)((\n+ {4,}.*)|(\n(?!\[\^).+))*)/, C = /^\[\^([^\]]+)]/, $ = /\f/g, S = /^---[ \t]*\n(.|\n)*\n---[ \t]*\n/, w = /^\s*?\[(x|\s)\]/, E = /^ *(#{1,6}) *([^\n]+?)(?: +#*)?(?:\n *)*(?:\n|$)/, z = /^ *(#{1,6}) +([^\n]+?)(?: +#*)?(?:\n *)*(?:\n|$)/, L = /^([^\n]+)\n *(=|-){3,} *(?:\n *)+\n/, A = /^ *(?!<[a-z][^ >/]* ?\/>)<([a-z][^ >/]*) ?((?:[^>]*[^/])?)>\n?(\s*(?:<\1[^>]*?>[\s\S]*?<\/\1>|(?!<\1\b)[\s\S])*?)<\/\1>(?!<\/\1>)\n*/i, T = /&([a-z0-9]+|#[0-9]{1,6}|#x[0-9a-fA-F]{1,6});/gi, B = /^<!--[\s\S]*?(?:-->)/, O = /^(data|aria|x)-[a-z_][a-z\d_.-]*$/, M = /^ *<([a-z][a-z0-9:]*)(?:\s+((?:<.*?>|[^>])*))?\/?>(?!<\/\1>)(\s*\n)?/i, R = /^\{.*\}$/, I = /^(https?:\/\/[^\s<]+[^<.,:;"')\]\s])/, U = /^<([^ >]+@[^ >]+)>/, D = /^<([^ >]+:\/[^ >]+)>/, N = /-([a-z])?/gi, j = /^(\|.*)\n(?: *(\|? *[-:]+ *\|[-| :]*)\n((?:.*\|.*\n)*))?\n?/, H = /^\[([^\]]*)\]:\s+<?([^\s>]+)>?\s*("([^"]*)")?/, P = /^!\[([^\]]*)\] ?\[([^\]]*)\]/, _ = /^\[([^\]]*)\] ?\[([^\]]*)\]/, F = /(\n|^[-*]\s|^#|^ {2,}|^-{2,}|^>\s)/, G = /\t/g, W = /(^ *\||\| *$)/g, Z = /^ *:-+: *$/, q = /^ *:-+ *$/, Q = /^ *-+: *$/, V = "((?:\\[.*?\\][([].*?[)\\]]|<.*?>(?:.*?<.*?>)?|`.*?`|\\\\\\1|[\\s\\S])+?)", X = new RegExp(`^([*_])\\1${V}\\1\\1(?!\\1)`), J = new RegExp(`^([*_])${V}\\1(?!\\1)`), K = new RegExp(`^(==)${V}\\1`), Y = new RegExp(`^(~~)${V}\\1`), ee = /^\\([^0-9A-Za-z\s])/, te = /\\([^0-9A-Za-z\s])/g, ne = /^([\s\S](?:(?!  |[0-9]\.)[^*_~\-\n<`\\\[!])*)/, re = /^\n+/, ie = /^([ \t]*)/, le = /\\([^\\])/g, ae = /(?:^|\n)( *)$/, oe = "(?:\\d+\\.)", ce = "(?:[*+-])";
-function se(e) {
-  return "( *)(" + (1 === e ? oe : ce) + ") +";
-}
-const de = se(1), ue = se(2);
-function pe(e) {
-  return new RegExp("^" + (1 === e ? de : ue));
-}
-const fe = pe(1), he = pe(2);
-function me(e) {
-  return new RegExp("^" + (1 === e ? de : ue) + "[^\\n]*(?:\\n(?!\\1" + (1 === e ? oe : ce) + " )[^\\n]*)*(\\n|$)", "gm");
-}
-const ge = me(1), ye = me(2);
-function ke(e) {
-  const t2 = 1 === e ? oe : ce;
-  return new RegExp("^( *)(" + t2 + ") [\\s\\S]+?(?:\\n{2,}(?! )(?!\\1" + t2 + " (?!" + t2 + " ))\\n*|\\s*\\n*$)");
-}
-const xe = ke(1), be = ke(2);
-function ve(e, t2) {
-  const n2 = 1 === t2, i2 = n2 ? xe : be, l2 = n2 ? ge : ye, a2 = n2 ? fe : he;
-  return { match: Oe(function(e2, t3) {
-    const n3 = ae.exec(t3.prevCapture);
-    return n3 && (t3.list || !t3.inline && !t3.simple) ? i2.exec(e2 = n3[1] + e2) : null;
-  }), order: 1, parse(e2, t3, r2) {
-    const i3 = n2 ? +e2[2] : void 0, o2 = e2[0].replace(d, "\n").match(l2);
-    let c2 = false;
-    return { items: o2.map(function(e3, n3) {
-      const i4 = a2.exec(e3)[0].length, l3 = new RegExp("^ {1," + i4 + "}", "gm"), s2 = e3.replace(l3, "").replace(a2, ""), d2 = n3 === o2.length - 1, u2 = -1 !== s2.indexOf("\n\n") || d2 && c2;
-      c2 = u2;
-      const p2 = r2.inline, f2 = r2.list;
-      let h2;
-      r2.list = true, u2 ? (r2.inline = false, h2 = Ee(s2) + "\n\n") : (r2.inline = true, h2 = Ee(s2));
-      const m2 = t3(h2, r2);
-      return r2.inline = p2, r2.list = f2, m2;
-    }), ordered: n2, start: i3 };
-  }, render: (t3, n3, i3) => e(t3.ordered ? "ol" : "ul", { key: i3.key, start: t3.type === r.orderedList ? t3.start : void 0 }, t3.items.map(function(t4, r2) {
-    return e("li", { key: r2 }, n3(t4, i3));
-  })) };
-}
-const Ce = new RegExp(`^\\[((?:\\[[^\\]]*\\]|[^\\[\\]]|\\](?=[^\\[]*\\]))*)\\]\\(\\s*<?((?:\\([^)]*\\)|[^\\s\\\\]|\\\\.)*?)>?(?:\\s+['"]([\\s\\S]*?)['"])?\\s*\\)`), $e = /^!\[(.*?)\]\( *((?:\([^)]*\)|[^() ])*) *"?([^)"]*)?"?\)/, Se = [u, g, y, E, L, z, j, xe, be], we = [...Se, /^[^\n]+(?:  \n|\n{2,})/, A, B, M];
-function Ee(e) {
-  let t2 = e.length;
-  for (; t2 > 0 && e[t2 - 1] <= " "; ) t2--;
-  return e.slice(0, t2);
-}
-function ze(e) {
-  return e.replace(/[ÀÁÂÃÄÅàáâãäåæÆ]/g, "a").replace(/[çÇ]/g, "c").replace(/[ðÐ]/g, "d").replace(/[ÈÉÊËéèêë]/g, "e").replace(/[ÏïÎîÍíÌì]/g, "i").replace(/[Ññ]/g, "n").replace(/[øØœŒÕõÔôÓóÒò]/g, "o").replace(/[ÜüÛûÚúÙù]/g, "u").replace(/[ŸÿÝý]/g, "y").replace(/[^a-z0-9- ]/gi, "").replace(/ /gi, "-").toLowerCase();
-}
-function Le(e) {
-  return Q.test(e) ? "right" : Z.test(e) ? "center" : q.test(e) ? "left" : null;
-}
-function Ae(e, t2, n2, r2) {
-  const i2 = n2.inTable;
-  n2.inTable = true;
-  let l2 = [[]], a2 = "";
-  function o2() {
-    if (!a2) return;
-    const e2 = l2[l2.length - 1];
-    e2.push.apply(e2, t2(a2, n2)), a2 = "";
-  }
-  return e.trim().split(/(`[^`]*`|\\\||\|)/).filter(Boolean).forEach((e2, t3, n3) => {
-    "|" === e2.trim() && (o2(), r2) ? 0 !== t3 && t3 !== n3.length - 1 && l2.push([]) : a2 += e2;
-  }), o2(), n2.inTable = i2, l2;
-}
-function Te(e, t2, n2) {
-  n2.inline = true;
-  const i2 = e[2] ? e[2].replace(W, "").split("|").map(Le) : [], l2 = e[3] ? function(e2, t3, n3) {
-    return e2.trim().split("\n").map(function(e3) {
-      return Ae(e3, t3, n3, true);
-    });
-  }(e[3], t2, n2) : [], a2 = Ae(e[1], t2, n2, !!l2.length);
-  return n2.inline = false, l2.length ? { align: i2, cells: l2, header: a2, type: r.table } : { children: a2, type: r.paragraph };
-}
-function Be(e, t2) {
-  return null == e.align[t2] ? {} : { textAlign: e.align[t2] };
-}
-function Oe(e) {
-  return e.inline = 1, e;
-}
-function Me(e) {
-  return Oe(function(t2, n2) {
-    return n2.inline ? e.exec(t2) : null;
-  });
-}
-function Re(e) {
-  return Oe(function(t2, n2) {
-    return n2.inline || n2.simple ? e.exec(t2) : null;
-  });
-}
-function Ie(e) {
-  return function(t2, n2) {
-    return n2.inline || n2.simple ? null : e.exec(t2);
-  };
-}
-function Ue(e) {
-  return Oe(function(t2) {
-    return e.exec(t2);
-  });
-}
-function De(e, t2) {
-  if (t2.inline || t2.simple) return null;
-  let n2 = "";
-  e.split("\n").every((e2) => (e2 += "\n", !Se.some((t3) => t3.test(e2)) && (n2 += e2, !!e2.trim())));
-  const r2 = Ee(n2);
-  return "" == r2 ? null : [n2, , r2];
-}
-function Ne(e) {
-  try {
-    if (decodeURIComponent(e).replace(/[^A-Za-z0-9/:]/g, "").match(/^\s*(javascript|vbscript|data(?!:image)):/i)) return null;
-  } catch (e2) {
-    return null;
-  }
-  return e;
-}
-function je(e) {
-  return e.replace(le, "$1");
-}
-function He(e, t2, n2) {
-  const r2 = n2.inline || false, i2 = n2.simple || false;
-  n2.inline = true, n2.simple = true;
-  const l2 = e(t2, n2);
-  return n2.inline = r2, n2.simple = i2, l2;
-}
-function Pe(e, t2, n2) {
-  const r2 = n2.inline || false, i2 = n2.simple || false;
-  n2.inline = false, n2.simple = true;
-  const l2 = e(t2, n2);
-  return n2.inline = r2, n2.simple = i2, l2;
-}
-function _e(e, t2, n2) {
-  const r2 = n2.inline || false;
-  n2.inline = false;
-  const i2 = e(t2, n2);
-  return n2.inline = r2, i2;
-}
-const Fe = (e, t2, n2) => ({ children: He(t2, e[2], n2) });
-function Ge() {
-  return {};
-}
-function We() {
-  return null;
-}
-function Ze(...e) {
-  return e.filter(Boolean).join(" ");
-}
-function qe(e, t2, n2) {
-  let r2 = e;
-  const i2 = t2.split(".");
-  for (; i2.length && (r2 = r2[i2[0]], void 0 !== r2); ) i2.shift();
-  return r2 || n2;
-}
-function Qe(n2 = "", i2 = {}) {
-  function d2(e, n3, ...r2) {
-    const l2 = qe(i2.overrides, `${e}.props`, {});
-    return i2.createElement(function(e2, t2) {
-      const n4 = qe(t2, e2);
-      return n4 ? "function" == typeof n4 || "object" == typeof n4 && "render" in n4 ? n4 : qe(t2, `${e2}.component`, e2) : e2;
-    }(e, i2.overrides), t({}, n3, l2, { className: Ze(null == n3 ? void 0 : n3.className, l2.className) || void 0 }), ...r2);
-  }
-  function W2(e) {
-    e = e.replace(S, "");
-    let t2 = false;
-    i2.forceInline ? t2 = true : i2.forceBlock || (t2 = false === F.test(e));
-    const n3 = ae2(le2(t2 ? e : `${Ee(e).replace(re, "")}
-
-`, { inline: t2 }));
-    for (; "string" == typeof n3[n3.length - 1] && !n3[n3.length - 1].trim(); ) n3.pop();
-    if (null === i2.wrapper) return n3;
-    const r2 = i2.wrapper || (t2 ? "span" : "div");
-    let l2;
-    if (n3.length > 1 || i2.forceWrapper) l2 = n3;
-    else {
-      if (1 === n3.length) return l2 = n3[0], "string" == typeof l2 ? d2("span", { key: "outer" }, l2) : l2;
-      l2 = null;
-    }
-    return i2.createElement(r2, { key: "outer" }, l2);
-  }
-  function Z2(e, t2) {
-    const n3 = t2.match(c);
-    return n3 ? n3.reduce(function(t3, n4) {
-      const r2 = n4.indexOf("=");
-      if (-1 !== r2) {
-        const a2 = function(e2) {
-          return -1 !== e2.indexOf("-") && null === e2.match(O) && (e2 = e2.replace(N, function(e3, t4) {
-            return t4.toUpperCase();
-          })), e2;
-        }(n4.slice(0, r2)).trim(), o2 = function(e2) {
-          const t4 = e2[0];
-          return ('"' === t4 || "'" === t4) && e2.length >= 2 && e2[e2.length - 1] === t4 ? e2.slice(1, -1) : e2;
-        }(n4.slice(r2 + 1).trim()), c2 = l[a2] || a2;
-        if ("ref" === c2) return t3;
-        const s2 = t3[c2] = function(e2, t4, n5, r3) {
-          return "style" === t4 ? n5.split(/;\s?/).reduce(function(e3, t5) {
-            const n6 = t5.slice(0, t5.indexOf(":"));
-            return e3[n6.trim().replace(/(-[a-z])/g, (e4) => e4[1].toUpperCase())] = t5.slice(n6.length + 1).trim(), e3;
-          }, {}) : "href" === t4 || "src" === t4 ? r3(n5, e2, t4) : (n5.match(R) && (n5 = n5.slice(1, n5.length - 1)), "true" === n5 || "false" !== n5 && n5);
-        }(e, a2, o2, i2.sanitizer);
-        "string" == typeof s2 && (A.test(s2) || M.test(s2)) && (t3[c2] = W2(s2.trim()));
-      } else "style" !== n4 && (t3[l[n4] || n4] = true);
-      return t3;
-    }, {}) : null;
-  }
-  i2.overrides = i2.overrides || {}, i2.sanitizer = i2.sanitizer || Ne, i2.slugify = i2.slugify || ze, i2.namedCodesToUnicode = i2.namedCodesToUnicode ? t({}, a, i2.namedCodesToUnicode) : a, i2.createElement = i2.createElement || reactExports.createElement;
-  const q2 = [], Q2 = {}, V2 = { [r.blockQuote]: { match: Ie(u), order: 1, parse(e, t2, n3) {
-    const [, r2, i3] = e[0].replace(p, "").match(f);
-    return { alert: r2, children: t2(i3, n3) };
-  }, render(e, t2, n3) {
-    const l2 = { key: n3.key };
-    return e.alert && (l2.className = "markdown-alert-" + i2.slugify(e.alert.toLowerCase(), ze), e.children.unshift({ attrs: {}, children: [{ type: r.text, text: e.alert }], noInnerParse: true, type: r.htmlBlock, tag: "header" })), d2("blockquote", l2, t2(e.children, n3));
-  } }, [r.breakLine]: { match: Ue(h), order: 1, parse: Ge, render: (e, t2, n3) => d2("br", { key: n3.key }) }, [r.breakThematic]: { match: Ie(m), order: 1, parse: Ge, render: (e, t2, n3) => d2("hr", { key: n3.key }) }, [r.codeBlock]: { match: Ie(y), order: 0, parse: (e) => ({ lang: void 0, text: Ee(e[0].replace(/^ {4}/gm, "")).replace(te, "$1") }), render: (e, n3, r2) => d2("pre", { key: r2.key }, d2("code", t({}, e.attrs, { className: e.lang ? `lang-${e.lang}` : "" }), e.text)) }, [r.codeFenced]: { match: Ie(g), order: 0, parse: (e) => ({ attrs: Z2("code", e[3] || ""), lang: e[2] || void 0, text: e[4].replace(te, "$1"), type: r.codeBlock }) }, [r.codeInline]: { match: Re(k), order: 3, parse: (e) => ({ text: e[2].replace(te, "$1") }), render: (e, t2, n3) => d2("code", { key: n3.key }, e.text) }, [r.footnote]: { match: Ie(v), order: 0, parse: (e) => (q2.push({ footnote: e[2], identifier: e[1] }), {}), render: We }, [r.footnoteReference]: { match: Me(C), order: 1, parse: (e) => ({ target: `#${i2.slugify(e[1], ze)}`, text: e[1] }), render: (e, t2, n3) => d2("a", { key: n3.key, href: i2.sanitizer(e.target, "a", "href") }, d2("sup", { key: n3.key }, e.text)) }, [r.gfmTask]: { match: Me(w), order: 1, parse: (e) => ({ completed: "x" === e[1].toLowerCase() }), render: (e, t2, n3) => d2("input", { checked: e.completed, key: n3.key, readOnly: true, type: "checkbox" }) }, [r.heading]: { match: Ie(i2.enforceAtxHeadings ? z : E), order: 1, parse: (e, t2, n3) => ({ children: He(t2, e[2], n3), id: i2.slugify(e[2], ze), level: e[1].length }), render: (e, t2, n3) => d2(`h${e.level}`, { id: e.id, key: n3.key }, t2(e.children, n3)) }, [r.headingSetext]: { match: Ie(L), order: 0, parse: (e, t2, n3) => ({ children: He(t2, e[1], n3), level: "=" === e[2] ? 1 : 2, type: r.heading }) }, [r.htmlBlock]: { match: Ue(A), order: 1, parse(e, t2, n3) {
-    const [, r2] = e[3].match(ie), i3 = new RegExp(`^${r2}`, "gm"), l2 = e[3].replace(i3, ""), a2 = (c2 = l2, we.some((e2) => e2.test(c2)) ? _e : He);
-    var c2;
-    const s2 = e[1].toLowerCase(), d3 = -1 !== o.indexOf(s2), u2 = (d3 ? s2 : e[1]).trim(), p2 = { attrs: Z2(u2, e[2]), noInnerParse: d3, tag: u2 };
-    return n3.inAnchor = n3.inAnchor || "a" === s2, d3 ? p2.text = e[3] : p2.children = a2(t2, l2, n3), n3.inAnchor = false, p2;
-  }, render: (e, n3, r2) => d2(e.tag, t({ key: r2.key }, e.attrs), e.text || (e.children ? n3(e.children, r2) : "")) }, [r.htmlSelfClosing]: { match: Ue(M), order: 1, parse(e) {
-    const t2 = e[1].trim();
-    return { attrs: Z2(t2, e[2] || ""), tag: t2 };
-  }, render: (e, n3, r2) => d2(e.tag, t({}, e.attrs, { key: r2.key })) }, [r.htmlComment]: { match: Ue(B), order: 1, parse: () => ({}), render: We }, [r.image]: { match: Re($e), order: 1, parse: (e) => ({ alt: e[1], target: je(e[2]), title: e[3] }), render: (e, t2, n3) => d2("img", { key: n3.key, alt: e.alt || void 0, title: e.title || void 0, src: i2.sanitizer(e.target, "img", "src") }) }, [r.link]: { match: Me(Ce), order: 3, parse: (e, t2, n3) => ({ children: Pe(t2, e[1], n3), target: je(e[2]), title: e[3] }), render: (e, t2, n3) => d2("a", { key: n3.key, href: i2.sanitizer(e.target, "a", "href"), title: e.title }, t2(e.children, n3)) }, [r.linkAngleBraceStyleDetector]: { match: Me(D), order: 0, parse: (e) => ({ children: [{ text: e[1], type: r.text }], target: e[1], type: r.link }) }, [r.linkBareUrlDetector]: { match: Oe((e, t2) => t2.inAnchor || i2.disableAutoLink ? null : Me(I)(e, t2)), order: 0, parse: (e) => ({ children: [{ text: e[1], type: r.text }], target: e[1], title: void 0, type: r.link }) }, [r.linkMailtoDetector]: { match: Me(U), order: 0, parse(e) {
-    let t2 = e[1], n3 = e[1];
-    return s.test(n3) || (n3 = "mailto:" + n3), { children: [{ text: t2.replace("mailto:", ""), type: r.text }], target: n3, type: r.link };
-  } }, [r.orderedList]: ve(d2, 1), [r.unorderedList]: ve(d2, 2), [r.newlineCoalescer]: { match: Ie(x), order: 3, parse: Ge, render: () => "\n" }, [r.paragraph]: { match: Oe(De), order: 3, parse: Fe, render: (e, t2, n3) => d2("p", { key: n3.key }, t2(e.children, n3)) }, [r.ref]: { match: Me(H), order: 0, parse: (e) => (Q2[e[1]] = { target: e[2], title: e[4] }, {}), render: We }, [r.refImage]: { match: Re(P), order: 0, parse: (e) => ({ alt: e[1] || void 0, ref: e[2] }), render: (e, t2, n3) => Q2[e.ref] ? d2("img", { key: n3.key, alt: e.alt, src: i2.sanitizer(Q2[e.ref].target, "img", "src"), title: Q2[e.ref].title }) : null }, [r.refLink]: { match: Me(_), order: 0, parse: (e, t2, n3) => ({ children: t2(e[1], n3), fallbackChildren: e[0], ref: e[2] }), render: (e, t2, n3) => Q2[e.ref] ? d2("a", { key: n3.key, href: i2.sanitizer(Q2[e.ref].target, "a", "href"), title: Q2[e.ref].title }, t2(e.children, n3)) : d2("span", { key: n3.key }, e.fallbackChildren) }, [r.table]: { match: Ie(j), order: 1, parse: Te, render(e, t2, n3) {
-    const r2 = e;
-    return d2("table", { key: n3.key }, d2("thead", null, d2("tr", null, r2.header.map(function(e2, i3) {
-      return d2("th", { key: i3, style: Be(r2, i3) }, t2(e2, n3));
-    }))), d2("tbody", null, r2.cells.map(function(e2, i3) {
-      return d2("tr", { key: i3 }, e2.map(function(e3, i4) {
-        return d2("td", { key: i4, style: Be(r2, i4) }, t2(e3, n3));
-      }));
-    })));
-  } }, [r.text]: { match: Ue(ne), order: 4, parse: (e) => ({ text: e[0].replace(T, (e2, t2) => i2.namedCodesToUnicode[t2] ? i2.namedCodesToUnicode[t2] : e2) }), render: (e) => e.text }, [r.textBolded]: { match: Re(X), order: 2, parse: (e, t2, n3) => ({ children: t2(e[2], n3) }), render: (e, t2, n3) => d2("strong", { key: n3.key }, t2(e.children, n3)) }, [r.textEmphasized]: { match: Re(J), order: 3, parse: (e, t2, n3) => ({ children: t2(e[2], n3) }), render: (e, t2, n3) => d2("em", { key: n3.key }, t2(e.children, n3)) }, [r.textEscaped]: { match: Re(ee), order: 1, parse: (e) => ({ text: e[1], type: r.text }) }, [r.textMarked]: { match: Re(K), order: 3, parse: Fe, render: (e, t2, n3) => d2("mark", { key: n3.key }, t2(e.children, n3)) }, [r.textStrikethroughed]: { match: Re(Y), order: 3, parse: Fe, render: (e, t2, n3) => d2("del", { key: n3.key }, t2(e.children, n3)) } };
-  true === i2.disableParsingRawHTML && (delete V2[r.htmlBlock], delete V2[r.htmlSelfClosing]);
-  const le2 = function(e) {
-    let t2 = Object.keys(e);
-    function n3(r2, i3) {
-      let l2, a2, o2 = [], c2 = "", s2 = "";
-      for (i3.prevCapture = i3.prevCapture || ""; r2; ) {
-        let d3 = 0;
-        for (; d3 < t2.length; ) {
-          if (c2 = t2[d3], l2 = e[c2], i3.inline && !l2.match.inline) {
-            d3++;
-            continue;
-          }
-          const u2 = l2.match(r2, i3);
-          if (u2) {
-            s2 = u2[0], i3.prevCapture += s2, r2 = r2.substring(s2.length), a2 = l2.parse(u2, n3, i3), null == a2.type && (a2.type = c2), o2.push(a2);
-            break;
-          }
-          d3++;
-        }
-      }
-      return i3.prevCapture = "", o2;
-    }
-    return t2.sort(function(t3, n4) {
-      let r2 = e[t3].order, i3 = e[n4].order;
-      return r2 !== i3 ? r2 - i3 : t3 < n4 ? -1 : 1;
-    }), function(e2, t3) {
-      return n3(function(e3) {
-        return e3.replace(b, "\n").replace($, "").replace(G, "    ");
-      }(e2), t3);
-    };
-  }(V2), ae2 = (oe2 = /* @__PURE__ */ function(e, t2) {
-    return function(n3, r2, i3) {
-      const l2 = e[n3.type].render;
-      return t2 ? t2(() => l2(n3, r2, i3), n3, r2, i3) : l2(n3, r2, i3);
-    };
-  }(V2, i2.renderRule), function e(t2, n3 = {}) {
-    if (Array.isArray(t2)) {
-      const r2 = n3.key, i3 = [];
-      let l2 = false;
-      for (let r3 = 0; r3 < t2.length; r3++) {
-        n3.key = r3;
-        const a2 = e(t2[r3], n3), o2 = "string" == typeof a2;
-        o2 && l2 ? i3[i3.length - 1] += a2 : null !== a2 && i3.push(a2), l2 = o2;
-      }
-      return n3.key = r2, i3;
-    }
-    return oe2(t2, e, n3);
-  });
-  var oe2;
-  const ce2 = W2(n2);
-  return q2.length ? d2("div", null, ce2, d2("footer", { key: "footer" }, q2.map(function(e) {
-    return d2("div", { id: i2.slugify(e.identifier, ze), key: e.identifier }, e.identifier, ae2(le2(e.footnote, { inline: true })));
-  }))) : ce2;
-}
-const Markdown = (t2) => {
-  let { children: r2 = "", options: i2 } = t2, l2 = function(e, t3) {
-    if (null == e) return {};
-    var n2, r3, i3 = {}, l3 = Object.keys(e);
-    for (r3 = 0; r3 < l3.length; r3++) t3.indexOf(n2 = l3[r3]) >= 0 || (i3[n2] = e[n2]);
-    return i3;
-  }(t2, n);
-  return reactExports.cloneElement(Qe(r2, i2), l2);
-};
-var Disposable;
-((Disposable2) => {
-  function disposeAll(disposables) {
-    for (const disposable of disposables.splice(0))
-      disposable.dispose();
-  }
-  Disposable2.disposeAll = disposeAll;
-})(Disposable || (Disposable = {}));
-class EventEmitter {
-  constructor() {
-    this._listeners = /* @__PURE__ */ new Set();
-    this.event = (listener, disposables) => {
-      this._listeners.add(listener);
-      let disposed = false;
-      const self = this;
-      const result = {
-        dispose() {
-          if (!disposed) {
-            disposed = true;
-            self._listeners.delete(listener);
-          }
-        }
-      };
-      if (disposables)
-        disposables.push(result);
-      return result;
-    };
-  }
-  fire(event) {
-    const dispatch = !this._deliveryQueue;
-    if (!this._deliveryQueue)
-      this._deliveryQueue = [];
-    for (const listener of this._listeners)
-      this._deliveryQueue.push({ listener, event });
-    if (!dispatch)
-      return;
-    for (let index = 0; index < this._deliveryQueue.length; index++) {
-      const { listener, event: event2 } = this._deliveryQueue[index];
-      listener.call(null, event2);
-    }
-    this._deliveryQueue = void 0;
-  }
-  dispose() {
-    this._listeners.clear();
-    if (this._deliveryQueue)
-      this._deliveryQueue = [];
-  }
-}
-async function* parseSSE(body) {
-  const reader = body.pipeThrough(new TextDecoderStream()).getReader();
-  let buffer = "";
-  let lastEventId = "";
-  let type = "";
-  let data = "";
-  while (true) {
-    const { value, done } = await reader.read();
-    if (done)
-      break;
-    buffer += value;
-    const lines = buffer.split("\n");
-    buffer = lines.pop();
-    for (const line of lines) {
-      if (line.length === 0) {
-        if (data === "") {
-          data = "";
-          type = "";
-          continue;
-        }
-        if (data[data.length - 1] === "\n")
-          data = data.substring(0, data.length - 1);
-        const event = { type: type || "message", data, id: lastEventId };
-        type = "";
-        data = "";
-        yield event;
-      }
-      if (line[0] === ":")
-        continue;
-      let name = "";
-      let value2 = "";
-      const colon = line.indexOf(":");
-      if (colon === -1) {
-        name = line;
-      } else {
-        name = line.substring(0, colon);
-        value2 = line[colon + 1] === " " ? line.substring(colon + 2) : line.substring(colon + 1);
-      }
-      switch (name) {
-        case "event":
-          type = value2;
-          break;
-        case "data":
-          data += value2 + "\n";
-          break;
-        case "id":
-          lastEventId = value2;
-          break;
-      }
-    }
-  }
-}
-class OpenAI {
-  constructor(apiKey, baseURL = "https://api.openai.com") {
-    __publicField(this, "name", "OpenAI");
-    this.apiKey = apiKey;
-    this.baseURL = baseURL;
-  }
-  async *chatCompletion(messages, signal) {
-    const url = new URL("./v1/chat/completions", this.baseURL);
-    const response = await fetch(url, {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-        "Authorization": `Bearer ${this.apiKey}`,
-        "x-pw-serviceworker": "forward"
-      },
-      body: JSON.stringify({
-        model: "gpt-4o",
-        // TODO: make configurable
-        messages: messages.map(({ role, content }) => ({ role, content })),
-        stream: true
-      }),
-      signal
-    });
-    if (response.status !== 200 || !response.body)
-      throw new Error("Failed to chat with OpenAI, unexpected status: " + response.status + await response.text());
-    for await (const sseEvent of parseSSE(response.body)) {
-      const event = JSON.parse(sseEvent.data);
-      if (event.object === "chat.completion.chunk") {
-        if (event.choices[0].finish_reason)
-          break;
-        yield event.choices[0].delta.content;
-      }
-    }
-  }
-}
-class Anthropic {
-  constructor(apiKey, baseURL = "https://api.anthropic.com") {
-    __publicField(this, "name", "Anthropic");
-    this.apiKey = apiKey;
-    this.baseURL = baseURL;
-  }
-  async *chatCompletion(messages, signal) {
-    var _a;
-    const response = await fetch(new URL("./v1/messages", this.baseURL), {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-        "x-api-key": this.apiKey,
-        "anthropic-version": "2023-06-01",
-        "x-pw-serviceworker": "forward"
-      },
-      body: JSON.stringify({
-        model: "claude-3-5-sonnet-20241022",
-        // TODO: make configurable
-        messages: messages.filter(({ role }) => role !== "developer").map(({ role, content }) => ({ role, content })),
-        system: (_a = messages.find(({ role }) => role === "developer")) == null ? void 0 : _a.content,
-        max_tokens: 1024,
-        stream: true
-      }),
-      signal
-    });
-    if (response.status !== 200 || !response.body)
-      throw new Error("Failed to chat with Anthropic, unexpected status: " + response.status + await response.text());
-    for await (const sseEvent of parseSSE(response.body)) {
-      const event = JSON.parse(sseEvent.data);
-      if (event.type === "content_block_delta")
-        yield event.delta.text;
-    }
-  }
-}
-class LLMChat {
-  constructor(api) {
-    __publicField(this, "conversations", /* @__PURE__ */ new Map());
-    this.api = api;
-  }
-  getConversation(id) {
-    return this.conversations.get(id);
-  }
-  startConversation(id, systemPrompt) {
-    const conversation = new Conversation(this, systemPrompt);
-    this.conversations.set(id, conversation);
-    return conversation;
-  }
-}
-class Conversation {
-  constructor(chat, systemPrompt) {
-    __publicField(this, "history");
-    __publicField(this, "onChange", new EventEmitter());
-    __publicField(this, "_abortControllers", /* @__PURE__ */ new Set());
-    this.chat = chat;
-    this.history = [{ role: "developer", content: systemPrompt }];
-  }
-  async send(content, displayContent) {
-    const response = { role: "assistant", content: "" };
-    this.history.push({ role: "user", content, displayContent }, response);
-    const abortController = new AbortController();
-    this._abortControllers.add(abortController);
-    this.onChange.fire();
-    try {
-      for await (const chunk of this.chat.api.chatCompletion(this.history, abortController.signal)) {
-        response.content += chunk;
-        this.onChange.fire();
-      }
-    } finally {
-      this._abortControllers.delete(abortController);
-      this.onChange.fire();
-    }
-  }
-  isSending() {
-    return this._abortControllers.size > 0;
-  }
-  abortSending() {
-    for (const controller of this._abortControllers)
-      controller.abort();
-    this._abortControllers.clear();
-    this.onChange.fire();
-  }
-  isEmpty() {
-    return this.history.length < 2;
-  }
-}
-const llmContext = reactExports.createContext(void 0);
-function LLMProvider({ children }) {
-  const cookiePairs = useCookies();
-  const chat = reactExports.useMemo(() => {
-    const cookies = Object.fromEntries(cookiePairs);
-    if (cookies.openai_api_key)
-      return new LLMChat(new OpenAI(cookies.openai_api_key, cookies.openai_base_url));
-    if (cookies.anthropic_api_key)
-      return new LLMChat(new Anthropic(cookies.anthropic_api_key, cookies.anthropic_base_url));
-  }, [cookiePairs]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(llmContext.Provider, { value: chat, children });
-}
-function useLLMChat() {
-  const chat = reactExports.useContext(llmContext);
-  if (!chat)
-    throw new Error("No LLM chat available, make sure theres a LLMProvider above");
-  return chat;
-}
-function useIsLLMAvailable() {
-  return !!reactExports.useContext(llmContext);
-}
-function useLLMConversation(id) {
-  const conversation = useLLMChat().getConversation(id);
-  if (!conversation)
-    throw new Error("No conversation found for id: " + id);
-  const [history, setHistory] = reactExports.useState(conversation.history);
-  reactExports.useEffect(() => {
-    function update() {
-      setHistory([...conversation.history]);
-    }
-    update();
-    const subscription = conversation.onChange.event(update);
-    return subscription.dispose;
-  }, [conversation]);
-  return [history, conversation];
-}
-function AIConversation({ conversationId }) {
-  const [history, conversation] = useLLMConversation(conversationId);
-  const [input, setInput] = reactExports.useState("");
-  const onSubmit = reactExports.useCallback(() => {
-    setInput((content) => {
-      conversation.send(content);
-      return "";
-    });
-  }, [conversation]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "chat-container", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "chat-disclaimer", children: [
-      "Chat based on ",
-      conversation.chat.api.name,
-      ". Check for mistakes."
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("hr", {}),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "messages-container", children: history.filter(({ role }) => role !== "developer").map((message, index) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      "div",
-      {
-        className: clsx("message", message.role === "user" && "user-message"),
-        children: [
-          message.role === "assistant" && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "message-icon", children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: "playwright-logo.svg" }) }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "message-content", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Markdown, { options: { disableParsingRawHTML: true }, children: message.displayContent ?? message.content }) })
-        ]
-      },
-      "" + index
-    )) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "input-form", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        "textarea",
-        {
-          name: "content",
-          value: input,
-          onChange: (e) => setInput(e.target.value),
-          onKeyDown: (e) => {
-            if (e.key === "Enter" && !e.shiftKey) {
-              e.preventDefault();
-              onSubmit();
-            }
-          },
-          placeholder: "Ask a question...",
-          className: "message-input"
-        }
-      ),
-      conversation.isSending() ? /* @__PURE__ */ jsxRuntimeExports.jsx("button", { type: "button", className: "send-button", onClick: (evt) => {
-        evt.preventDefault();
-        conversation.abortSending();
-      }, children: "Cancel" }) : /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: "send-button", disabled: !input.trim(), onClick: onSubmit, children: "Send" })
-    ] })
-  ] });
-}
-async function loadImage(src) {
-  const image = new Image();
-  if (src) {
-    image.src = src;
-    await new Promise((f2, r2) => {
-      image.onload = f2;
-      image.onerror = f2;
-    });
-  }
-  return image;
-}
-const checkerboardStyle = {
-  backgroundImage: `linear-gradient(45deg, #80808020 25%, transparent 25%),
-                    linear-gradient(-45deg, #80808020 25%, transparent 25%),
-                    linear-gradient(45deg, transparent 75%, #80808020 75%),
-                    linear-gradient(-45deg, transparent 75%, #80808020 75%)`,
-  backgroundSize: "20px 20px",
-  backgroundPosition: "0 0, 0 10px, 10px -10px, -10px 0px",
-  boxShadow: `rgb(0 0 0 / 10%) 0px 1.8px 1.9px,
-              rgb(0 0 0 / 15%) 0px 6.1px 6.3px,
-              rgb(0 0 0 / 10%) 0px -2px 4px,
-              rgb(0 0 0 / 15%) 0px -6.1px 12px,
-              rgb(0 0 0 / 25%) 0px 6px 12px`
-};
-const ImageDiffView = ({ diff, noTargetBlank, hideDetails }) => {
-  const [mode, setMode] = reactExports.useState(diff.diff ? "diff" : "actual");
-  const [showSxsDiff, setShowSxsDiff] = reactExports.useState(false);
-  const [expectedImage, setExpectedImage] = reactExports.useState(null);
-  const [expectedImageTitle, setExpectedImageTitle] = reactExports.useState("Expected");
-  const [actualImage, setActualImage] = reactExports.useState(null);
-  const [diffImage, setDiffImage] = reactExports.useState(null);
-  const [measure, ref] = useMeasure();
-  reactExports.useEffect(() => {
-    (async () => {
-      var _a, _b, _c, _d;
-      setExpectedImage(await loadImage((_a = diff.expected) == null ? void 0 : _a.attachment.path));
-      setExpectedImageTitle(((_b = diff.expected) == null ? void 0 : _b.title) || "Expected");
-      setActualImage(await loadImage((_c = diff.actual) == null ? void 0 : _c.attachment.path));
-      setDiffImage(await loadImage((_d = diff.diff) == null ? void 0 : _d.attachment.path));
-    })();
-  }, [diff]);
-  const isLoaded = expectedImage && actualImage && diffImage;
-  const imageWidth = isLoaded ? Math.max(expectedImage.naturalWidth, actualImage.naturalWidth, 200) : 500;
-  const imageHeight = isLoaded ? Math.max(expectedImage.naturalHeight, actualImage.naturalHeight, 200) : 500;
-  const scale = Math.min(1, (measure.width - 30) / imageWidth);
-  const sxsScale = Math.min(1, (measure.width - 50) / imageWidth / 2);
-  const fitWidth = imageWidth * scale;
-  const fitHeight = imageHeight * scale;
-  const modeStyle = {
-    flex: "none",
-    margin: "0 10px",
-    cursor: "pointer",
-    userSelect: "none"
-  };
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { "data-testid": "test-result-image-mismatch", style: { display: "flex", flexDirection: "column", alignItems: "center", flex: "auto" }, ref, children: isLoaded && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { "data-testid": "test-result-image-mismatch-tabs", style: { display: "flex", margin: "10px 0 20px" }, children: [
-      diff.diff && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { ...modeStyle, fontWeight: mode === "diff" ? 600 : "initial" }, onClick: () => setMode("diff"), children: "Diff" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { ...modeStyle, fontWeight: mode === "actual" ? 600 : "initial" }, onClick: () => setMode("actual"), children: "Actual" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { ...modeStyle, fontWeight: mode === "expected" ? 600 : "initial" }, onClick: () => setMode("expected"), children: expectedImageTitle }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { ...modeStyle, fontWeight: mode === "sxs" ? 600 : "initial" }, onClick: () => setMode("sxs"), children: "Side by side" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { ...modeStyle, fontWeight: mode === "slider" ? 600 : "initial" }, onClick: () => setMode("slider"), children: "Slider" })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", justifyContent: "center", flex: "auto", minHeight: fitHeight + 60 }, children: [
-      diff.diff && mode === "diff" && /* @__PURE__ */ jsxRuntimeExports.jsx(ImageWithSize, { image: diffImage, alt: "Diff", hideSize: hideDetails, canvasWidth: fitWidth, canvasHeight: fitHeight, scale }),
-      diff.diff && mode === "actual" && /* @__PURE__ */ jsxRuntimeExports.jsx(ImageWithSize, { image: actualImage, alt: "Actual", hideSize: hideDetails, canvasWidth: fitWidth, canvasHeight: fitHeight, scale }),
-      diff.diff && mode === "expected" && /* @__PURE__ */ jsxRuntimeExports.jsx(ImageWithSize, { image: expectedImage, alt: expectedImageTitle, hideSize: hideDetails, canvasWidth: fitWidth, canvasHeight: fitHeight, scale }),
-      diff.diff && mode === "slider" && /* @__PURE__ */ jsxRuntimeExports.jsx(ImageDiffSlider, { expectedImage, actualImage, hideSize: hideDetails, canvasWidth: fitWidth, canvasHeight: fitHeight, scale, expectedTitle: expectedImageTitle }),
-      diff.diff && mode === "sxs" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex" }, children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx(ImageWithSize, { image: expectedImage, title: expectedImageTitle, hideSize: hideDetails, canvasWidth: sxsScale * imageWidth, canvasHeight: sxsScale * imageHeight, scale: sxsScale }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(ImageWithSize, { image: showSxsDiff ? diffImage : actualImage, title: showSxsDiff ? "Diff" : "Actual", onClick: () => setShowSxsDiff(!showSxsDiff), hideSize: hideDetails, canvasWidth: sxsScale * imageWidth, canvasHeight: sxsScale * imageHeight, scale: sxsScale })
-      ] }),
-      !diff.diff && mode === "actual" && /* @__PURE__ */ jsxRuntimeExports.jsx(ImageWithSize, { image: actualImage, title: "Actual", hideSize: hideDetails, canvasWidth: fitWidth, canvasHeight: fitHeight, scale }),
-      !diff.diff && mode === "expected" && /* @__PURE__ */ jsxRuntimeExports.jsx(ImageWithSize, { image: expectedImage, title: expectedImageTitle, hideSize: hideDetails, canvasWidth: fitWidth, canvasHeight: fitHeight, scale }),
-      !diff.diff && mode === "sxs" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex" }, children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx(ImageWithSize, { image: expectedImage, title: expectedImageTitle, canvasWidth: sxsScale * imageWidth, canvasHeight: sxsScale * imageHeight, scale: sxsScale }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(ImageWithSize, { image: actualImage, title: "Actual", canvasWidth: sxsScale * imageWidth, canvasHeight: sxsScale * imageHeight, scale: sxsScale })
-      ] })
-    ] }),
-    !hideDetails && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { alignSelf: "start", lineHeight: "18px", marginLeft: "15px" }, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: diff.diff && /* @__PURE__ */ jsxRuntimeExports.jsx("a", { target: "_blank", href: diff.diff.attachment.path, rel: "noreferrer", children: diff.diff.attachment.name }) }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsx("a", { target: noTargetBlank ? "" : "_blank", href: diff.actual.attachment.path, rel: "noreferrer", children: diff.actual.attachment.name }) }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsx("a", { target: noTargetBlank ? "" : "_blank", href: diff.expected.attachment.path, rel: "noreferrer", children: diff.expected.attachment.name }) })
-    ] })
-  ] }) });
-};
-const ImageDiffSlider = ({ expectedImage, actualImage, canvasWidth, canvasHeight, scale, expectedTitle, hideSize }) => {
-  const absoluteStyle = {
-    position: "absolute",
-    top: 0,
-    left: 0
-  };
-  const [slider, setSlider] = reactExports.useState(canvasWidth / 2);
-  const sameSize = expectedImage.naturalWidth === actualImage.naturalWidth && expectedImage.naturalHeight === actualImage.naturalHeight;
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { flex: "none", display: "flex", alignItems: "center", flexDirection: "column", userSelect: "none" }, children: [
-    !hideSize && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { margin: 5 }, children: [
-      !sameSize && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { flex: "none", margin: "0 5px" }, children: "Expected " }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: expectedImage.naturalWidth }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { flex: "none", margin: "0 5px" }, children: "x" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: expectedImage.naturalHeight }),
-      !sameSize && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { flex: "none", margin: "0 5px 0 15px" }, children: "Actual " }),
-      !sameSize && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: actualImage.naturalWidth }),
-      !sameSize && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { flex: "none", margin: "0 5px" }, children: "x" }),
-      !sameSize && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: actualImage.naturalHeight })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { position: "relative", width: canvasWidth, height: canvasHeight, margin: 15, ...checkerboardStyle }, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        ResizeView,
-        {
-          orientation: "horizontal",
-          offsets: [slider],
-          setOffsets: (offsets) => setSlider(offsets[0]),
-          resizerColor: "#57606a80",
-          resizerWidth: 6
-        }
-      ),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("img", { alt: expectedTitle, style: {
-        width: expectedImage.naturalWidth * scale,
-        height: expectedImage.naturalHeight * scale
-      }, draggable: "false", src: expectedImage.src }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { ...absoluteStyle, bottom: 0, overflow: "hidden", width: slider, ...checkerboardStyle }, children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { alt: "Actual", style: {
-        width: actualImage.naturalWidth * scale,
-        height: actualImage.naturalHeight * scale
-      }, draggable: "false", src: actualImage.src }) })
-    ] })
-  ] });
-};
-const ImageWithSize = ({ image, title, alt, hideSize, canvasWidth, canvasHeight, scale, onClick }) => {
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { flex: "none", display: "flex", alignItems: "center", flexDirection: "column" }, children: [
-    !hideSize && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { margin: 5 }, children: [
-      title && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { flex: "none", margin: "0 5px" }, children: title }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: image.naturalWidth }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { flex: "none", margin: "0 5px" }, children: "x" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: image.naturalHeight })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { display: "flex", flex: "none", width: canvasWidth, height: canvasHeight, margin: 15, ...checkerboardStyle }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "img",
-      {
-        width: image.naturalWidth * scale,
-        height: image.naturalHeight * scale,
-        alt: title || alt,
-        style: { cursor: onClick ? "pointer" : "initial" },
-        draggable: "false",
-        src: image.src,
-        onClick
-      }
-    ) })
-  ] });
-};
-function isTextualMimeType(mimeType) {
-  return !!mimeType.match(/^(text\/.*?|application\/(json|(x-)?javascript|xml.*?|ecmascript|graphql|x-www-form-urlencoded)|image\/svg(\+xml)?|application\/.*?(\+json|\+xml))(;\s*charset=.*)?$/);
-}
-const Expandable = ({ title, children, setExpanded, expanded, expandOnTitleClick }) => {
-  const id = reactExports.useId();
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: clsx("expandable", expanded && "expanded"), children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      "div",
-      {
-        role: "button",
-        "aria-expanded": expanded,
-        "aria-controls": id,
-        className: "expandable-title",
-        onClick: () => expandOnTitleClick && setExpanded(!expanded),
-        children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(
-            "div",
-            {
-              className: clsx("codicon", expanded ? "codicon-chevron-down" : "codicon-chevron-right"),
-              style: { cursor: "pointer", color: "var(--vscode-foreground)", marginLeft: "5px" },
-              onClick: () => !expandOnTitleClick && setExpanded(!expanded)
-            }
-          ),
-          title
-        ]
-      }
-    ),
-    expanded && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { id, role: "region", style: { marginLeft: 25 }, children })
-  ] });
-};
-function linkifyText(description) {
-  const result = [];
-  let currentIndex = 0;
-  let match;
-  while ((match = kWebLinkRe.exec(description)) !== null) {
-    const stringBeforeMatch = description.substring(currentIndex, match.index);
-    if (stringBeforeMatch)
-      result.push(stringBeforeMatch);
-    const value = match[0];
-    result.push(renderLink(value));
-    currentIndex = match.index + value.length;
-  }
-  const stringAfterMatches = description.substring(currentIndex);
-  if (stringAfterMatches)
-    result.push(stringAfterMatches);
-  return result;
-}
-function renderLink(text) {
-  let link = text;
-  if (link.startsWith("www."))
-    link = "https://" + link;
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: link, target: "_blank", rel: "noopener noreferrer", children: text });
-}
-const ExpandableAttachment = ({ attachment, reveal }) => {
-  const [expanded, setExpanded] = reactExports.useState(false);
-  const [attachmentText, setAttachmentText] = reactExports.useState(null);
-  const [placeholder, setPlaceholder] = reactExports.useState(null);
-  const [flash, triggerFlash] = useFlash();
-  const ref = reactExports.useRef(null);
-  const isTextAttachment = isTextualMimeType(attachment.contentType);
-  const hasContent = !!attachment.sha1 || !!attachment.path;
-  reactExports.useEffect(() => {
-    var _a;
-    if (reveal) {
-      (_a = ref.current) == null ? void 0 : _a.scrollIntoView({ behavior: "smooth" });
-      return triggerFlash();
-    }
-  }, [reveal, triggerFlash]);
-  reactExports.useEffect(() => {
-    if (expanded && attachmentText === null && placeholder === null) {
-      setPlaceholder("Loading ...");
-      fetch(attachmentURL(attachment)).then((response) => response.text()).then((text) => {
-        setAttachmentText(text);
-        setPlaceholder(null);
-      }).catch((e) => {
-        setPlaceholder("Failed to load: " + e.message);
-      });
-    }
-  }, [expanded, attachmentText, placeholder, attachment]);
-  const snippetHeight = reactExports.useMemo(() => {
-    const lineCount = attachmentText ? attachmentText.split("\n").length : 0;
-    return Math.min(Math.max(5, lineCount), 20) * lineHeight;
-  }, [attachmentText]);
-  const title = /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { style: { marginLeft: 5 }, ref, "aria-label": attachment.name, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: linkifyText(attachment.name) }),
-    hasContent && /* @__PURE__ */ jsxRuntimeExports.jsx("a", { style: { marginLeft: 5 }, href: downloadURL(attachment), children: "download" })
-  ] });
-  if (!isTextAttachment || !hasContent)
-    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { marginLeft: 20 }, children: title });
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: clsx(flash && "yellow-flash"), children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(Expandable, { title, expanded, setExpanded, expandOnTitleClick: true, children: placeholder && /* @__PURE__ */ jsxRuntimeExports.jsx("i", { children: placeholder }) }),
-    expanded && attachmentText !== null && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "vbox", style: { height: snippetHeight }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-      CodeMirrorWrapper,
-      {
-        text: attachmentText,
-        readOnly: true,
-        mimeType: attachment.contentType,
-        linkify: true,
-        lineNumbers: true,
-        wrapLines: false
-      }
-    ) })
-  ] });
-};
-const AttachmentsTab = ({ model, revealedAttachment }) => {
-  const { diffMap, screenshots, attachments } = reactExports.useMemo(() => {
-    const attachments2 = new Set((model == null ? void 0 : model.visibleAttachments) ?? []);
-    const screenshots2 = /* @__PURE__ */ new Set();
-    const diffMap2 = /* @__PURE__ */ new Map();
-    for (const attachment of attachments2) {
-      if (!attachment.path && !attachment.sha1)
-        continue;
-      const match = attachment.name.match(/^(.*)-(expected|actual|diff)\.png$/);
-      if (match) {
-        const name = match[1];
-        const type = match[2];
-        const entry = diffMap2.get(name) || { expected: void 0, actual: void 0, diff: void 0 };
-        entry[type] = attachment;
-        diffMap2.set(name, entry);
-        attachments2.delete(attachment);
-      } else if (attachment.contentType.startsWith("image/")) {
-        screenshots2.add(attachment);
-        attachments2.delete(attachment);
-      }
-    }
-    return { diffMap: diffMap2, attachments: attachments2, screenshots: screenshots2 };
-  }, [model]);
-  if (!diffMap.size && !screenshots.size && !attachments.size)
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(PlaceholderPanel, { text: "No attachments" });
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "attachments-tab", children: [
-    [...diffMap.values()].map(({ expected, actual, diff }) => {
-      return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-        expected && actual && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "attachments-section", children: "Image diff" }),
-        expected && actual && /* @__PURE__ */ jsxRuntimeExports.jsx(ImageDiffView, { noTargetBlank: true, diff: {
-          name: "Image diff",
-          expected: { attachment: { ...expected, path: downloadURL(expected) }, title: "Expected" },
-          actual: { attachment: { ...actual, path: downloadURL(actual) } },
-          diff: diff ? { attachment: { ...diff, path: downloadURL(diff) } } : void 0
-        } })
-      ] });
-    }),
-    screenshots.size ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "attachments-section", children: "Screenshots" }) : void 0,
-    [...screenshots.values()].map((a2, i2) => {
-      const url = attachmentURL(a2);
-      return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "attachment-item", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { draggable: "false", src: url }) }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsx("a", { target: "_blank", href: url, rel: "noreferrer", children: a2.name }) })
-      ] }, `screenshot-${i2}`);
-    }),
-    attachments.size ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "attachments-section", children: "Attachments" }) : void 0,
-    [...attachments.values()].map((a2, i2) => {
-      return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "attachment-item", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-        ExpandableAttachment,
-        {
-          attachment: a2,
-          reveal: !!revealedAttachment && isEqualAttachment(a2, revealedAttachment[0]) ? revealedAttachment : void 0
-        }
-      ) }, attachmentKey(a2, i2));
-    })
-  ] });
-};
-function isEqualAttachment(a2, b2) {
-  return a2.name === b2.name && a2.path === b2.path && a2.sha1 === b2.sha1;
-}
-function attachmentURL(attachment, queryParams = {}) {
-  const params = new URLSearchParams(queryParams);
-  if (attachment.sha1) {
-    params.set("trace", attachment.traceUrl);
-    return "sha1/" + attachment.sha1 + "?" + params.toString();
-  }
-  params.set("path", attachment.path);
-  return "file?" + params.toString();
-}
-function downloadURL(attachment) {
-  const params = { dn: attachment.name };
-  if (attachment.contentType)
-    params.dct = attachment.contentType;
-  return attachmentURL(attachment, params);
-}
-function attachmentKey(attachment, index) {
-  return index + "-" + (attachment.sha1 ? `sha1-` + attachment.sha1 : `path-` + attachment.path);
-}
-const CopyPromptButton = ({ prompt }) => {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    CopyToClipboardTextButton,
-    {
-      value: prompt,
-      description: "Copy prompt",
-      copiedDescription: /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-        "Copied ",
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "codicon codicon-copy", style: { marginLeft: "5px" } })
-      ] }),
-      style: { width: "120px", justifyContent: "center" }
-    }
-  );
-};
-function useErrorsTabModel(model) {
-  return reactExports.useMemo(() => {
-    if (!model)
-      return { errors: /* @__PURE__ */ new Map() };
-    const errors = /* @__PURE__ */ new Map();
-    for (const error of model.errorDescriptors)
-      errors.set(error.message, error);
-    return { errors };
-  }, [model]);
-}
-function Error$1({ message, error, errorId, sdkLanguage, revealInSource }) {
-  var _a;
-  const [showLLM, setShowLLM] = reactExports.useState(false);
-  const llmAvailable = useIsLLMAvailable();
-  let location;
-  let longLocation;
-  const stackFrame = (_a = error.stack) == null ? void 0 : _a[0];
-  if (stackFrame) {
-    const file = stackFrame.file.replace(/.*[/\\](.*)/, "$1");
-    location = file + ":" + stackFrame.line;
-    longLocation = stackFrame.file + ":" + stackFrame.line;
-  }
-  const prompt = useAsyncMemo(async () => {
-    if (!error.prompt)
-      return;
-    const response = await fetch(attachmentURL(error.prompt));
-    return await response.text();
-  }, [error], void 0);
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", flexDirection: "column", overflowX: "clip" }, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "hbox", style: {
-      alignItems: "center",
-      padding: "5px 10px",
-      minHeight: 36,
-      fontWeight: "bold",
-      color: "var(--vscode-errorForeground)",
-      flex: 0
-    }, children: [
-      error.action && renderAction(error.action, { sdkLanguage }),
-      location && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "action-location", children: [
-        "@ ",
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { title: longLocation, onClick: () => revealInSource(error), children: location })
-      ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { position: "absolute", right: "5px" }, children: prompt && (llmAvailable ? /* @__PURE__ */ jsxRuntimeExports.jsx(FixWithAIButton, { conversationId: errorId, onChange: setShowLLM, value: showLLM, prompt }) : /* @__PURE__ */ jsxRuntimeExports.jsx(CopyPromptButton, { prompt })) })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(ErrorMessage, { error: message }),
-    showLLM && /* @__PURE__ */ jsxRuntimeExports.jsx(AIConversation, { conversationId: errorId })
-  ] });
-}
-function FixWithAIButton({ conversationId, value, onChange, prompt }) {
-  const chat = useLLMChat();
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    ToolbarButton,
-    {
-      onClick: () => {
-        if (!chat.getConversation(conversationId)) {
-          const conversation = chat.startConversation(conversationId, [
-            `My Playwright test failed. What's going wrong?`,
-            `Please give me a suggestion how to fix it, and then explain what went wrong. Be very concise and apply Playwright best practices.`,
-            `Don't include many headings in your output. Make sure what you're saying is correct, and take into account whether there might be a bug in the app.`
-          ].join("\n"));
-          let displayPrompt = `Help me with the error above.`;
-          const hasDiff = prompt.includes("Local changes:");
-          const hasSnapshot = prompt.includes("Page snapshot:");
-          if (hasDiff)
-            displayPrompt += ` Take the code diff${hasSnapshot ? " and page snapshot" : ""} into account.`;
-          else if (hasSnapshot)
-            displayPrompt += ` Take the page snapshot into account.`;
-          conversation.send(prompt, displayPrompt);
-        }
-        onChange((v2) => !v2);
-      },
-      style: { width: "96px", justifyContent: "center" },
-      title: "Fix with AI",
-      className: "copy-to-clipboard-text-button",
-      children: value ? "Hide AI" : "Fix with AI"
-    }
-  );
-}
-const ErrorsTab = ({ errorsModel, sdkLanguage, revealInSource, wallTime }) => {
-  if (!errorsModel.errors.size)
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(PlaceholderPanel, { text: "No errors" });
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fill", style: { overflow: "auto" }, children: [...errorsModel.errors.entries()].map(([message, error]) => {
-    const errorId = `error-${wallTime}-${message}`;
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(Error$1, { errorId, message, error, revealInSource, sdkLanguage }, errorId);
-  }) });
-};
-const tileSize = { width: 200, height: 45 };
-const frameMargin = 2.5;
-const rowHeight = tileSize.height + frameMargin * 2;
-const FilmStrip = ({ model, boundaries, previewPoint }) => {
-  var _a, _b;
-  const [measure, ref] = useMeasure();
-  const lanesRef = reactExports.useRef(null);
-  let pageIndex = 0;
-  if (lanesRef.current && previewPoint) {
-    const bounds = lanesRef.current.getBoundingClientRect();
-    pageIndex = (previewPoint.clientY - bounds.top + lanesRef.current.scrollTop) / rowHeight | 0;
-  }
-  const screencastFrames = (_b = (_a = model == null ? void 0 : model.pages) == null ? void 0 : _a[pageIndex]) == null ? void 0 : _b.screencastFrames;
-  let previewImage = void 0;
-  let previewSize = void 0;
-  if (previewPoint !== void 0 && screencastFrames && screencastFrames.length) {
-    const previewTime = boundaries.minimum + (boundaries.maximum - boundaries.minimum) * previewPoint.x / measure.width;
-    previewImage = screencastFrames[upperBound(screencastFrames, previewTime, timeComparator) - 1];
-    const fitInto = {
-      width: Math.min(800, window.innerWidth / 2 | 0),
-      height: Math.min(800, window.innerHeight / 2 | 0)
-    };
-    previewSize = previewImage ? inscribe({ width: previewImage.width, height: previewImage.height }, fitInto) : void 0;
-  }
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "film-strip", ref, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "film-strip-lanes", ref: lanesRef, children: model == null ? void 0 : model.pages.map((page, index) => page.screencastFrames.length ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-      FilmStripLane,
-      {
-        boundaries,
-        page,
-        width: measure.width
-      },
-      index
-    ) : null) }),
-    (previewPoint == null ? void 0 : previewPoint.x) !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "film-strip-hover", style: {
-      top: measure.bottom + 5,
-      left: Math.min(previewPoint.x, measure.width - (previewSize ? previewSize.width : 0) - 10)
-    }, children: [
-      previewPoint.action && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "film-strip-hover-title", children: renderAction(previewPoint.action, previewPoint) }),
-      previewImage && previewSize && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { width: previewSize.width, height: previewSize.height }, children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: `sha1/${previewImage.sha1}`, width: previewSize.width, height: previewSize.height }) })
-    ] })
-  ] });
-};
-const FilmStripLane = ({ boundaries, page, width }) => {
-  const viewportSize = { width: 0, height: 0 };
-  const screencastFrames = page.screencastFrames;
-  for (const frame of screencastFrames) {
-    viewportSize.width = Math.max(viewportSize.width, frame.width);
-    viewportSize.height = Math.max(viewportSize.height, frame.height);
-  }
-  const frameSize = inscribe(viewportSize, tileSize);
-  const startTime = screencastFrames[0].timestamp;
-  const endTime = screencastFrames[screencastFrames.length - 1].timestamp;
-  const boundariesDuration = boundaries.maximum - boundaries.minimum;
-  const gapLeft = (startTime - boundaries.minimum) / boundariesDuration * width;
-  const gapRight = (boundaries.maximum - endTime) / boundariesDuration * width;
-  const effectiveWidth = (endTime - startTime) / boundariesDuration * width;
-  const frameCount = effectiveWidth / (frameSize.width + 2 * frameMargin) | 0;
-  const frameDuration = (endTime - startTime) / frameCount;
-  const frames = [];
-  for (let i2 = 0; startTime && frameDuration && i2 < frameCount; ++i2) {
-    const time = startTime + frameDuration * i2;
-    const index = upperBound(screencastFrames, time, timeComparator) - 1;
-    frames.push(/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "film-strip-frame", style: {
-      width: frameSize.width,
-      height: frameSize.height,
-      backgroundImage: `url(sha1/${screencastFrames[index].sha1})`,
-      backgroundSize: `${frameSize.width}px ${frameSize.height}px`,
-      margin: frameMargin,
-      marginRight: frameMargin
-    } }, i2));
-  }
-  frames.push(/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "film-strip-frame", style: {
-    width: frameSize.width,
-    height: frameSize.height,
-    backgroundImage: `url(sha1/${screencastFrames[screencastFrames.length - 1].sha1})`,
-    backgroundSize: `${frameSize.width}px ${frameSize.height}px`,
-    margin: frameMargin,
-    marginRight: frameMargin
-  } }, frames.length));
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "film-strip-lane", style: {
-    marginLeft: gapLeft + "px",
-    marginRight: gapRight + "px"
-  }, children: frames });
-};
-function timeComparator(time, frame) {
-  return time - frame.timestamp;
-}
-function inscribe(object, area) {
-  const scale = Math.max(object.width / area.width, object.height / area.height);
-  return {
-    width: object.width / scale | 0,
-    height: object.height / scale | 0
-  };
-}
-const Timeline = ({ model, boundaries, consoleEntries, onSelected, highlightedAction, highlightedEntry, highlightedConsoleEntry, selectedTime, setSelectedTime, sdkLanguage }) => {
-  const [measure, ref] = useMeasure();
-  const [dragWindow, setDragWindow] = reactExports.useState();
-  const [previewPoint, setPreviewPoint] = reactExports.useState();
-  const { offsets, curtainLeft, curtainRight } = reactExports.useMemo(() => {
-    let activeWindow = selectedTime || boundaries;
-    if (dragWindow && dragWindow.startX !== dragWindow.endX) {
-      const time1 = positionToTime(measure.width, boundaries, dragWindow.startX);
-      const time2 = positionToTime(measure.width, boundaries, dragWindow.endX);
-      activeWindow = { minimum: Math.min(time1, time2), maximum: Math.max(time1, time2) };
-    }
-    const curtainLeft2 = timeToPosition(measure.width, boundaries, activeWindow.minimum);
-    const maxRight = timeToPosition(measure.width, boundaries, boundaries.maximum);
-    const curtainRight2 = maxRight - timeToPosition(measure.width, boundaries, activeWindow.maximum);
-    return { offsets: calculateDividerOffsets(measure.width, boundaries), curtainLeft: curtainLeft2, curtainRight: curtainRight2 };
-  }, [selectedTime, boundaries, dragWindow, measure]);
-  const bars = reactExports.useMemo(() => {
-    const bars2 = [];
-    for (const entry of (model == null ? void 0 : model.actions) || []) {
-      if (entry.class === "Test")
-        continue;
-      bars2.push({
-        action: entry,
-        leftTime: entry.startTime,
-        rightTime: entry.endTime || boundaries.maximum,
-        leftPosition: timeToPosition(measure.width, boundaries, entry.startTime),
-        rightPosition: timeToPosition(measure.width, boundaries, entry.endTime || boundaries.maximum),
-        active: false,
-        error: !!entry.error
-      });
-    }
-    for (const resource of (model == null ? void 0 : model.resources) || []) {
-      const startTime = resource._monotonicTime;
-      const endTime = resource._monotonicTime + resource.time;
-      bars2.push({
-        resource,
-        leftTime: startTime,
-        rightTime: endTime,
-        leftPosition: timeToPosition(measure.width, boundaries, startTime),
-        rightPosition: timeToPosition(measure.width, boundaries, endTime),
-        active: false,
-        error: false
-      });
-    }
-    for (const consoleMessage of consoleEntries || []) {
-      bars2.push({
-        consoleMessage,
-        leftTime: consoleMessage.timestamp,
-        rightTime: consoleMessage.timestamp,
-        leftPosition: timeToPosition(measure.width, boundaries, consoleMessage.timestamp),
-        rightPosition: timeToPosition(measure.width, boundaries, consoleMessage.timestamp),
-        active: false,
-        error: consoleMessage.isError
-      });
-    }
-    return bars2;
-  }, [model, consoleEntries, boundaries, measure]);
-  reactExports.useMemo(() => {
-    for (const bar of bars) {
-      if (highlightedAction)
-        bar.active = bar.action === highlightedAction;
-      else if (highlightedEntry)
-        bar.active = bar.resource === highlightedEntry;
-      else if (highlightedConsoleEntry)
-        bar.active = bar.consoleMessage === highlightedConsoleEntry;
-      else
-        bar.active = false;
-    }
-  }, [bars, highlightedAction, highlightedEntry, highlightedConsoleEntry]);
-  const onMouseDown = reactExports.useCallback((event) => {
-    setPreviewPoint(void 0);
-    if (!ref.current)
-      return;
-    const x2 = event.clientX - ref.current.getBoundingClientRect().left;
-    const time = positionToTime(measure.width, boundaries, x2);
-    const leftX = selectedTime ? timeToPosition(measure.width, boundaries, selectedTime.minimum) : 0;
-    const rightX = selectedTime ? timeToPosition(measure.width, boundaries, selectedTime.maximum) : 0;
-    if (selectedTime && Math.abs(x2 - leftX) < 10) {
-      setDragWindow({ startX: rightX, endX: x2, type: "resize" });
-    } else if (selectedTime && Math.abs(x2 - rightX) < 10) {
-      setDragWindow({ startX: leftX, endX: x2, type: "resize" });
-    } else if (selectedTime && time > selectedTime.minimum && time < selectedTime.maximum && event.clientY - ref.current.getBoundingClientRect().top < 20) {
-      setDragWindow({ startX: leftX, endX: rightX, pivot: x2, type: "move" });
-    } else {
-      setDragWindow({ startX: x2, endX: x2, type: "resize" });
-    }
-  }, [boundaries, measure, ref, selectedTime]);
-  const onGlassPaneMouseMove = reactExports.useCallback((event) => {
-    if (!ref.current)
-      return;
-    const x2 = event.clientX - ref.current.getBoundingClientRect().left;
-    const time = positionToTime(measure.width, boundaries, x2);
-    const action = model == null ? void 0 : model.actions.findLast((action2) => action2.startTime <= time);
-    if (!event.buttons) {
-      setDragWindow(void 0);
-      return;
-    }
-    if (action)
-      onSelected(action);
-    if (!dragWindow)
-      return;
-    let newDragWindow = dragWindow;
-    if (dragWindow.type === "resize") {
-      newDragWindow = { ...dragWindow, endX: x2 };
-    } else {
-      const delta = x2 - dragWindow.pivot;
-      let startX = dragWindow.startX + delta;
-      let endX = dragWindow.endX + delta;
-      if (startX < 0) {
-        startX = 0;
-        endX = startX + (dragWindow.endX - dragWindow.startX);
-      }
-      if (endX > measure.width) {
-        endX = measure.width;
-        startX = endX - (dragWindow.endX - dragWindow.startX);
-      }
-      newDragWindow = { ...dragWindow, startX, endX, pivot: x2 };
-    }
-    setDragWindow(newDragWindow);
-    const time1 = positionToTime(measure.width, boundaries, newDragWindow.startX);
-    const time2 = positionToTime(measure.width, boundaries, newDragWindow.endX);
-    if (time1 !== time2)
-      setSelectedTime({ minimum: Math.min(time1, time2), maximum: Math.max(time1, time2) });
-  }, [boundaries, dragWindow, measure, model, onSelected, ref, setSelectedTime]);
-  const onGlassPaneMouseUp = reactExports.useCallback(() => {
-    setPreviewPoint(void 0);
-    if (!dragWindow)
-      return;
-    if (dragWindow.startX !== dragWindow.endX) {
-      const time1 = positionToTime(measure.width, boundaries, dragWindow.startX);
-      const time2 = positionToTime(measure.width, boundaries, dragWindow.endX);
-      setSelectedTime({ minimum: Math.min(time1, time2), maximum: Math.max(time1, time2) });
-    } else {
-      const time = positionToTime(measure.width, boundaries, dragWindow.startX);
-      const action = model == null ? void 0 : model.actions.findLast((action2) => action2.startTime <= time);
-      if (action)
-        onSelected(action);
-      setSelectedTime(void 0);
-    }
-    setDragWindow(void 0);
-  }, [boundaries, dragWindow, measure, model, setSelectedTime, onSelected]);
-  const onMouseMove = reactExports.useCallback((event) => {
-    if (!ref.current)
-      return;
-    const x2 = event.clientX - ref.current.getBoundingClientRect().left;
-    const time = positionToTime(measure.width, boundaries, x2);
-    const action = model == null ? void 0 : model.actions.findLast((action2) => action2.startTime <= time);
-    setPreviewPoint({ x: x2, clientY: event.clientY, action, sdkLanguage });
-  }, [boundaries, measure, model, ref, sdkLanguage]);
-  const onMouseLeave = reactExports.useCallback(() => {
-    setPreviewPoint(void 0);
-  }, []);
-  const onPaneDoubleClick = reactExports.useCallback(() => {
-    setSelectedTime(void 0);
-  }, [setSelectedTime]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { flex: "none", borderBottom: "1px solid var(--vscode-panel-border)" }, children: [
-    !!dragWindow && /* @__PURE__ */ jsxRuntimeExports.jsx(
-      GlassPane,
-      {
-        cursor: (dragWindow == null ? void 0 : dragWindow.type) === "resize" ? "ew-resize" : "grab",
-        onPaneMouseUp: onGlassPaneMouseUp,
-        onPaneMouseMove: onGlassPaneMouseMove,
-        onPaneDoubleClick
-      }
-    ),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      "div",
-      {
-        ref,
-        className: "timeline-view",
-        onMouseDown,
-        onMouseMove,
-        onMouseLeave,
-        children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "timeline-grid", children: offsets.map((offset, index) => {
-            return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "timeline-divider", style: { left: offset.position + "px" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "timeline-time", children: msToString(offset.time - boundaries.minimum) }) }, index);
-          }) }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { height: 8 } }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(FilmStrip, { model, boundaries, previewPoint }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "timeline-bars", children: bars.map((bar, index) => {
-            return /* @__PURE__ */ jsxRuntimeExports.jsx(
-              "div",
-              {
-                className: clsx(
-                  "timeline-bar",
-                  bar.action && "action",
-                  bar.resource && "network",
-                  bar.consoleMessage && "console-message",
-                  bar.active && "active",
-                  bar.error && "error"
-                ),
-                style: {
-                  left: bar.leftPosition,
-                  width: Math.max(5, bar.rightPosition - bar.leftPosition),
-                  top: barTop(bar),
-                  bottom: 0
-                }
-              },
-              index
-            );
-          }) }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "timeline-marker", style: {
-            display: previewPoint !== void 0 ? "block" : "none",
-            left: ((previewPoint == null ? void 0 : previewPoint.x) || 0) + "px"
-          } }),
-          selectedTime && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "timeline-window", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "timeline-window-curtain left", style: { width: curtainLeft } }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "timeline-window-resizer", style: { left: -5 } }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "timeline-window-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "timeline-window-drag" }) }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "timeline-window-resizer", style: { left: 5 } }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "timeline-window-curtain right", style: { width: curtainRight } })
-          ] })
-        ]
-      }
-    )
-  ] });
-};
-function calculateDividerOffsets(clientWidth, boundaries) {
-  const minimumGap = 64;
-  let dividerCount = clientWidth / minimumGap;
-  const boundarySpan = boundaries.maximum - boundaries.minimum;
-  const pixelsPerMillisecond = clientWidth / boundarySpan;
-  let sectionTime = boundarySpan / dividerCount;
-  const logSectionTime = Math.ceil(Math.log(sectionTime) / Math.LN10);
-  sectionTime = Math.pow(10, logSectionTime);
-  if (sectionTime * pixelsPerMillisecond >= 5 * minimumGap)
-    sectionTime = sectionTime / 5;
-  if (sectionTime * pixelsPerMillisecond >= 2 * minimumGap)
-    sectionTime = sectionTime / 2;
-  const firstDividerTime = boundaries.minimum;
-  let lastDividerTime = boundaries.maximum;
-  lastDividerTime += minimumGap / pixelsPerMillisecond;
-  dividerCount = Math.ceil((lastDividerTime - firstDividerTime) / sectionTime);
-  if (!sectionTime)
-    dividerCount = 0;
-  const offsets = [];
-  for (let i2 = 0; i2 < dividerCount; ++i2) {
-    const time = firstDividerTime + sectionTime * i2;
-    offsets.push({ position: timeToPosition(clientWidth, boundaries, time), time });
-  }
-  return offsets;
-}
-function timeToPosition(clientWidth, boundaries, time) {
-  return (time - boundaries.minimum) / (boundaries.maximum - boundaries.minimum) * clientWidth;
-}
-function positionToTime(clientWidth, boundaries, x2) {
-  return x2 / clientWidth * (boundaries.maximum - boundaries.minimum) + boundaries.minimum;
-}
-function barTop(bar) {
-  return bar.resource ? 25 : 20;
-}
-const MetadataView = ({ model }) => {
-  var _a, _b;
-  if (!model)
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {});
-  const wallTime = model.wallTime !== void 0 ? new Date(model.wallTime).toLocaleString(void 0, { timeZoneName: "short" }) : void 0;
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { "data-testid": "metadata-view", className: "vbox", style: { flexShrink: 0 }, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "call-section", style: { paddingTop: 2 }, children: "Time" }),
-    !!wallTime && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-      "start time:",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value datetime", title: wallTime, children: wallTime })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-      "duration:",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value number", title: msToString(model.endTime - model.startTime), children: msToString(model.endTime - model.startTime) })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "call-section", children: "Browser" }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-      "engine:",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value string", title: model.browserName, children: model.browserName })
-    ] }),
-    model.channel && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-      "channel:",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value string", title: model.channel, children: model.channel })
-    ] }),
-    model.platform && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-      "platform:",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value string", title: model.platform, children: model.platform })
-    ] }),
-    model.options.userAgent && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-      "user agent:",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value datetime", title: model.options.userAgent, children: model.options.userAgent })
-    ] }),
-    model.options.baseURL && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "call-section", style: { paddingTop: 2 }, children: "Config" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-        "baseURL:",
-        /* @__PURE__ */ jsxRuntimeExports.jsx("a", { className: "call-value string", href: model.options.baseURL, title: model.options.baseURL, target: "_blank", rel: "noopener noreferrer", children: model.options.baseURL })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "call-section", children: "Viewport" }),
-    model.options.viewport && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-      "width:",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value number", title: String(!!((_a = model.options.viewport) == null ? void 0 : _a.width)), children: model.options.viewport.width })
-    ] }),
-    model.options.viewport && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-      "height:",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value number", title: String(!!((_b = model.options.viewport) == null ? void 0 : _b.height)), children: model.options.viewport.height })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-      "is mobile:",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value boolean", title: String(!!model.options.isMobile), children: String(!!model.options.isMobile) })
-    ] }),
-    model.options.deviceScaleFactor && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-      "device scale:",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value number", title: String(model.options.deviceScaleFactor), children: String(model.options.deviceScaleFactor) })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "call-section", children: "Counts" }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-      "pages:",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value number", children: model.pages.length })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-      "actions:",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value number", children: model.actions.length })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "call-line", children: [
-      "events:",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "call-value number", children: model.events.length })
-    ] })
-  ] });
-};
-const AnnotationsTab = ({ annotations }) => {
-  if (!annotations.length)
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(PlaceholderPanel, { text: "No annotations" });
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "annotations-tab", children: annotations.map((annotation, i2) => {
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "annotation-item", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontWeight: "bold" }, children: annotation.type }),
-      annotation.description && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
-        ": ",
-        linkifyText(annotation.description)
-      ] })
-    ] }, `annotation-${i2}`);
-  }) });
-};
-const Workbench = ({ model, showSourcesFirst, rootDir, fallbackLocation, isLive, hideTimeline, status, annotations, inert, onOpenExternally, revealSource }) => {
-  var _a;
-  const [selectedCallId, setSelectedCallId] = reactExports.useState(void 0);
-  const [revealedError, setRevealedError] = reactExports.useState(void 0);
-  const [revealedAttachment, setRevealedAttachment] = reactExports.useState(void 0);
-  const [highlightedCallId, setHighlightedCallId] = reactExports.useState();
-  const [highlightedEntry, setHighlightedEntry] = reactExports.useState();
-  const [highlightedConsoleMessage, setHighlightedConsoleMessage] = reactExports.useState();
-  const [selectedNavigatorTab, setSelectedNavigatorTab] = reactExports.useState("actions");
-  const [selectedPropertiesTab, setSelectedPropertiesTab] = useSetting("propertiesTab", showSourcesFirst ? "source" : "call");
-  const [isInspecting, setIsInspectingState] = reactExports.useState(false);
-  const [highlightedElement, setHighlightedElement] = reactExports.useState({ lastEdited: "none" });
-  const [selectedTime, setSelectedTime] = reactExports.useState();
-  const [sidebarLocation, setSidebarLocation] = useSetting("propertiesSidebarLocation", "bottom");
-  const showScreenshot = false;
-  const setSelectedAction = reactExports.useCallback((action) => {
-    setSelectedCallId(action == null ? void 0 : action.callId);
-    setRevealedError(void 0);
-  }, []);
-  const highlightedAction = reactExports.useMemo(() => {
-    return model == null ? void 0 : model.actions.find((a2) => a2.callId === highlightedCallId);
-  }, [model, highlightedCallId]);
-  const setHighlightedAction = reactExports.useCallback((highlightedAction2) => {
-    setHighlightedCallId(highlightedAction2 == null ? void 0 : highlightedAction2.callId);
-  }, []);
-  const sources = reactExports.useMemo(() => (model == null ? void 0 : model.sources) || /* @__PURE__ */ new Map(), [model]);
-  reactExports.useEffect(() => {
-    setSelectedTime(void 0);
-    setRevealedError(void 0);
-  }, [model]);
-  const selectedAction = reactExports.useMemo(() => {
-    if (selectedCallId) {
-      const action = model == null ? void 0 : model.actions.find((a2) => a2.callId === selectedCallId);
-      if (action)
-        return action;
-    }
-    const failedAction = model == null ? void 0 : model.failedAction();
-    if (failedAction)
-      return failedAction;
-    if (model == null ? void 0 : model.actions.length) {
-      let index = model.actions.length - 1;
-      for (let i2 = 0; i2 < model.actions.length; ++i2) {
-        if (model.actions[i2].apiName === "After Hooks" && i2) {
-          index = i2 - 1;
-          break;
-        }
-      }
-      return model.actions[index];
-    }
-  }, [model, selectedCallId]);
-  const activeAction = reactExports.useMemo(() => {
-    return highlightedAction || selectedAction;
-  }, [selectedAction, highlightedAction]);
-  const revealedStack = reactExports.useMemo(() => {
-    if (revealedError)
-      return revealedError.stack;
-    return activeAction == null ? void 0 : activeAction.stack;
-  }, [activeAction, revealedError]);
-  const onActionSelected = reactExports.useCallback((action) => {
-    setSelectedAction(action);
-    setHighlightedAction(void 0);
-  }, [setSelectedAction, setHighlightedAction]);
-  const selectPropertiesTab = reactExports.useCallback((tab) => {
-    setSelectedPropertiesTab(tab);
-    if (tab !== "inspector")
-      setIsInspectingState(false);
-  }, [setSelectedPropertiesTab]);
-  const setIsInspecting = reactExports.useCallback((value) => {
-    if (!isInspecting && value)
-      selectPropertiesTab("inspector");
-    setIsInspectingState(value);
-  }, [setIsInspectingState, selectPropertiesTab, isInspecting]);
-  const elementPicked = reactExports.useCallback((element) => {
-    setHighlightedElement(element);
-    selectPropertiesTab("inspector");
-  }, [selectPropertiesTab]);
-  const revealAttachment = reactExports.useCallback((attachment) => {
-    selectPropertiesTab("attachments");
-    setRevealedAttachment((currentValue) => {
-      if (!currentValue)
-        return [attachment, 0];
-      const revealCounter = currentValue[1];
-      return [attachment, revealCounter + 1];
-    });
-  }, [selectPropertiesTab]);
-  reactExports.useEffect(() => {
-    if (revealSource)
-      selectPropertiesTab("source");
-  }, [revealSource, selectPropertiesTab]);
-  const consoleModel = useConsoleTabModel(model, selectedTime);
-  const networkModel = useNetworkTabModel(model, selectedTime);
-  const errorsModel = useErrorsTabModel(model);
-  const sdkLanguage = (model == null ? void 0 : model.sdkLanguage) || "javascript";
-  const inspectorTab = {
-    id: "inspector",
-    title: "Locator",
-    render: () => /* @__PURE__ */ jsxRuntimeExports.jsx(
-      InspectorTab,
-      {
-        showScreenshot,
-        sdkLanguage,
-        setIsInspecting,
-        highlightedElement,
-        setHighlightedElement
-      }
-    )
-  };
-  const callTab = {
-    id: "call",
-    title: "Call",
-    render: () => /* @__PURE__ */ jsxRuntimeExports.jsx(CallTab, { action: activeAction, startTimeOffset: (model == null ? void 0 : model.startTime) ?? 0, sdkLanguage })
-  };
-  const logTab = {
-    id: "log",
-    title: "Log",
-    render: () => /* @__PURE__ */ jsxRuntimeExports.jsx(LogTab, { action: activeAction, isLive })
-  };
-  const errorsTab = {
-    id: "errors",
-    title: "Errors",
-    errorCount: errorsModel.errors.size,
-    render: () => /* @__PURE__ */ jsxRuntimeExports.jsx(ErrorsTab, { errorsModel, sdkLanguage, revealInSource: (error) => {
-      if (error.action)
-        setSelectedAction(error.action);
-      else
-        setRevealedError(error);
-      selectPropertiesTab("source");
-    }, wallTime: (model == null ? void 0 : model.wallTime) ?? 0 })
-  };
-  let fallbackSourceErrorCount = void 0;
-  if (!selectedAction && fallbackLocation)
-    fallbackSourceErrorCount = (_a = fallbackLocation.source) == null ? void 0 : _a.errors.length;
-  const sourceTab = {
-    id: "source",
-    title: "Source",
-    errorCount: fallbackSourceErrorCount,
-    render: () => /* @__PURE__ */ jsxRuntimeExports.jsx(
-      SourceTab,
-      {
-        stack: revealedStack,
-        sources,
-        rootDir,
-        stackFrameLocation: sidebarLocation === "bottom" ? "right" : "bottom",
-        fallbackLocation,
-        onOpenExternally
-      }
-    )
-  };
-  const consoleTab = {
-    id: "console",
-    title: "Console",
-    count: consoleModel.entries.length,
-    render: () => /* @__PURE__ */ jsxRuntimeExports.jsx(
-      ConsoleTab,
-      {
-        consoleModel,
-        boundaries,
-        selectedTime,
-        onAccepted: (m2) => setSelectedTime({ minimum: m2.timestamp, maximum: m2.timestamp }),
-        onEntryHovered: setHighlightedConsoleMessage
-      }
-    )
-  };
-  const networkTab = {
-    id: "network",
-    title: "Network",
-    count: networkModel.resources.length,
-    render: () => /* @__PURE__ */ jsxRuntimeExports.jsx(NetworkTab, { boundaries, networkModel, onEntryHovered: setHighlightedEntry, sdkLanguage: (model == null ? void 0 : model.sdkLanguage) ?? "javascript" })
-  };
-  const attachmentsTab = {
-    id: "attachments",
-    title: "Attachments",
-    count: model == null ? void 0 : model.visibleAttachments.length,
-    render: () => /* @__PURE__ */ jsxRuntimeExports.jsx(AttachmentsTab, { model, revealedAttachment })
-  };
-  const tabs = [
-    inspectorTab,
-    callTab,
-    logTab,
-    errorsTab,
-    consoleTab,
-    networkTab,
-    sourceTab,
-    attachmentsTab
-  ];
-  if (annotations !== void 0) {
-    const annotationsTab = {
-      id: "annotations",
-      title: "Annotations",
-      count: annotations.length,
-      render: () => /* @__PURE__ */ jsxRuntimeExports.jsx(AnnotationsTab, { annotations })
-    };
-    tabs.push(annotationsTab);
-  }
-  if (showSourcesFirst) {
-    const sourceTabIndex = tabs.indexOf(sourceTab);
-    tabs.splice(sourceTabIndex, 1);
-    tabs.splice(1, 0, sourceTab);
-  }
-  const { boundaries } = reactExports.useMemo(() => {
-    const boundaries2 = { minimum: (model == null ? void 0 : model.startTime) || 0, maximum: (model == null ? void 0 : model.endTime) || 3e4 };
-    if (boundaries2.minimum > boundaries2.maximum) {
-      boundaries2.minimum = 0;
-      boundaries2.maximum = 3e4;
-    }
-    boundaries2.maximum += (boundaries2.maximum - boundaries2.minimum) / 20;
-    return { boundaries: boundaries2 };
-  }, [model]);
-  let time = 0;
-  if (!isLive && model && model.endTime >= 0)
-    time = model.endTime - model.startTime;
-  else if (model && model.wallTime)
-    time = Date.now() - model.wallTime;
-  const actionsTab = {
-    id: "actions",
-    title: "Actions",
-    component: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "vbox", children: [
-      status && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "workbench-run-status", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: clsx("codicon", testStatusIcon(status)) }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: testStatusText(status) }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "spacer" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "workbench-run-duration", children: time ? msToString(time) : "" })
-      ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        ActionList,
-        {
-          sdkLanguage,
-          actions: (model == null ? void 0 : model.actions) || [],
-          selectedAction: model ? selectedAction : void 0,
-          selectedTime,
-          setSelectedTime,
-          onSelected: onActionSelected,
-          onHighlighted: setHighlightedAction,
-          revealAttachment,
-          revealConsole: () => selectPropertiesTab("console"),
-          isLive
-        }
-      )
-    ] })
-  };
-  const metadataTab = {
-    id: "metadata",
-    title: "Metadata",
-    component: /* @__PURE__ */ jsxRuntimeExports.jsx(MetadataView, { model })
-  };
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "vbox workbench", ...inert ? { inert: "true" } : {}, children: [
-    !hideTimeline && /* @__PURE__ */ jsxRuntimeExports.jsx(
-      Timeline,
-      {
-        model,
-        consoleEntries: consoleModel.entries,
-        boundaries,
-        highlightedAction,
-        highlightedEntry,
-        highlightedConsoleEntry: highlightedConsoleMessage,
-        onSelected: onActionSelected,
-        sdkLanguage,
-        selectedTime,
-        setSelectedTime
-      }
-    ),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(
-      SplitView,
-      {
-        sidebarSize: 250,
-        orientation: sidebarLocation === "bottom" ? "vertical" : "horizontal",
-        settingName: "propertiesSidebar",
-        main: /* @__PURE__ */ jsxRuntimeExports.jsx(
-          SplitView,
-          {
-            sidebarSize: 250,
-            orientation: "horizontal",
-            sidebarIsFirst: true,
-            settingName: "actionListSidebar",
-            main: /* @__PURE__ */ jsxRuntimeExports.jsx(
-              SnapshotTabsView,
-              {
-                action: activeAction,
-                model,
-                sdkLanguage,
-                testIdAttributeName: (model == null ? void 0 : model.testIdAttributeName) || "data-testid",
-                isInspecting,
-                setIsInspecting,
-                highlightedElement,
-                setHighlightedElement: elementPicked
-              }
-            ),
-            sidebar: /* @__PURE__ */ jsxRuntimeExports.jsx(
-              TabbedPane,
-              {
-                tabs: [actionsTab, metadataTab],
-                selectedTab: selectedNavigatorTab,
-                setSelectedTab: setSelectedNavigatorTab
-              }
-            )
-          }
-        ),
-        sidebar: /* @__PURE__ */ jsxRuntimeExports.jsx(
-          TabbedPane,
-          {
-            tabs,
-            selectedTab: selectedPropertiesTab,
-            setSelectedTab: selectPropertiesTab,
-            rightToolbar: [
-              sidebarLocation === "bottom" ? /* @__PURE__ */ jsxRuntimeExports.jsx(ToolbarButton, { title: "Dock to right", icon: "layout-sidebar-right-off", onClick: () => {
-                setSidebarLocation("right");
-              } }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ToolbarButton, { title: "Dock to bottom", icon: "layout-panel-off", onClick: () => {
-                setSidebarLocation("bottom");
-              } })
-            ],
-            mode: sidebarLocation === "bottom" ? "default" : "select"
-          }
-        )
-      }
-    )
-  ] });
-};
-export {
-  Expandable as E,
-  LLMProvider as L,
-  TreeView as T,
-  Workbench as W,
-  EventEmitter as a,
-  testStatusIcon as t
-};
-//# sourceMappingURL=workbench-CWZselvp.js.map