From 3b12c6893c5d3473d22446a6c25148890f062ddb Mon Sep 17 00:00:00 2001
From: Brandon Payton <brandon@happycode.net>
Date: Tue, 18 Jun 2024 19:37:01 -0400
Subject: [PATCH] Playground block: Distinguish better between Run and Activate
 buttons

---
 .../src/components/playground-preview/index.tsx | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/packages/wordpress-playground-block/src/components/playground-preview/index.tsx b/packages/wordpress-playground-block/src/components/playground-preview/index.tsx
index cfac8ba4..dde4df8a 100644
--- a/packages/wordpress-playground-block/src/components/playground-preview/index.tsx
+++ b/packages/wordpress-playground-block/src/components/playground-preview/index.tsx
@@ -349,9 +349,14 @@ export default function PlaygroundPreview({
 		'is-one-under-another': !codeEditorSideBySide,
 		'is-side-by-side': codeEditorSideBySide,
 	});
-	const iframeCreationWarning =
-		'This button creates an iframe containing a full WordPress website ' +
-		'which may be a challenge for screen readers.';
+	const iframeCreationWarningForRunningCode =
+		'This button runs the code in the Preview iframe. ' +
+		'If the Preview iframe has not yet been activated, this ' +
+		'button creates the Preview iframe which contains a full ' +
+		'WordPress website and may be a challenge for screen readers.';
+	const iframeCreationWarningForActivation =
+		'This button creates the Preview iframe containing a full ' +
+		'WordPress website which may be a challenge for screen readers.';
 
 	return (
 		<>
@@ -508,7 +513,7 @@ export default function PlaygroundPreview({
 								className="wordpress-playground-run-button"
 								aria-description={
 									requireLivePreviewActivation
-										? iframeCreationWarning
+										? iframeCreationWarningForRunningCode
 										: undefined
 								}
 							>
@@ -539,7 +544,9 @@ export default function PlaygroundPreview({
 								className="wordpress-playground-activate-button"
 								variant="primary"
 								onClick={() => setLivePreviewActivated(true)}
-								aria-description={iframeCreationWarning}
+								aria-description={
+									iframeCreationWarningForActivation
+								}
 							>
 								Activate Live Preview
 							</Button>