From 200b0f233378f8450fc3078c6200d56cc720f2ea Mon Sep 17 00:00:00 2001
From: Lauren Tan <poteto@users.noreply.github.com>
Date: Wed, 10 Apr 2024 18:17:37 -0400
Subject: [PATCH] Add aria-label to playground tabs

ghstack-source-id: 1c23bbbb55c1582a03674897b57c5061b895be83
Pull Request resolved: https://github.com/facebook/react-forget/pull/2841
---
 compiler/apps/playground/components/TabbedWindow.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/compiler/apps/playground/components/TabbedWindow.tsx b/compiler/apps/playground/components/TabbedWindow.tsx
index 2e141cf286..ebb9653416 100644
--- a/compiler/apps/playground/components/TabbedWindow.tsx
+++ b/compiler/apps/playground/components/TabbedWindow.tsx
@@ -70,6 +70,8 @@ function TabbedWindowItem({
       {isShow ? (
         <div className="border-r" style={{ minWidth: 550, overflow: "hidden" }}>
           <h2
+            title="Minimize tab"
+            aria-label="Minimize tab"
             onClick={toggleTabs}
             className="p-4 duration-150 ease-in border-b cursor-pointer border-grey-200 font-medium text-secondary hover:text-link"
           >
@@ -80,6 +82,8 @@ function TabbedWindowItem({
       ) : (
         <div className="relative items-center h-full px-1 py-6 align-middle border-r border-grey-200">
           <button
+            title={`Expand compiler tab: ${name}`}
+            aria-label={`Expand compiler tab: ${name}`}
             style={{ transform: "rotate(90deg) translate(-50%)" }}
             onClick={toggleTabs}
             className="flex-grow-0 w-5 transition-colors duration-150 ease-in font-medium text-secondary hover:text-link"