[RNMobile] - Update tests with paragraph blocks to work on both envir…

…onments and platforms (#40404) * add fixes for tests with paragraph blocks * lint fixes * update missed paragraph blocks to use getTextBlockLocatorAtPosition * lint fixes * remove unused code and revert ios coordinate condition * lint fix * remove extra backspace press * rename for clarity Co-authored-by: jos <[email protected]>
WordPress · Apr 27, 2022 · 43d6bcc · 43d6bcc
1 parent ef1f449
commit 43d6bcc
Show file tree

Hide file tree

Showing 7 changed files with 138 additions and 156 deletions.
diff --git a/packages/react-native-editor/__device-tests__/gutenberg-editor-block-insertion.test.js b/packages/react-native-editor/__device-tests__/gutenberg-editor-block-insertion.test.js
@@ -8,7 +8,7 @@ import testData from './helpers/test-data';
 describe( 'Gutenberg Editor tests for Block insertion', () => {
 	it( 'should be able to insert multi-paragraph text, and text to another paragraph block in between', async () => {
 		await editorPage.addNewBlock( blockNames.paragraph );
-		let paragraphBlockElement = await editorPage.getBlockAtPosition(
+		let paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph
 		);
 		if ( isAndroid() ) {
@@ -18,15 +18,15 @@ describe( 'Gutenberg Editor tests for Block insertion', () => {
 		await editorPage.sendTextToParagraphBlock( 1, testData.longText );
 		// Should have 3 paragraph blocks at this point.
 
-		paragraphBlockElement = await editorPage.getBlockAtPosition(
+		paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph,
 			2
 		);
 		await paragraphBlockElement.click();
 
 		await editorPage.addNewBlock( blockNames.paragraph );
 
-		paragraphBlockElement = await editorPage.getBlockAtPosition(
+		paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph,
 			3
 		);
@@ -44,7 +44,7 @@ describe( 'Gutenberg Editor tests for Block insertion', () => {
 
 		// Workaround for now since deleting the first element causes a crash on CI for Android
 		if ( isAndroid() ) {
-			paragraphBlockElement = await editorPage.getBlockAtPosition(
+			paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 				blockNames.paragraph,
 				3,
 				{
@@ -57,7 +57,7 @@ describe( 'Gutenberg Editor tests for Block insertion', () => {
 			for ( let i = 3; i > 0; i-- ) {
 				// wait for accessibility ids to update
 				await editorPage.driver.sleep( 1000 );
-				paragraphBlockElement = await editorPage.getBlockAtPosition(
+				paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 					blockNames.paragraph,
 					i,
 					{
@@ -74,7 +74,7 @@ describe( 'Gutenberg Editor tests for Block insertion', () => {
 			for ( let i = 4; i > 0; i-- ) {
 				// wait for accessibility ids to update
 				await editorPage.driver.sleep( 1000 );
-				paragraphBlockElement = await editorPage.getBlockAtPosition(
+				paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 					blockNames.paragraph
 				);
 				await clickMiddleOfElement(
@@ -88,7 +88,7 @@ describe( 'Gutenberg Editor tests for Block insertion', () => {
 
 	it( 'should be able to insert block at the beginning of post from the title', async () => {
 		await editorPage.addNewBlock( blockNames.paragraph );
-		let paragraphBlockElement = await editorPage.getBlockAtPosition(
+		let paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph
 		);
 		if ( isAndroid() ) {
@@ -110,7 +110,7 @@ describe( 'Gutenberg Editor tests for Block insertion', () => {
 		await titleElement.click();
 
 		await editorPage.addNewBlock( blockNames.paragraph );
-		paragraphBlockElement = await editorPage.getBlockAtPosition(
+		paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph
 		);
 		await clickMiddleOfElement( editorPage.driver, paragraphBlockElement );

diff --git a/packages/react-native-editor/__device-tests__/[email protected] b/packages/react-native-editor/__device-tests__/[email protected]
@@ -9,7 +9,11 @@ describe( 'Gutenberg Editor tests', () => {
 	it( 'should be able to create a post with heading and paragraph blocks', async () => {
 		await editorPage.addNewBlock( blockNames.heading );
 		let headingBlockElement = await editorPage.getBlockAtPosition(
-			blockNames.heading
+			blockNames.heading,
+			1,
+			{
+				useWaitForVisible: true,
+			}
 		);
 		if ( isAndroid() ) {
 			await headingBlockElement.click();
@@ -21,7 +25,7 @@ describe( 'Gutenberg Editor tests', () => {
 		);
 
 		await editorPage.addNewBlock( blockNames.paragraph );
-		let paragraphBlockElement = await editorPage.getBlockAtPosition(
+		let paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph,
 			2
 		);
@@ -31,7 +35,7 @@ describe( 'Gutenberg Editor tests', () => {
 		);
 
 		await editorPage.addNewBlock( blockNames.paragraph );
-		paragraphBlockElement = await editorPage.getBlockAtPosition(
+		paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph,
 			3
 		);
@@ -41,7 +45,7 @@ describe( 'Gutenberg Editor tests', () => {
 		);
 
 		await editorPage.addNewBlock( blockNames.heading );
-		headingBlockElement = await editorPage.getBlockAtPosition(
+		headingBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.heading,
 			4
 		);
@@ -51,7 +55,7 @@ describe( 'Gutenberg Editor tests', () => {
 		);
 
 		await editorPage.addNewBlock( blockNames.paragraph );
-		paragraphBlockElement = await editorPage.getBlockAtPosition(
+		paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph,
 			5
 		);

diff --git a/packages/react-native-editor/__device-tests__/[email protected] b/packages/react-native-editor/__device-tests__/[email protected]
@@ -8,11 +8,14 @@ import testData from './helpers/test-data';
 describe( 'Gutenberg Editor Image Block tests', () => {
 	it( 'should be able to add an image block', async () => {
 		await editorPage.addNewBlock( blockNames.image );
-		await editorPage.driver.sleep( 1000 );
 		await editorPage.closePicker();
 
-		let imageBlock = await editorPage.getBlockAtPosition(
-			blockNames.image
+		const imageBlock = await editorPage.getBlockAtPosition(
+			blockNames.image,
+			1,
+			{
+				useWaitForVisible: true,
+			}
 		);
 
 		// Can only add image from media library on iOS
@@ -26,7 +29,6 @@ describe( 'Gutenberg Editor Image Block tests', () => {
 			await editorPage.dismissKeyboard();
 			// End workaround.
 
-			imageBlock = await editorPage.getBlockAtPosition( imageBlock );
 			await swipeUp( editorPage.driver, imageBlock );
 			await editorPage.enterCaptionToSelectedImageBlock(
 				testData.imageCaption,
@@ -35,7 +37,7 @@ describe( 'Gutenberg Editor Image Block tests', () => {
 			await editorPage.dismissKeyboard();
 		}
 		await editorPage.addNewBlock( blockNames.paragraph );
-		const paragraphBlockElement = await editorPage.getBlockAtPosition(
+		const paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph,
 			2
 		);

diff --git a/packages/react-native-editor/__device-tests__/gutenberg-editor-paragraph.test.js b/packages/react-native-editor/__device-tests__/gutenberg-editor-paragraph.test.js
@@ -13,39 +13,22 @@ import testData from './helpers/test-data';
 describe( 'Gutenberg Editor tests for Paragraph Block', () => {
 	it( 'should be able to split one paragraph block into two', async () => {
 		await editorPage.addNewBlock( blockNames.paragraph );
-		const paragraphBlockElement = await editorPage.getBlockAtPosition(
+		const paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph
 		);
-		if ( isAndroid() ) {
-			await paragraphBlockElement.click();
-		}
-
 		await editorPage.typeTextToParagraphBlock(
 			paragraphBlockElement,
 			testData.shortText
 		);
-		const textViewElement = await editorPage.getTextViewForParagraphBlock(
-			paragraphBlockElement
-		);
-		await clickMiddleOfElement( editorPage.driver, textViewElement );
+		await clickMiddleOfElement( editorPage.driver, paragraphBlockElement );
 		await editorPage.typeTextToParagraphBlock(
 			paragraphBlockElement,
 			'\n',
 			false
 		);
-		expect(
-			( await editorPage.hasBlockAtPosition(
-				1,
-				blockNames.paragraph
-			) ) &&
-				( await editorPage.hasBlockAtPosition(
-					2,
-					blockNames.paragraph
-				) )
-		).toBe( true );
-
 		const text0 = await editorPage.getTextForParagraphBlockAtPosition( 1 );
 		const text1 = await editorPage.getTextForParagraphBlockAtPosition( 2 );
+		expect( await editorPage.getNumberOfParagraphBlocks() ).toEqual( 2 );
 		expect( text0 ).not.toBe( '' );
 		expect( text1 ).not.toBe( '' );
 		expect( testData.shortText ).toMatch(
@@ -58,7 +41,7 @@ describe( 'Gutenberg Editor tests for Paragraph Block', () => {
 
 	it( 'should be able to merge 2 paragraph blocks into 1', async () => {
 		await editorPage.addNewBlock( blockNames.paragraph );
-		let paragraphBlockElement = await editorPage.getBlockAtPosition(
+		let paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph
 		);
 		if ( isAndroid() ) {
@@ -69,62 +52,38 @@ describe( 'Gutenberg Editor tests for Paragraph Block', () => {
 			paragraphBlockElement,
 			testData.shortText
 		);
-		let textViewElement = await editorPage.getTextViewForParagraphBlock(
-			paragraphBlockElement
-		);
-		await clickMiddleOfElement( editorPage.driver, textViewElement );
+		await clickMiddleOfElement( editorPage.driver, paragraphBlockElement );
 		await editorPage.typeTextToParagraphBlock(
 			paragraphBlockElement,
 			'\n'
 		);
-		expect(
-			( await editorPage.hasBlockAtPosition(
-				1,
-				blockNames.paragraph
-			) ) &&
-				( await editorPage.hasBlockAtPosition(
-					2,
-					blockNames.paragraph
-				) )
-		).toBe( true );
 
 		const text0 = await editorPage.getTextForParagraphBlockAtPosition( 1 );
 		const text1 = await editorPage.getTextForParagraphBlockAtPosition( 2 );
-		paragraphBlockElement = await editorPage.getBlockAtPosition(
+		expect( await editorPage.getNumberOfParagraphBlocks() ).toEqual( 2 );
+		paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph,
 			2
 		);
-		if ( isAndroid() ) {
-			await paragraphBlockElement.click();
-		}
 
-		textViewElement = await editorPage.getTextViewForParagraphBlock(
+		await clickBeginningOfElement(
+			editorPage.driver,
 			paragraphBlockElement
 		);
-		await clickBeginningOfElement( editorPage.driver, textViewElement );
+
 		await editorPage.typeTextToParagraphBlock(
 			paragraphBlockElement,
 			backspace
 		);
 
 		const text = await editorPage.getTextForParagraphBlockAtPosition( 1 );
 		expect( text0 + text1 ).toMatch( text );
-
-		expect(
-			await editorPage.hasBlockAtPosition( 2, blockNames.paragraph )
-		).toBe( false );
+		expect( await editorPage.getNumberOfParagraphBlocks() ).toEqual( 1 );
 		await editorPage.removeBlockAtPosition( blockNames.paragraph );
 	} );
 
 	it( 'should be able to create a post with multiple paragraph blocks', async () => {
 		await editorPage.addNewBlock( blockNames.paragraph );
-		const paragraphBlockElement = await editorPage.getBlockAtPosition(
-			blockNames.paragraph
-		);
-		if ( isAndroid() ) {
-			await paragraphBlockElement.click();
-		}
-
 		await editorPage.sendTextToParagraphBlock( 1, testData.longText );
 
 		for ( let i = 3; i > 0; i-- ) {
@@ -139,23 +98,30 @@ describe( 'Gutenberg Editor tests for Paragraph Block', () => {
 				testData.lettersInParagraphBlock,
 			].join( '\n\n' )
 		);
-		// // Merge paragraphs.
-		const secondParagraphBlockElement = await editorPage.getBlockAtPosition(
+
+		// Merge paragraphs.
+		const paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph,
 			2
 		);
+
+		const text0 = await editorPage.getTextForParagraphBlockAtPosition( 1 );
+		const text1 = await editorPage.getTextForParagraphBlockAtPosition( 2 );
+
 		await clickBeginningOfElement(
 			editorPage.driver,
-			secondParagraphBlockElement
+			paragraphBlockElement
 		);
 		await editorPage.typeTextToParagraphBlock(
-			secondParagraphBlockElement,
+			paragraphBlockElement,
 			backspace
 		);
 
 		// Verify the editor has not crashed.
-		const text = await editorPage.getTextForParagraphBlockAtPosition( 1 );
-		expect( text.length ).not.toEqual( 0 );
+		const mergedBlockText = await editorPage.getTextForParagraphBlockAtPosition(
+			1
+		);
+		expect( text0 + text1 ).toMatch( mergedBlockText );
 
 		await editorPage.removeBlockAtPosition( blockNames.paragraph );
 	} );
@@ -168,21 +134,24 @@ describe( 'Gutenberg Editor tests for Paragraph Block', () => {
 				testData.paragraphBlockEmpty,
 			].join( '\n\n' )
 		);
-		// // Merge paragraphs.
-		const secondParagraphBlockElement = await editorPage.getBlockAtPosition(
+
+		// Merge paragraphs.
+		const paragraphBlockElement = await editorPage.getTextBlockAtPosition(
 			blockNames.paragraph,
 			2
 		);
-		await secondParagraphBlockElement.click();
 		await editorPage.typeTextToParagraphBlock(
-			secondParagraphBlockElement,
+			paragraphBlockElement,
 			backspace
 		);
 
 		// Verify the editor has not crashed.
 		const text = await editorPage.getTextForParagraphBlockAtPosition( 1 );
 		expect( text.length ).not.toEqual( 0 );
 
+		if ( isAndroid() ) {
+			await paragraphBlockElement.click();
+		}
 		await editorPage.removeBlockAtPosition( blockNames.paragraph );
 	} );
 } );