@opengeni/react 7.4.0-canary.36855269964001 → 7.4.0

package/src/components/browser-viewer.tsx

@@ -208,11 +208,6 @@ export function BrowserViewer({
     () => registry.relevantSessions.filter((session) => isLiveBrowser(session)),
     [registry.relevantSessions],
   );
-  const latestRelevantBrowser = registry.relevantSessions[0];
-  const unavailableBrowser =
-    latestRelevantBrowser?.lifecycle === "lost" || latestRelevantBrowser?.lifecycle === "failed"
-      ? latestRelevantBrowser
-      : undefined;
   const [selection, setSelection] = useState<BrowserSelection>(() =>
     initialBrowserSessionId ? { sessionId: initialBrowserSessionId, pinned: true } : null,
   );
@@ -774,8 +769,7 @@ export function BrowserViewer({
     );
   }
   if (liveSessions.length === 0) {
-    if (renderEmpty && !unavailableBrowser)
-      return <>{renderEmpty(() => createBrowser(), creating)}</>;
+    if (renderEmpty) return <>{renderEmpty(() => createBrowser(), creating)}</>;
     return (
       <div
         className={cn("flex h-full min-h-0 items-center justify-center bg-og-bg p-6", className)}
@@ -784,22 +778,16 @@ export function BrowserViewer({
           <span className="mx-auto grid size-10 place-items-center rounded-og-md border border-og-border bg-og-surface-1 text-og-fg-muted">
             <Globe2Icon className="size-4.5" />
           </span>
-          {unavailableBrowser && !attachedGenerationLoss ? (
-            <BrowserUnavailableNotice session={unavailableBrowser} />
-          ) : (
-            <>
-              <p className="mt-3 text-og-menu font-medium text-og-fg">
-                {attachedGenerationLoss
-                  ? "Chrome reconnected—open a fresh browser/desktop."
-                  : "No browser open"}
-              </p>
-              <p className="mt-1 text-og-control leading-5 text-og-fg-muted">
-                {attachedGenerationLoss
-                  ? "This Chrome profile is live again, but the previous browser cannot move to the new connection. Use Browser → New browser → Connected Chrome."
-                  : "A browser appears here when this agent—or another agent in the workspace—opens one."}
-              </p>
-            </>
-          )}
+          <p className="mt-3 text-og-menu font-medium text-og-fg">
+            {attachedGenerationLoss
+              ? "Chrome reconnected—open a fresh browser/desktop."
+              : "No browser open"}
+          </p>
+          <p className="mt-1 text-og-control leading-5 text-og-fg-muted">
+            {attachedGenerationLoss
+              ? "This Chrome profile is live again, but the previous browser cannot move to the new connection. Use Browser → New browser → Connected Chrome."
+              : "A browser appears here when this agent—or another agent in the workspace—opens one."}
+          </p>
           <BrowserLaunchMenu
             attachedBridges={onlineAttachedBridges}
             attachedDevices={attached.devices}
@@ -867,7 +855,6 @@ export function BrowserViewer({
       />
       {!selectedRegistrySession ? (
         <BrowserUnselectedPanel
-          unavailableBrowser={unavailableBrowser}
           peerCount={liveSessions.length}
           creating={creating}
           onCreate={() => createBrowser()}
@@ -1199,7 +1186,6 @@ function BrowserToolbar(props: {
 }
 
 function BrowserUnselectedPanel(props: {
-  unavailableBrowser: BrowserSession | undefined;
   peerCount: number;
   creating: boolean;
   onCreate: () => void;
@@ -1210,11 +1196,7 @@ function BrowserUnselectedPanel(props: {
         <span className="mx-auto grid size-10 place-items-center rounded-og-md border border-og-border bg-og-surface-1 text-og-fg-muted">
           <Globe2Icon className="size-4.5" />
         </span>
-        {props.unavailableBrowser ? (
-          <BrowserUnavailableNotice session={props.unavailableBrowser} />
-        ) : (
-          <p className="mt-3 text-og-menu font-medium text-og-fg">No browser for this agent</p>
-        )}
+        <p className="mt-3 text-og-menu font-medium text-og-fg">No browser for this agent</p>
         <p className="mt-1 text-og-control leading-5 text-og-fg-muted">
           {props.peerCount === 1
             ? "One workspace browser is available from the browser menu."
@@ -1234,25 +1216,6 @@ function BrowserUnselectedPanel(props: {
   );
 }
 
-function BrowserUnavailableNotice({ session }: { session: BrowserSession }) {
-  const reason =
-    session.failureCode === "provider_deadline_rotation"
-      ? "The computer running it reached its time limit."
-      : session.failureCode === "source_placement_changed"
-        ? "This chat moved to another computer."
-        : session.lifecycle === "failed"
-          ? "It stopped unexpectedly."
-          : "The connection to it was lost.";
-  return (
-    <div role="status">
-      <p className="mt-3 text-og-menu font-medium text-og-fg">Browser unavailable</p>
-      <p className="mt-1 break-words text-og-control leading-5 text-og-fg-muted">
-        {session.name}. {reason} Open a new browser to continue.
-      </p>
-    </div>
-  );
-}
-
 function BrowserSessionGroup(props: {
   label: string;
   sessions: BrowserSession[];
@@ -1756,8 +1719,7 @@ function BrowserProfileMenu(props: {
         ) : null}
         {canSave ? (
           <p className="mt-2 text-[10px] leading-4 text-og-fg-subtle">
-            Saving restarts this browser. Save unfinished work on its pages first; unsaved form
-            entries may be lost. Other open browsers are unchanged.
+            Saving briefly restarts this browser. Other open browsers are unchanged.
           </p>
         ) : null}
       </div>
@@ -1948,7 +1910,6 @@ function BrowserViewport(props: {
     controllerGeneration: string;
     targetId: string;
     fencedInputBatches?: true | undefined;
-    focusedInputObservations?: true | undefined;
     expiresAt: string;
   } | null;
   activityLabel?: string | undefined;
@@ -2001,7 +1962,6 @@ function BrowserViewport(props: {
   } | null>(null);
   const actionRef = useRef(props.onAction);
   const readClipboardRef = useRef(props.onReadClipboard);
-  const observeInputRef = useRef(props.onObserveForInput);
   const errorRef = useRef(props.onError);
   const actionTailRef = useRef<Promise<void>>(Promise.resolve());
   const actionQueueEpochRef = useRef(0);
@@ -2018,7 +1978,6 @@ function BrowserViewport(props: {
   const mountedRef = useRef(true);
   actionRef.current = props.onAction;
   readClipboardRef.current = props.onReadClipboard;
-  observeInputRef.current = props.onObserveForInput;
   errorRef.current = props.onError;
 
   const clearBufferedInput = useCallback(() => {
@@ -2195,23 +2154,8 @@ function BrowserViewport(props: {
           // frame from that render even when its input fence contains no bytes.
           const receipt = await actionRef.current(dispatchedAction, frame);
           if (!mountedRef.current || epoch !== actionQueueEpochRef.current) return;
-          // Alt+Down explicitly opens a native dropdown from the keyboard.
-          // Existing controllers return focused-input metadata for clicks only,
-          // so use the ordinary authorized read for this explicit gesture.
-          const keyboardSelect =
-            dispatchedAction.type === "press" && dispatchedAction.key === "Alt+ArrowDown";
-          if ((selectAnchor || keyboardSelect) && inputSequence === inputSequenceRef.current) {
-            const observation = keyboardSelect
-              ? await observeInputRef.current()
-              : receipt.observation;
-            if (
-              mountedRef.current &&
-              epoch === actionQueueEpochRef.current &&
-              inputSequence === inputSequenceRef.current &&
-              observation
-            ) {
-              setSelectPopup({ observation, anchor: selectAnchor ?? null });
-            }
+          if (selectAnchor && receipt.observation && inputSequence === inputSequenceRef.current) {
+            setSelectPopup({ observation: receipt.observation, anchor: selectAnchor });
           }
           await after?.(receipt);
         })
@@ -2504,7 +2448,6 @@ function BrowserViewport(props: {
         onPaste={paste}
         className="pointer-events-none absolute left-1/2 top-1/2 size-px resize-none overflow-hidden opacity-0"
         aria-label="Browser keyboard input"
-        aria-keyshortcuts="Alt+ArrowDown"
         autoCapitalize="off"
         autoCorrect="off"
         spellCheck={false}
@@ -2524,7 +2467,6 @@ function BrowserViewport(props: {
       ) : null}
       {showCanvas ? (
         <BrowserSelectControl
-          manualFallback={props.inputBatchAttachment?.focusedInputObservations !== true}
           activation={selectPopup}
           onDismiss={() => inputRef.current?.focus({ preventScroll: true })}
           observe={async () => {
@@ -2798,14 +2740,13 @@ function BrowserDiagnosticsDrawer(props: {
             id="browser-page-title"
             className="text-[10px] font-semibold uppercase tracking-[0.14em] text-og-fg-subtle"
           >
-            Tab diagnostics
+            Current page
           </h3>
-          <p className="mt-1 text-og-xs text-og-fg-subtle">Includes earlier pages in this tab.</p>
           <dl className="mt-2 grid grid-cols-2 gap-2">
-            <DiagnosticCount label="Console errors" value={diagnostics?.consoleErrorCount} />
-            <DiagnosticCount label="Page errors" value={diagnostics?.pageErrorCount} />
-            <DiagnosticCount label="Failed requests" value={diagnostics?.failedRequestCount} />
-            <DiagnosticCount label="Downloads" value={diagnostics?.downloadCount} />
+            <DiagnosticCount label="Console errors" value={diagnostics?.consoleErrorCount ?? 0} />
+            <DiagnosticCount label="Page errors" value={diagnostics?.pageErrorCount ?? 0} />
+            <DiagnosticCount label="Failed requests" value={diagnostics?.failedRequestCount ?? 0} />
+            <DiagnosticCount label="Downloads" value={diagnostics?.downloadCount ?? 0} />
           </dl>
           {session?.failureCode ? (
             <p className="mt-2 rounded-og-sm border border-og-status-error/30 bg-og-status-error/5 px-2.5 py-2 text-og-xs text-og-danger">
@@ -3103,7 +3044,7 @@ function DiagnosticFact(props: { label: string; value: string }) {
   );
 }
 
-function DiagnosticCount(props: { label: string; value: number | undefined }) {
+function DiagnosticCount(props: { label: string; value: number }) {
   return (
     <div className="rounded-og-sm border border-og-border bg-og-bg px-2.5 py-2">
       <dt className="text-[10px] text-og-fg-subtle">{props.label}</dt>
@@ -3113,7 +3054,7 @@ function DiagnosticCount(props: { label: string; value: number | undefined }) {
           props.value ? "text-og-fg" : "text-og-fg-muted",
         )}
       >
-        {props.value ?? "Unavailable"}
+        {props.value}
       </dd>
     </div>
   );

package/src/components/computer-viewer.tsx

@@ -289,19 +289,13 @@ export function ComputerViewer({
       : null;
   const rfbStream =
     frames.attachment?.stream.kind === "direct_rfb" ? frames.attachment.stream : null;
-  const machineLocked = selectedRegistrySession?.failureCode === "machine_locked";
-  // RFB has one combined input switch; partial native input stays view-only.
-  const rfbInputEnabled =
-    !machineLocked &&
-    computer.session?.capabilities?.pointerInput === true &&
-    computer.session?.capabilities?.keyboardInput === true;
   const rfbCapability = useMemo<DesktopStreamCapability | null>(() => {
     if (!rfbStream || !frames.attachment) return null;
     const bounds = computer.selectedTarget?.bounds;
     return {
       transport: "vnc-ws",
       client: "novnc",
-      mode: rfbInputEnabled ? "interactive" : "read-only",
+      mode: "interactive",
       url: rfbStream.url,
       token: null,
       expiresAt: frames.attachment.expiresAt,
@@ -313,7 +307,8 @@ export function ComputerViewer({
       sharedSessionIds: [],
       reason: null,
     };
-  }, [computer.selectedTarget?.bounds, frames.attachment, rfbInputEnabled, rfbStream]);
+  }, [computer.selectedTarget?.bounds, frames.attachment, rfbStream]);
+  const machineLocked = selectedRegistrySession?.failureCode === "machine_locked";
   const currentIds = useMemo(() => new Set(relevant.map((session) => session.id)), [relevant]);
 
   useEffect(() => {
@@ -457,8 +452,7 @@ export function ComputerViewer({
 
   const copyFromRfb = useCallback(
     (event: ClipboardEvent<HTMLDivElement>) => {
-      if (!rfbInputEnabled || !rfbStream || computer.session?.capabilities?.clipboard !== true)
-        return;
+      if (!rfbStream || computer.session?.capabilities?.clipboard !== true) return;
       event.preventDefault();
       event.stopPropagation();
       void perform({ type: "clipboard", operation: "copy" }, null)
@@ -470,13 +464,12 @@ export function ComputerViewer({
         })
         .catch((cause) => notifyError(cause, "Could not copy from the desktop."));
     },
-    [computer, notifyError, perform, rfbInputEnabled, rfbStream],
+    [computer, notifyError, perform, rfbStream],
   );
 
   const pasteIntoRfb = useCallback(
     (text: string): boolean => {
-      if (!rfbInputEnabled || !rfbStream || computer.session?.capabilities?.clipboard !== true)
-        return false;
+      if (!rfbStream || computer.session?.capabilities?.clipboard !== true) return false;
       // Keep paste on the canonical ComputerSession action path. RFB
       // ClientCutText synchronization varies by server and can acknowledge a
       // local paste without ever updating the remote graphical seat. These two
@@ -491,7 +484,7 @@ export function ComputerViewer({
       })().catch((cause) => notifyError(cause, "Could not paste into the desktop."));
       return true;
     },
-    [computer, notifyError, perform, rfbInputEnabled, rfbStream],
+    [computer, notifyError, perform, rfbStream],
   );
 
   const hideGenericCreate = suppressGenericCreate && liveRelevant.length === 0;
@@ -630,18 +623,13 @@ export function ComputerViewer({
               <div className="relative min-h-0 flex-1 bg-black" onCopyCapture={copyFromRfb}>
                 <DesktopViewer
                   capability={rfbCapability}
-                  interactive={rfbInputEnabled}
+                  interactive
                   showControlToggle={false}
                   webSocketProtocols={rfbStream.protocols}
                   onPasteText={pasteIntoRfb}
                   targetPlatform={computer.session?.platform ?? null}
                   className="h-full"
                 />
-                {!rfbInputEnabled ? (
-                  <div className="pointer-events-none absolute bottom-3 left-1/2 -translate-x-1/2 rounded-full border border-white/10 bg-black/70 px-3 py-1 text-[11px] text-white/80 backdrop-blur">
-                    View only · direct input unavailable
-                  </div>
-                ) : null}
               </div>
             ) : (
               <ComputerViewport
@@ -660,8 +648,6 @@ export function ComputerViewer({
                 mutating={computer.mutating}
                 backgroundActions={computer.session?.capabilities?.backgroundActions === true}
                 clipboardEnabled={computer.session?.capabilities?.clipboard === true}
-                pointerInput={computer.session?.capabilities?.pointerInput === true}
-                keyboardInput={computer.session?.capabilities?.keyboardInput === true}
                 onAction={perform}
                 onReadClipboard={computer.readClipboard}
                 onReconnect={
@@ -1025,8 +1011,6 @@ function ComputerViewport(props: {
   mutating: boolean;
   backgroundActions: boolean;
   clipboardEnabled: boolean;
-  pointerInput: boolean;
-  keyboardInput: boolean;
   onAction: (action: ComputerAction, frame: ComputerFrame | null) => Promise<void>;
   onReadClipboard: () => Promise<ComputerClipboard>;
   onReconnect: () => void;
@@ -1086,9 +1070,6 @@ function ComputerViewport(props: {
     if (inputRef.current) inputRef.current.value = "";
   }, []);
 
-  const pointerInputEnabled = rawInputEnabled && props.pointerInput;
-  const keyboardInputEnabled = rawInputEnabled && props.keyboardInput;
-
   const paintQueuedFrames = useCallback(() => {
     if (decodingFrameRef.current) return;
     decodingFrameRef.current = true;
@@ -1178,11 +1159,11 @@ function ComputerViewport(props: {
   }, [clearBufferedInput, paintQueuedFrames, props.frame]);
 
   useLayoutEffect(() => {
-    if (!rawInputEnabled || !props.pointerInput || !props.keyboardInput) {
+    if (!rawInputEnabled) {
       actionQueueEpochRef.current += 1;
       clearBufferedInput();
     }
-  }, [clearBufferedInput, props.keyboardInput, props.pointerInput, rawInputEnabled]);
+  }, [clearBufferedInput, rawInputEnabled]);
 
   const enqueue = useCallback(
     (
@@ -1267,8 +1248,6 @@ function ComputerViewport(props: {
     if (!frame || props.mutating || !rawInputEnabled || event.button !== 0) return;
     // Preserve the keyboard sink's focus through the canvas pointer default action.
     event.preventDefault();
-    if (keyboardInputEnabled) inputRef.current?.focus({ preventScroll: true });
-    if (!pointerInputEnabled) return;
     flushPendingWheel();
     flushPendingText();
     pointerStartRef.current = {
@@ -1278,10 +1257,11 @@ function ComputerViewport(props: {
       frame,
     };
     event.currentTarget.setPointerCapture?.(event.pointerId);
+    inputRef.current?.focus({ preventScroll: true });
   };
 
   const pointerUp = (event: PointerEvent<HTMLCanvasElement>) => {
-    if (!pointerInputEnabled) return;
+    if (!rawInputEnabled) return;
     const start = pointerStartRef.current;
     pointerStartRef.current = null;
     if (!start || start.pointerId !== event.pointerId) return;
@@ -1346,7 +1326,7 @@ function ComputerViewport(props: {
 
   const contextMenu = (event: MouseEvent<HTMLCanvasElement>) => {
     event.preventDefault();
-    if (!pointerInputEnabled) return;
+    if (!rawInputEnabled) return;
     const frame = paintedFrameRef.current;
     if (!frame) return;
     flushPendingWheel();
@@ -1369,7 +1349,7 @@ function ComputerViewport(props: {
   };
 
   const wheel = (event: WheelEvent<HTMLCanvasElement>) => {
-    if (!pointerInputEnabled) return;
+    if (!rawInputEnabled) return;
     const frame = paintedFrameRef.current;
     if (!frame) return;
     const at = point(frame, event.clientX, event.clientY);
@@ -1397,7 +1377,7 @@ function ComputerViewport(props: {
   };
 
   const keyDown = (event: KeyboardEvent<HTMLTextAreaElement>) => {
-    if (!keyboardInputEnabled) return;
+    if (!rawInputEnabled) return;
     flushPendingWheel();
     const command = event.metaKey || event.ctrlKey;
     if (
@@ -1418,7 +1398,7 @@ function ComputerViewport(props: {
   };
 
   const copy = (event: ClipboardEvent<HTMLTextAreaElement>) => {
-    if (!props.clipboardEnabled || !keyboardInputEnabled) return;
+    if (!props.clipboardEnabled || !rawInputEnabled) return;
     event.preventDefault();
     flushPendingWheel();
     flushPendingText();
@@ -1435,7 +1415,7 @@ function ComputerViewport(props: {
   };
 
   const paste = (event: ClipboardEvent<HTMLTextAreaElement>) => {
-    if (!props.clipboardEnabled || !keyboardInputEnabled) return;
+    if (!props.clipboardEnabled || !rawInputEnabled) return;
     event.preventDefault();
     flushPendingWheel();
     flushPendingText();
@@ -1452,7 +1432,7 @@ function ComputerViewport(props: {
   };
 
   const input = (value: string) => {
-    if (!value || !keyboardInputEnabled) return;
+    if (!value || !rawInputEnabled) return;
     flushPendingWheel();
     flushPendingClick();
     const pending = pendingTextRef.current;
@@ -1482,7 +1462,7 @@ function ComputerViewport(props: {
         className={cn(
           "absolute inset-0 m-auto max-h-full max-w-full touch-none focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-og-accent",
           !showCanvas && "invisible",
-          !pointerInputEnabled && "cursor-default",
+          !rawInputEnabled && "cursor-default",
         )}
         onPointerDown={pointerDown}
         onPointerUp={pointerUp}
@@ -1505,7 +1485,7 @@ function ComputerViewport(props: {
         autoCapitalize="off"
         autoCorrect="off"
         spellCheck={false}
-        disabled={!keyboardInputEnabled}
+        disabled={!rawInputEnabled}
       />
       {!showCanvas ? (
         <ComputerViewportFallback
@@ -1522,18 +1502,10 @@ function ComputerViewport(props: {
           <LoaderCircleIcon className="size-3 animate-spin" /> Acting
         </div>
       ) : null}
-      {showCanvas && (!rawInputEnabled || !props.pointerInput || !props.keyboardInput) ? (
+      {showCanvas && !rawInputEnabled ? (
         <div className="absolute bottom-3 left-1/2 flex -translate-x-1/2 items-center gap-2 rounded-full border border-white/10 bg-black/70 py-1 pl-3 pr-1 text-[11px] text-white/80 backdrop-blur">
-          <span>
-            {!rawInputEnabled && (props.pointerInput || props.keyboardInput)
-              ? "Background view · use native controls"
-              : !props.pointerInput && !props.keyboardInput
-                ? "View only · mouse and keyboard unavailable"
-                : props.keyboardInput
-                  ? "Keyboard only · mouse unavailable"
-                  : "Mouse only · keyboard unavailable"}
-          </span>
-          {!rawInputEnabled && props.target && (props.pointerInput || props.keyboardInput) ? (
+          <span>Background view · use native controls</span>
+          {props.target ? (
             <button
               type="button"
               disabled={props.mutating}

package/src/components/markdown-table-layout.ts

@@ -16,37 +16,6 @@ export function markdownTableWidth({
   return Math.max(columnWidth, Math.min(preferredWidth, available));
 }
 
-function measurementCopy(source: Node, document: Document): Node {
-  if (source.nodeType === Node.ELEMENT_NODE) {
-    const element = source as Element;
-    // Inert prevents focus, not custom-element construction, media loading or
-    // embedded browsing contexts. Do not clone those host-rendered surfaces.
-    if (
-      element.localName.includes("-") ||
-      ["iframe", "object", "embed", "video", "audio", "canvas", "script"].includes(
-        element.localName,
-      )
-    ) {
-      const bounds = element.getBoundingClientRect();
-      const placeholder = document.createElement("span");
-      placeholder.style.display = "inline-block";
-      placeholder.style.width = `${bounds.width}px`;
-      placeholder.style.height = `${bounds.height}px`;
-      return placeholder;
-    }
-  }
-  const copy = document.importNode(source, false);
-  if (copy.nodeType === Node.ELEMENT_NODE) {
-    const element = copy as Element;
-    element.removeAttribute("id");
-    for (const attribute of [...element.attributes]) {
-      if (attribute.name.startsWith("on")) element.removeAttribute(attribute.name);
-    }
-  }
-  for (const child of source.childNodes) copy.appendChild(measurementCopy(child, document));
-  return copy;
-}
-
 /** Loaded only for assistant tables. Keep prose and nested scroll owners intact. */
 export function observeMarkdownTableLayout(wrapper: HTMLDivElement, table: HTMLTableElement) {
   const body = wrapper.parentElement;
@@ -55,8 +24,6 @@ export function observeMarkdownTableLayout(wrapper: HTMLDivElement, table: HTMLT
     ?.closest<HTMLElement>("[data-og-timeline-scroller]");
   if (!body?.classList.contains("og-markdown-body") || !scroller) return;
 
-  // Build the static copy without a browsing context before inserting its probe.
-  const measurementDocument = table.ownerDocument.implementation.createHTMLDocument("");
   let width: number | null = null;
   const reset = () => {
     width = null;
@@ -83,25 +50,14 @@ export function observeMarkdownTableLayout(wrapper: HTMLDivElement, table: HTMLT
     const right =
       panel.left + scroller.clientLeft + scroller.clientWidth - parseFloat(panelStyle.paddingRight);
 
-    // Even a temporary max-content width on the live table changes its height
-    // during forced layout. Browser scroll anchoring can retain that displacement
-    // after the width is restored. Measure a copy without touching live geometry.
-    const probe = table.ownerDocument.createElement("div");
-    probe.setAttribute("aria-hidden", "true");
-    probe.inert = true;
-    // A zero-sized, contained box cannot extend the scroller's overflow area,
-    // including inside transformed ancestors. Keep the same inherited styling.
-    probe.style.cssText =
-      "position:absolute;width:0;height:0;overflow:hidden;contain:layout size paint;visibility:hidden;pointer-events:none";
-    const copy = measurementCopy(table, measurementDocument) as HTMLTableElement;
-    copy.style.width = "max-content";
-    probe.append(copy);
+    // Measure the original table, preserving its wrapping and TSV copy DOM.
+    const previousWidth = table.style.width;
     let preferred: number;
     try {
-      table.parentElement!.append(probe);
-      preferred = copy.getBoundingClientRect().width;
+      table.style.width = "max-content";
+      preferred = table.getBoundingClientRect().width;
     } finally {
-      probe.remove();
+      table.style.width = previousWidth;
     }
     const next = markdownTableWidth({
       columnLeft: column.left,

package/src/components/markdown.tsx

@@ -391,15 +391,12 @@ function ActionMarkdownLink({
       type="button"
       className={cn(
         MARKDOWN_LINK_CLASS,
-        "inline-flex min-h-7 cursor-pointer items-center aria-disabled:cursor-wait aria-disabled:opacity-70 pointer-coarse:min-h-11",
+        "inline-flex min-h-7 cursor-pointer items-center disabled:cursor-wait disabled:opacity-70 pointer-coarse:min-h-11",
       )}
-      // Not `disabled`: disabling the focused control drops focus to the page,
-      // so a host viewer could not return focus to the link that opened it.
-      aria-disabled={state === "loading" || undefined}
+      disabled={state === "loading"}
       aria-busy={state === "loading"}
       title={state === "error" ? "Couldn't open this file. Select to retry." : title}
       onClick={() => {
-        if (state === "loading") return;
         setState("loading");
         void Promise.resolve()
           .then(onOpen)