fix(canvas/a11y): add accessible name to ConsoleModal + DeleteCascadeConfirmDialog backdrops (#410)

Co-authored-by: Molecule AI Core-FE <core-fe@agents.moleculesai.app>
Co-committed-by: Molecule AI Core-FE <core-fe@agents.moleculesai.app>

canvas/src/components/ConsoleModal.tsx

@@ -90,7 +90,11 @@ export function ConsoleModal({ workspaceId, workspaceName, open, onClose }: Prop
 
   return createPortal(
     <div className="fixed inset-0 z-[9999] flex items-center justify-center">
-      <div aria-hidden="true" className="absolute inset-0 bg-black/70 backdrop-blur-sm" onClick={onClose} />
+      <div
+        className="absolute inset-0 bg-black/70 backdrop-blur-sm cursor-pointer"
+        onClick={onClose}
+        aria-label="Close terminal"
+      />
       <div
         role="dialog"
         aria-modal="true"

canvas/src/components/DeleteCascadeConfirmDialog.tsx

@@ -81,7 +81,11 @@ export function DeleteCascadeConfirmDialog({
   return createPortal(
     <div className="fixed inset-0 z-[9999] flex items-center justify-center">
       {/* Backdrop */}
-      <div aria-hidden="true" className="absolute inset-0 bg-black/60 backdrop-blur-sm" onClick={onCancel} />
+      <div
+        className="absolute inset-0 bg-black/60 backdrop-blur-sm cursor-pointer"
+        onClick={onCancel}
+        aria-label="Dismiss dialog"
+      />
 
       {/* Dialog */}
       <div

canvas/src/components/__tests__/ConsoleModal.test.tsx

@@ -98,10 +98,10 @@ describe("ConsoleModal — WCAG 2.1 dialog accessibility", () => {
     expect(titleEl?.textContent?.trim()).toBe("EC2 console output");
   });
 
-  it("backdrop div has aria-hidden='true' so screen readers skip it (WCAG 4.1.2)", async () => {
+  it("backdrop div has aria-label for screen readers (WCAG 2.4.6)", async () => {
     mockGet.mockResolvedValueOnce({ output: "" });
     render(<ConsoleModal workspaceId="ws-1" open={true} onClose={() => {}} />);
-    const backdrop = document.querySelector('[aria-hidden="true"]');
+    const backdrop = document.querySelector('[aria-label="Close terminal"]');
     expect(backdrop).toBeTruthy();
     expect(backdrop?.className).toContain("bg-black");
   });

canvas/src/components/__tests__/DeleteCascadeConfirmDialog.test.tsx

@@ -99,9 +99,9 @@ describe("DeleteCascadeConfirmDialog — WCAG 2.1 dialog accessibility", () => {
     expect(titleEl?.textContent?.trim()).toBe("Delete Workspace and Children");
   });
 
-  it("backdrop div has aria-hidden='true' so screen readers skip it (WCAG 4.1.2)", () => {
+  it("backdrop div has aria-label for screen readers (WCAG 2.4.6)", () => {
     renderDialog();
-    const backdrop = document.querySelector('[aria-hidden="true"]');
+    const backdrop = document.querySelector('[aria-label="Dismiss dialog"]');
     expect(backdrop).toBeTruthy();
     expect(backdrop?.className).toContain("bg-black");
   });