[RNMobile] Extract duplicate e2e test setup to jest config (#27334)

* Extract common test setup to jest config * Remove all repeating e2e test code * Move jest expect out of editor page * Remove platformVersion for local iOS run * Update file tests to use new config Co-authored-by: Cameron Voell <cameronvoell@gmail.com>
WordPress · Dec 15, 2020 · b6d609d · b6d609d
1 parent 8ed4925
commit b6d609d
Show file tree

Hide file tree

Showing 28 changed files with 457 additions and 1,011 deletions.
diff --git a/packages/react-native-editor/__device-tests__/.eslintrc.js b/packages/react-native-editor/__device-tests__/.eslintrc.js
@@ -0,0 +1,6 @@
+module.exports = {
+	extends: '../.eslintrc.js',
+	globals: {
+		editorPage: true, // Defined in 'jest_ui_test_environment.js'
+	},
+};
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
@@ -1,50 +1,15 @@
 /**
  * Internal dependencies
  */
-import EditorPage from './pages/editor-page';
-import {
-	setupDriver,
-	isLocalEnvironment,
-	stopDriver,
-	isAndroid,
-	swipeDown,
-	clickMiddleOfElement,
-} from './helpers/utils';
+import { blockNames } from './pages/editor-page';
+import { isAndroid, swipeDown, clickMiddleOfElement } from './helpers/utils';
 import testData from './helpers/test-data';
 
-jest.setTimeout( 1000000 );
-
 describe( 'Gutenberg Editor tests for Block insertion', () => {
-	let driver;
-	let editorPage;
-	let allPassed = true;
-	const paragraphBlockName = 'Paragraph';
-
-	// Use reporter for setting status for saucelabs Job
-	if ( ! isLocalEnvironment() ) {
-		const reporter = {
-			specDone: async ( result ) => {
-				allPassed = allPassed && result.status !== 'failed';
-			},
-		};
-
-		jasmine.getEnv().addReporter( reporter );
-	}
-
-	beforeAll( async () => {
-		driver = await setupDriver();
-		editorPage = new EditorPage( driver );
-	} );
-
-	it( 'should be able to see visual editor', async () => {
-		// wait for the block editor to load
-		await expect( editorPage.getBlockList() ).resolves.toBe( true );
-	} );
-
 	it( 'should be able to insert block into post', async () => {
-		await editorPage.addNewBlock( paragraphBlockName );
+		await editorPage.addNewBlock( blockNames.paragraph );
 		let paragraphBlockElement = await editorPage.getBlockAtPosition(
-			paragraphBlockName
+			blockNames.paragraph
 		);
 		if ( isAndroid() ) {
 			await paragraphBlockElement.click();
@@ -54,67 +19,77 @@ describe( 'Gutenberg Editor tests for Block insertion', () => {
 		// Should have 3 paragraph blocks at this point
 
 		paragraphBlockElement = await editorPage.getBlockAtPosition(
-			paragraphBlockName,
+			blockNames.paragraph,
 			2
 		);
 		await paragraphBlockElement.click();
 
-		await editorPage.addNewBlock( paragraphBlockName );
+		await editorPage.addNewBlock( blockNames.paragraph );
 
 		paragraphBlockElement = await editorPage.getBlockAtPosition(
-			paragraphBlockName,
+			blockNames.paragraph,
 			3
 		);
 		await paragraphBlockElement.click();
 		await editorPage.sendTextToParagraphBlock( 3, testData.mediumText );
 
-		await editorPage.verifyHtmlContent( testData.blockInsertionHtml );
+		const html = await editorPage.getHtmlContent();
+
+		expect( testData.blockInsertionHtml.toLowerCase() ).toBe(
+			html.toLowerCase()
+		);
 
 		// wait for the block editor to load and for accessibility ids to update
-		await driver.sleep( 3000 );
+		await editorPage.driver.sleep( 3000 );
 
 		// Workaround for now since deleting the first element causes a crash on CI for Android
 		if ( isAndroid() ) {
 			paragraphBlockElement = await editorPage.getBlockAtPosition(
-				paragraphBlockName,
+				blockNames.paragraph,
 				3,
 				{
 					autoscroll: true,
 				}
 			);
 
 			await paragraphBlockElement.click();
-			await editorPage.removeBlockAtPosition( paragraphBlockName, 3 );
+			await editorPage.removeBlockAtPosition( blockNames.paragraph, 3 );
 			for ( let i = 3; i > 0; i-- ) {
 				// wait for accessibility ids to update
-				await driver.sleep( 1000 );
+				await editorPage.driver.sleep( 1000 );
 				paragraphBlockElement = await editorPage.getBlockAtPosition(
-					paragraphBlockName,
+					blockNames.paragraph,
 					i,
 					{
 						autoscroll: true,
 					}
 				);
 				await paragraphBlockElement.click();
-				await editorPage.removeBlockAtPosition( paragraphBlockName, i );
+				await editorPage.removeBlockAtPosition(
+					blockNames.paragraph,
+					i
+				);
 			}
 		} else {
 			for ( let i = 4; i > 0; i-- ) {
 				// wait for accessibility ids to update
-				await driver.sleep( 1000 );
+				await editorPage.driver.sleep( 1000 );
 				paragraphBlockElement = await editorPage.getBlockAtPosition(
-					paragraphBlockName
+					blockNames.paragraph
+				);
+				await clickMiddleOfElement(
+					editorPage.driver,
+					paragraphBlockElement
 				);
-				await clickMiddleOfElement( driver, paragraphBlockElement );
-				await editorPage.removeBlockAtPosition( paragraphBlockName );
+				await editorPage.removeBlockAtPosition( blockNames.paragraph );
 			}
 		}
 	} );
 
 	it( 'should be able to insert block at the beginning of post from the title', async () => {
-		await editorPage.addNewBlock( paragraphBlockName );
+		await editorPage.addNewBlock( blockNames.paragraph );
 		let paragraphBlockElement = await editorPage.getBlockAtPosition(
-			paragraphBlockName
+			blockNames.paragraph
 		);
 		if ( isAndroid() ) {
 			await paragraphBlockElement.click();
@@ -127,29 +102,24 @@ describe( 'Gutenberg Editor tests for Block insertion', () => {
 			await editorPage.dismissKeyboard();
 		}
 
-		await swipeDown( driver );
+		await swipeDown( editorPage.driver );
 		const titleElement = await editorPage.getTitleElement( {
 			autoscroll: true,
 		} );
 		await titleElement.click();
 		await titleElement.click();
 
-		await editorPage.addNewBlock( paragraphBlockName );
+		await editorPage.addNewBlock( blockNames.paragraph );
 		paragraphBlockElement = await editorPage.getBlockAtPosition(
-			paragraphBlockName
+			blockNames.paragraph
 		);
-		await clickMiddleOfElement( driver, paragraphBlockElement );
+		await clickMiddleOfElement( editorPage.driver, paragraphBlockElement );
 		await editorPage.sendTextToParagraphBlock( 1, testData.mediumText );
 		await paragraphBlockElement.click();
-		await editorPage.verifyHtmlContent(
-			testData.blockInsertionHtmlFromTitle
-		);
-	} );
+		const html = await editorPage.getHtmlContent();
 
-	afterAll( async () => {
-		if ( ! isLocalEnvironment() ) {
-			driver.sauceJobStatus( allPassed );
-		}
-		await stopDriver( driver );
+		expect( testData.blockInsertionHtmlFromTitle.toLowerCase() ).toBe(
+			html.toLowerCase()
+		);
 	} );
 } );
diff --git a/packages/react-native-editor/__device-tests__/gutenberg-editor-columns.test.js b/packages/react-native-editor/__device-tests__/gutenberg-editor-columns.test.js
@@ -1,38 +1,10 @@
 /**
  * Internal dependencies
  */
-import EditorPage from './pages/editor-page';
-import { setupDriver, isLocalEnvironment, stopDriver } from './helpers/utils';
+import { blockNames } from './pages/editor-page';
 import testData from './helpers/test-data';
 
-jest.setTimeout( 1000000 );
-
 describe( 'Gutenberg Editor Columns Block test', () => {
-	let driver;
-	let editorPage;
-	let allPassed = true;
-	const columnsBlockName = 'Columns';
-
-	// Use reporter for setting status for saucelabs Job
-	if ( ! isLocalEnvironment() ) {
-		const reporter = {
-			specDone: async ( result ) => {
-				allPassed = allPassed && result.status !== 'failed';
-			},
-		};
-
-		jasmine.getEnv().addReporter( reporter );
-	}
-
-	beforeAll( async () => {
-		driver = await setupDriver();
-		editorPage = new EditorPage( driver );
-	} );
-
-	it( 'should be able to see visual editor', async () => {
-		await expect( editorPage.getBlockList() ).resolves.toBe( true );
-	} );
-
 	it( 'should be able to handle a columns width unit from web', async () => {
 		await editorPage.setHtmlContent(
 			testData.columnsWithDifferentUnitsHtml
@@ -42,13 +14,6 @@ describe( 'Gutenberg Editor Columns Block test', () => {
 		await columnsBlock.click();
 
 		expect( columnsBlock ).toBeTruthy();
-		await editorPage.removeBlockAtPosition( columnsBlockName );
-	} );
-
-	afterAll( async () => {
-		if ( ! isLocalEnvironment() ) {
-			driver.sauceJobStatus( allPassed );
-		}
-		await stopDriver( driver );
+		await editorPage.removeBlockAtPosition( blockNames.columns );
 	} );
 } );
diff --git a/packages/react-native-editor/__device-tests__/gutenberg-editor-cover.test.js b/packages/react-native-editor/__device-tests__/gutenberg-editor-cover.test.js
@@ -1,48 +1,16 @@
 /**
  * Internal dependencies
  */
-import EditorPage from './pages/editor-page';
-import {
-	setupDriver,
-	isLocalEnvironment,
-	stopDriver,
-	isAndroid,
-} from './helpers/utils';
+import { blockNames } from './pages/editor-page';
+import { isAndroid } from './helpers/utils';
 import testData from './helpers/test-data';
 
-jest.setTimeout( 1000000 );
-
 describe( 'Gutenberg Editor Cover Block test', () => {
-	let driver;
-	let editorPage;
-	let allPassed = true;
-	const coverBlockName = 'Cover';
-
-	// Use reporter for setting status for saucelabs Job
-	if ( ! isLocalEnvironment() ) {
-		const reporter = {
-			specDone: async ( result ) => {
-				allPassed = allPassed && result.status !== 'failed';
-			},
-		};
-
-		jasmine.getEnv().addReporter( reporter );
-	}
-
-	beforeAll( async () => {
-		driver = await setupDriver();
-		editorPage = new EditorPage( driver );
-	} );
-
-	it( 'should be able to see visual editor', async () => {
-		await expect( editorPage.getBlockList() ).resolves.toBe( true );
-	} );
-
 	it( 'should displayed properly and have properly converted height (ios only)', async () => {
 		await editorPage.setHtmlContent( testData.coverHeightWithRemUnit );
 
 		const coverBlock = await editorPage.getBlockAtPosition(
-			coverBlockName
+			blockNames.cover
 		);
 
 		// Temporarily this test is skipped on Android,due to the inconsistency of the results,
@@ -57,13 +25,6 @@ describe( 'Gutenberg Editor Cover Block test', () => {
 
 		await coverBlock.click();
 		expect( coverBlock ).toBeTruthy();
-		await editorPage.removeBlockAtPosition( coverBlockName );
-	} );
-
-	afterAll( async () => {
-		if ( ! isLocalEnvironment() ) {
-			driver.sauceJobStatus( allPassed );
-		}
-		await stopDriver( driver );
+		await editorPage.removeBlockAtPosition( blockNames.cover );
 	} );
 } );
diff --git a/packages/react-native-editor/__device-tests__/gutenberg-editor-file.test.js b/packages/react-native-editor/__device-tests__/gutenberg-editor-file.test.js
@@ -1,40 +1,12 @@
 /**
  * Internal dependencies
  */
-import EditorPage from './pages/editor-page';
-import { setupDriver, isLocalEnvironment, stopDriver } from './helpers/utils';
+import { blockNames } from './pages/editor-page';
 import testData from './helpers/test-data';
 
-jest.setTimeout( 1000000 );
-
 describe( 'Gutenberg Editor File Block tests @canary', () => {
-	let driver;
-	let editorPage;
-	let allPassed = true;
-	const fileBlockName = 'File';
-
-	// Use reporter for setting status for saucelabs Job
-	if ( ! isLocalEnvironment() ) {
-		const reporter = {
-			specDone: async ( result ) => {
-				allPassed = allPassed && result.status !== 'failed';
-			},
-		};
-
-		jasmine.getEnv().addReporter( reporter );
-	}
-
-	beforeAll( async () => {
-		driver = await setupDriver();
-		editorPage = new EditorPage( driver );
-	} );
-
-	it( 'should be able to see visual editor', async () => {
-		await expect( editorPage.getBlockList() ).resolves.toBe( true );
-	} );
-
 	it( 'should be able to add a file block', async () => {
-		await editorPage.addNewBlock( fileBlockName );
+		await editorPage.addNewBlock( blockNames.file );
 		const block = await editorPage.getFirstBlockVisible();
 		await expect( block ).toBeTruthy();
 	} );
@@ -43,16 +15,12 @@ describe( 'Gutenberg Editor File Block tests @canary', () => {
 		const block = await editorPage.getFirstBlockVisible();
 
 		block.click();
-		await driver.sleep( 1000 );
+		await editorPage.driver.sleep( 1000 );
 		await editorPage.chooseMediaLibrary();
 
-		await editorPage.verifyHtmlContent( testData.fileBlockPlaceholder );
-	} );
-
-	afterAll( async () => {
-		if ( ! isLocalEnvironment() ) {
-			driver.sauceJobStatus( allPassed );
-		}
-		await stopDriver( driver );
+		const html = await editorPage.getHtmlContent();
+		expect( testData.fileBlockPlaceholder.toLowerCase() ).toBe(
+			html.toLowerCase()
+		);
 	} );
 } );