From 327ad4050dc44cc6b328cea0067ab44cfcf295cc Mon Sep 17 00:00:00 2001
From: Jarda Snajdr <jsnajdr@gmail.com>
Date: Mon, 19 Dec 2022 14:02:06 +0100
Subject: [PATCH] Fix indexes, merge style button queries into one

---
 .../src/border-box-control/test/index.js      | 32 +++++--------------
 1 file changed, 8 insertions(+), 24 deletions(-)

diff --git a/packages/components/src/border-box-control/test/index.js b/packages/components/src/border-box-control/test/index.js
index 0dc6610e23423..8792283925071 100644
--- a/packages/components/src/border-box-control/test/index.js
+++ b/packages/components/src/border-box-control/test/index.js
@@ -201,20 +201,12 @@ describe( 'BorderBoxControl', () => {
 			);
 
 			const styleLabel = screen.queryByText( 'Style' );
-			const solidButton = screen.queryByRole( 'button', {
-				name: 'Solid',
-			} );
-			const dashedButton = screen.queryByRole( 'button', {
-				name: 'Dashed',
-			} );
-			const dottedButton = screen.queryByRole( 'button', {
-				name: 'Dotted',
+			const styleButtons = screen.queryAllByRole( 'button', {
+				name: /(Solid)|(Dashed)|(Dotted)/,
 			} );
 
 			expect( styleLabel ).not.toBeInTheDocument();
-			expect( solidButton ).not.toBeInTheDocument();
-			expect( dashedButton ).not.toBeInTheDocument();
-			expect( dottedButton ).not.toBeInTheDocument();
+			expect( styleButtons.length ).toBe( 0 );
 		} );
 	} );
 
@@ -292,7 +284,7 @@ describe( 'BorderBoxControl', () => {
 
 			for ( let i = 0; i < colorButtons.length; i++ ) {
 				// Click on the color button to show the color picker popover.
-				await user.click( colorButtons[ 0 ] );
+				await user.click( colorButtons[ i ] );
 
 				// Wait for color picker popover to fully appear
 				const colorPickerButton = screen.getByRole( 'button', {
@@ -305,23 +297,15 @@ describe( 'BorderBoxControl', () => {
 				);
 
 				const styleLabel = screen.queryByText( 'Style' );
-				const solidButton = screen.queryByRole( 'button', {
-					name: 'Solid',
-				} );
-				const dashedButton = screen.queryByRole( 'button', {
-					name: 'Dashed',
-				} );
-				const dottedButton = screen.queryByRole( 'button', {
-					name: 'Dotted',
+				const styleButtons = screen.queryAllByRole( 'button', {
+					name: /(Solid)|(Dashed)|(Dotted)/,
 				} );
 
 				expect( styleLabel ).not.toBeInTheDocument();
-				expect( solidButton ).not.toBeInTheDocument();
-				expect( dashedButton ).not.toBeInTheDocument();
-				expect( dottedButton ).not.toBeInTheDocument();
+				expect( styleButtons.length ).toBe( 0 );
 
 				// Click again to hide the popover.
-				await user.click( colorButtons[ 0 ] );
+				await user.click( colorButtons[ i ] );
 			}
 		} );
 	} );