From fdc513ad0eea45ee99bdf9df8b60eb5cabce7e95 Mon Sep 17 00:00:00 2001
From: Kirill Cherkashin <kirill@kcherkashin.org>
Date: Thu, 23 Jan 2025 15:57:03 -0500
Subject: [PATCH] Update my-component-play-function-with-canvas.md

Replace getByRole('another-element') -> getByRole('button')
As `another-element` is not a proper aria-role
---
 .../my-component-play-function-with-canvas.md | 24 +++++++++----------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/docs/_snippets/my-component-play-function-with-canvas.md b/docs/_snippets/my-component-play-function-with-canvas.md
index 7d44ad477a74..abcc56815048 100644
--- a/docs/_snippets/my-component-play-function-with-canvas.md
+++ b/docs/_snippets/my-component-play-function-with-canvas.md
@@ -19,7 +19,7 @@ export const ExampleStory: Story = {
 
     // Starts querying from the component's root element
     await userEvent.type(canvas.getByTestId('example-element'), 'something');
-    await userEvent.click(canvas.getByRole('another-element'));
+    await userEvent.click(canvas.getByRole('button'));
   },
 };
 ```
@@ -49,7 +49,7 @@ export const ExampleStory: Story = {
 
     // Starts querying from the component's root element
     await userEvent.type(canvas.getByTestId('example-element'), 'something');
-    await userEvent.click(canvas.getByRole('another-element'));
+    await userEvent.click(canvas.getByRole('button'));
   }} />
 ```
 
@@ -69,7 +69,7 @@ export const ExampleStory = {
 
     // Starts querying from the component's root element
     await userEvent.type(canvas.getByTestId('example-element'), 'something');
-    await userEvent.click(canvas.getByRole('another-element'));
+    await userEvent.click(canvas.getByRole('button'));
   },
 };
 ```
@@ -90,7 +90,7 @@ export const ExampleStory = {
 
     // Starts querying from the component's root element
     await userEvent.type(canvas.getByTestId('example-element'), 'something');
-    await userEvent.click(canvas.getByRole('another-element'));
+    await userEvent.click(canvas.getByRole('button'));
   },
 };
 ```
@@ -116,7 +116,7 @@ export const ExampleStory = {
 
     // Starts querying from the component's root element
     await userEvent.type(canvas.getByTestId('example-element'), 'something');
-    await userEvent.click(canvas.getByRole('another-element'));
+    await userEvent.click(canvas.getByRole('button'));
   }} />
 ```
 
@@ -141,7 +141,7 @@ export const ExampleStory: Story = {
 
     // Starts querying from the component's root element
     await userEvent.type(canvas.getByTestId('example-element'), 'something');
-    await userEvent.click(canvas.getByRole('another-element'));
+    await userEvent.click(canvas.getByRole('button'));
   },
 };
 ```
@@ -168,7 +168,7 @@ export const ExampleStory: Story = {
 
     // Starts querying from the component's root element
     await userEvent.type(canvas.getByTestId('example-element'), 'something');
-    await userEvent.click(canvas.getByRole('another-element'));
+    await userEvent.click(canvas.getByRole('button'));
   },
 };
 ```
@@ -193,7 +193,7 @@ export const ExampleStory: Story = {
 
     // Starts querying from the component's root element
     await userEvent.type(canvas.getByTestId('example-element'), 'something');
-    await userEvent.click(canvas.getByRole('another-element'));
+    await userEvent.click(canvas.getByRole('button'));
   }} />
 ```
 
@@ -218,7 +218,7 @@ export const ExampleStory: Story = {
 
     // Starts querying from the component's root element
     await userEvent.type(canvas.getByTestId('example-element'), 'something');
-    await userEvent.click(canvas.getByRole('another-element'));
+    await userEvent.click(canvas.getByRole('button'));
   },
 };
 ```
@@ -245,7 +245,7 @@ export const ExampleStory: Story = {
 
     // Starts querying from the component's root element
     await userEvent.type(canvas.getByTestId('example-element'), 'something');
-    await userEvent.click(canvas.getByRole('another-element'));
+    await userEvent.click(canvas.getByRole('button'));
   },
 };
 ```
@@ -264,7 +264,7 @@ export const ExampleStory = {
 
     // Starts querying from the component's root element
     await userEvent.type(canvas.getByTestId('example-element'), 'something');
-    await userEvent.click(canvas.getByRole('another-element'));
+    await userEvent.click(canvas.getByRole('button'));
   },
 };
 ```
@@ -287,7 +287,7 @@ export const ExampleStory: Story = {
 
     // Starts querying from the component's root element
     await userEvent.type(canvas.getByTestId('example-element'), 'something');
-    await userEvent.click(canvas.getByRole('another-element'));
+    await userEvent.click(canvas.getByRole('button'));
   },
 };
 ```