From 716116325e33369900be671bad76936bc1b2c02f Mon Sep 17 00:00:00 2001
From: evanlowe <62918515+evanlowe@users.noreply.github.com>
Date: Thu, 17 Sep 2026 23:27:29 +0800
Subject: [PATCH] fix(studio): restore debug scrolling and error action icons

---
 frontend/README.md                         | 3 ++-
 frontend/src/create/CustomCreate.css       | 8 ++++++++
 frontend/src/create/CustomCreate.tsx       | 2 ++
 frontend/src/ui/DeploymentErrorMessage.tsx | 6 +-----
 4 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/frontend/README.md b/frontend/README.md
index 28f28c9ea..f8f9c01d2 100644
--- a/frontend/README.md
+++ b/frontend/README.md
@@ -910,7 +910,8 @@ avoid linking another checkout's older `node_modules` directory. If TypeScript
 reports missing `i18next` or `react-i18next` despite their entries in
 `package.json`, install from the current lockfile with `npm ci`, then rerun the
 check. Do not remove imports or change source types to work around missing
-dependencies
+dependencies. This also applies to component tests: reinstall dependencies in
+the worktree itself instead of borrowing the main checkout’s `node_modules`
 
 ## Branding
 
diff --git a/frontend/src/create/CustomCreate.css b/frontend/src/create/CustomCreate.css
index f70d4f472..766593008 100644
--- a/frontend/src/create/CustomCreate.css
+++ b/frontend/src/create/CustomCreate.css
@@ -1209,6 +1209,14 @@
   overflow-x: hidden;
   overflow-y: auto;
 }
+.cw-ab-card-face[aria-hidden="true"] {
+  /* A rotated back face can still intercept wheel scrolling in Chromium */
+  visibility: hidden;
+  pointer-events: none;
+}
+.cw-ab-conversation .deploy-error-message-actions {
+  justify-content: flex-start;
+}
 .cw-ab-card-head {
   min-height: 54px;
   display: flex;
diff --git a/frontend/src/create/CustomCreate.tsx b/frontend/src/create/CustomCreate.tsx
index a8124b0b5..126a17244 100644
--- a/frontend/src/create/CustomCreate.tsx
+++ b/frontend/src/create/CustomCreate.tsx
@@ -3390,6 +3390,7 @@ function DebugComparisonWorkspace({
                     <section
                       className="cw-ab-card-face cw-ab-card-front"
                       aria-hidden={variant.configOpen}
+                      inert={variant.configOpen}
                     >
                       <header className="cw-ab-card-head">
                         <div className="cw-ab-card-title">
@@ -3527,6 +3528,7 @@ function DebugComparisonWorkspace({
                     <section
                       className="cw-ab-card-face cw-ab-card-back"
                       aria-hidden={!variant.configOpen}
+                      inert={!variant.configOpen}
                     >
                       <header className="cw-ab-config-head">
                         <div>
diff --git a/frontend/src/ui/DeploymentErrorMessage.tsx b/frontend/src/ui/DeploymentErrorMessage.tsx
index 95ab6172f..b8b3cb925 100644
--- a/frontend/src/ui/DeploymentErrorMessage.tsx
+++ b/frontend/src/ui/DeploymentErrorMessage.tsx
@@ -3,9 +3,7 @@ import { useTranslation } from "react-i18next";
 import { Button, CopyButton } from "@openai/apps-sdk-ui/components/Button";
 import {
   ArrowRotateCcw,
-  Check,
   Collapse,
-  Copy,
   Expand,
 } from "@openai/apps-sdk-ui/components/Icon";
 
@@ -83,9 +81,7 @@ export function DeploymentErrorMessage({
           pill={false}
           title={t("deploymentError.copy")}
           aria-label={t("deploymentError.copy")}
-        >
-          {({ copied }) => copied ? <Check /> : <Copy />}
-        </CopyButton>
+        />
       </div>
     </div>
   );