Testing: Refactor public API of e2e test utils (#13188)

* Tests: Use CLI options rather than custom config for e2e tests run * Refactor public API of e2e test utils * Fix createURL method signature * Apply suggestions from code review Co-Authored-By: gziolo <[email protected]> * Apply suggestions from code review Co-Authored-By: gziolo <[email protected]> * Tests: Fix Travis jobs with e2e tests * Tests: Revert util method name to saveDraft
WordPress · Jan 7, 2019 · da8542d · da8542d
1 parent 4911743
commit da8542d
Show file tree

Hide file tree

Showing 108 changed files with 763 additions and 733 deletions.
diff --git a/.travis.yml b/.travis.yml
@@ -67,29 +67,29 @@ jobs:
       install:
         - ./bin/setup-local-env.sh
       script:
-        - $( npm bin )/jest --config test/e2e/jest.config.json --listTests > ~/.jest-e2e-tests
+        - $( npm bin )/wp-scripts test-e2e --testPathPattern=/test/e2e/specs/ --listTests > ~/.jest-e2e-tests
         - npm run test-e2e -- --ci --cacheDirectory="$HOME/.jest-cache" --runTestsByPath $( awk 'NR % 2 == 0' < ~/.jest-e2e-tests )
 
     - name: E2E tests (Admin with plugins) (2/2)
       env: WP_VERSION=latest POPULAR_PLUGINS=true
       install:
         - ./bin/setup-local-env.sh
       script:
-        - $( npm bin )/jest --config test/e2e/jest.config.json --listTests > ~/.jest-e2e-tests
+        - $( npm bin )/wp-scripts test-e2e --testPathPattern=/test/e2e/specs/ --listTests > ~/.jest-e2e-tests
         - npm run test-e2e -- --ci --cacheDirectory="$HOME/.jest-cache" --runTestsByPath $( awk 'NR % 2 == 1' < ~/.jest-e2e-tests )
 
     - name: E2E tests (Author without plugins) (1/2)
       env: WP_VERSION=latest E2E_ROLE=author
       install:
         - ./bin/setup-local-env.sh
       script:
-        - $( npm bin )/jest --config test/e2e/jest.config.json --listTests > ~/.jest-e2e-tests
+        - $( npm bin )/wp-scripts test-e2e --testPathPattern=/test/e2e/specs/ --listTests > ~/.jest-e2e-tests
         - npm run test-e2e -- --ci --cacheDirectory="$HOME/.jest-cache" --runTestsByPath $( awk 'NR % 2 == 0' < ~/.jest-e2e-tests )
 
     - name: E2E tests (Author without plugins) (2/2)
       env: WP_VERSION=latest E2E_ROLE=author
       install:
         - ./bin/setup-local-env.sh
       script:
-        - $( npm bin )/jest --config test/e2e/jest.config.json --listTests > ~/.jest-e2e-tests
+        - $( npm bin )/wp-scripts test-e2e --testPathPattern=/test/e2e/specs/ --listTests > ~/.jest-e2e-tests
         - npm run test-e2e -- --ci --cacheDirectory="$HOME/.jest-cache" --runTestsByPath $( awk 'NR % 2 == 1' < ~/.jest-e2e-tests )
diff --git a/package.json b/package.json
@@ -175,7 +175,7 @@
 		"publish:prod": "npm run build:packages && lerna publish",
 		"test": "npm run lint && npm run test-unit",
 		"pretest-e2e": "concurrently \"./bin/reset-e2e-tests.sh\" \"npm run build\"",
-		"test-e2e": "wp-scripts test-e2e --config test/e2e/jest.config.json",
+		"test-e2e": "wp-scripts test-e2e --setupTestFrameworkScriptFile=./test/e2e/support/setup-test-framework.js --testPathPattern=/test/e2e/specs/",
 		"test-e2e:watch": "npm run test-e2e -- --watch",
 		"test-php": "npm run lint-php && npm run test-unit-php",
 		"test-unit": "wp-scripts test-unit-js --config test/unit/jest.config.json",

diff --git a/test/e2e/jest.config.json b/test/e2e/jest.config.json
diff --git a/test/e2e/specs/a11y.test.js b/test/e2e/specs/a11y.test.js
@@ -2,8 +2,8 @@
  * Internal dependencies
  */
 import {
-	newPost,
-	pressWithModifier,
+	createNewPost,
+	pressKeyWithModifier,
 } from '../support/utils';
 
 function isCloseButtonFocused() {
@@ -14,11 +14,11 @@ function isCloseButtonFocused() {
 
 describe( 'a11y', () => {
 	beforeEach( async () => {
-		await newPost();
+		await createNewPost();
 	} );
 
 	it( 'tabs header bar', async () => {
-		await pressWithModifier( 'ctrl', '~' );
+		await pressKeyWithModifier( 'ctrl', '~' );
 
 		await page.keyboard.press( 'Tab' );
 
@@ -31,7 +31,7 @@ describe( 'a11y', () => {
 
 	it( 'constrains focus to a modal when tabbing', async () => {
 		// Open keyboard help modal.
-		await pressWithModifier( 'access', 'h' );
+		await pressKeyWithModifier( 'access', 'h' );
 
 		// The close button should not be focused by default; this is a strange UX
 		// experience.
@@ -45,7 +45,7 @@ describe( 'a11y', () => {
 	} );
 
 	it( 'returns focus to the first tabbable in a modal after blurring a tabbable', async () => {
-		await pressWithModifier( 'access', 'h' );
+		await pressKeyWithModifier( 'access', 'h' );
 
 		// Click to move focus to an element after the last tabbable within the
 		// modal.
@@ -57,13 +57,13 @@ describe( 'a11y', () => {
 	} );
 
 	it( 'returns focus to the last tabbable in a modal after blurring a tabbable and tabbing in reverse direction', async () => {
-		await pressWithModifier( 'access', 'h' );
+		await pressKeyWithModifier( 'access', 'h' );
 
 		// Click to move focus to an element before the first tabbable within
 		// the modal.
 		await page.click( '.components-modal__header-heading' );
 
-		await pressWithModifier( 'shift', 'Tab' );
+		await pressKeyWithModifier( 'shift', 'Tab' );
 
 		expect( await isCloseButtonFocused() ).toBe( true );
 	} );

diff --git a/test/e2e/specs/adding-blocks.test.js b/test/e2e/specs/adding-blocks.test.js
@@ -2,15 +2,15 @@
  * Internal dependencies
  */
 import {
-	newPost,
+	createNewPost,
 	insertBlock,
 	getEditedPostContent,
-	pressTimes,
+	pressKeyTimes,
 } from '../support/utils';
 
 describe( 'adding blocks', () => {
 	beforeEach( async () => {
-		await newPost();
+		await createNewPost();
 	} );
 
 	/**
@@ -66,8 +66,8 @@ describe( 'adding blocks', () => {
 		await page.keyboard.type( 'Foo' );
 		await page.keyboard.press( 'ArrowUp' );
 		await page.keyboard.press( 'ArrowUp' );
-		await pressTimes( 'ArrowRight', 3 );
-		await pressTimes( 'Delete', 6 );
+		await pressKeyTimes( 'ArrowRight', 3 );
+		await pressKeyTimes( 'Delete', 6 );
 		await page.keyboard.type( ' text' );
 
 		// Ensure newline preservation in shortcode block.
@@ -93,7 +93,7 @@ describe( 'adding blocks', () => {
 			document.activeElement.classList.contains( 'editor-inserter__search' )
 		) );
 		await page.keyboard.type( 'para' );
-		await pressTimes( 'Tab', 3 );
+		await pressKeyTimes( 'Tab', 3 );
 		await page.keyboard.press( 'Enter' );
 		await page.keyboard.type( 'Second paragraph' );
 

diff --git a/test/e2e/specs/adding-inline-tokens.test.js b/test/e2e/specs/adding-inline-tokens.test.js
@@ -13,12 +13,12 @@ import {
 	clickBlockAppender,
 	getEditedPostContent,
 	insertBlock,
-	newPost,
+	createNewPost,
 } from '../support/utils';
 
 describe( 'adding inline tokens', () => {
 	beforeAll( async () => {
-		await newPost();
+		await createNewPost();
 	} );
 
 	it( 'should insert inline image', async () => {

diff --git a/test/e2e/specs/align-hook.test.js b/test/e2e/specs/align-hook.test.js
@@ -2,22 +2,23 @@
  * Internal dependencies
  */
 import {
-	newPost,
-	insertBlock,
-	getEditedPostContent,
-	setPostContent,
+	activatePlugin,
+	createNewPost,
+	deactivatePlugin,
 	getAllBlocks,
+	getEditedPostContent,
+	insertBlock,
 	selectBlockByClientId,
+	setPostContent,
 } from '../support/utils';
-import { activatePlugin, deactivatePlugin } from '../support/plugins';
 
 describe( 'Align Hook Works As Expected', () => {
 	beforeAll( async () => {
 		await activatePlugin( 'gutenberg-test-align-hook' );
 	} );
 
 	beforeEach( async () => {
-		await newPost();
+		await createNewPost();
 	} );
 
 	afterAll( async () => {

diff --git a/test/e2e/specs/annotations.test.js b/test/e2e/specs/annotations.test.js
@@ -2,10 +2,11 @@
  * Internal dependencies
  */
 import {
+	activatePlugin,
 	clickOnMoreMenuItem,
-	newPost,
+	createNewPost,
+	deactivatePlugin,
 } from '../support/utils';
-import { activatePlugin, deactivatePlugin } from '../support/plugins';
 
 const clickOnBlockSettingsMenuItem = async ( buttonLabel ) => {
 	await expect( page ).toClick( '.editor-block-settings-menu__toggle' );
@@ -25,7 +26,7 @@ describe( 'Using Plugins API', () => {
 	} );
 
 	beforeEach( async () => {
-		await newPost();
+		await createNewPost();
 	} );
 
 	/**

diff --git a/test/e2e/specs/block-deletion.test.js b/test/e2e/specs/block-deletion.test.js
@@ -4,12 +4,12 @@
 import {
 	clickBlockAppender,
 	getEditedPostContent,
-	newPost,
-	pressWithModifier,
+	createNewPost,
+	pressKeyWithModifier,
 } from '../support/utils';
 
 const addThreeParagraphsToNewPost = async () => {
-	await newPost();
+	await createNewPost();
 
 	// Add demo content
 	await clickBlockAppender();
@@ -49,7 +49,7 @@ describe( 'block deletion -', () => {
 		it( 'results in two remaining blocks and positions the caret at the end of the second block', async () => {
 			// Type some text to assert that the shortcut also deletes block content.
 			await page.keyboard.type( 'this is block 2' );
-			await pressWithModifier( 'access', 'z' );
+			await pressKeyWithModifier( 'access', 'z' );
 			expect( await getEditedPostContent() ).toMatchSnapshot();
 
 			// Type additional text and assert that caret position is correct by comparing to snapshot.
@@ -97,7 +97,7 @@ describe( 'block deletion -', () => {
 			await page.keyboard.press( 'Enter' );
 
 			// Press the up arrow once to select the third and fourth blocks.
-			await pressWithModifier( 'shift', 'ArrowUp' );
+			await pressKeyWithModifier( 'shift', 'ArrowUp' );
 
 			// Now that the block wrapper is selected, press backspace to delete it.
 			await page.keyboard.press( 'Backspace' );

diff --git a/test/e2e/specs/block-hierarchy-navigation.test.js b/test/e2e/specs/block-hierarchy-navigation.test.js
@@ -2,20 +2,20 @@
  * Internal dependencies
  */
 import {
-	newPost,
+	createNewPost,
 	insertBlock,
 	getEditedPostContent,
-	pressTimes,
-	pressWithModifier,
+	pressKeyTimes,
+	pressKeyWithModifier,
 } from '../support/utils';
 
 async function openBlockNavigator() {
-	return pressWithModifier( 'access', 'o' );
+	return pressKeyWithModifier( 'access', 'o' );
 }
 
 describe( 'Navigating the block hierarchy', () => {
 	beforeEach( async () => {
-		await newPost();
+		await createNewPost();
 	} );
 
 	it( 'should navigate using the block hierarchy dropdown menu', async () => {
@@ -44,7 +44,7 @@ describe( 'Navigating the block hierarchy', () => {
 		await lastColumnsBlockMenuItem.click();
 
 		// Insert text in the last column block.
-		await pressTimes( 'Tab', 2 ); // Navigate to the appender.
+		await pressKeyTimes( 'Tab', 2 ); // Navigate to the appender.
 		await page.keyboard.type( 'Third column' );
 
 		expect( await getEditedPostContent() ).toMatchSnapshot();
@@ -61,22 +61,22 @@ describe( 'Navigating the block hierarchy', () => {
 		await page.keyboard.press( 'Enter' );
 
 		// Move focus to the sidebar area.
-		await pressWithModifier( 'ctrl', '`' );
-		await pressWithModifier( 'ctrl', '`' );
-		await pressWithModifier( 'ctrl', '`' );
-		await pressWithModifier( 'ctrl', '`' );
-		await pressTimes( 'Tab', 4 );
+		await pressKeyWithModifier( 'ctrl', '`' );
+		await pressKeyWithModifier( 'ctrl', '`' );
+		await pressKeyWithModifier( 'ctrl', '`' );
+		await pressKeyWithModifier( 'ctrl', '`' );
+		await pressKeyTimes( 'Tab', 4 );
 
 		// Tweak the columns count by increasing it by one.
 		page.keyboard.press( 'ArrowRight' );
 
 		// Navigate to the last column in the columns block.
 		await openBlockNavigator();
-		await pressTimes( 'Tab', 4 );
+		await pressKeyTimes( 'Tab', 4 );
 		await page.keyboard.press( 'Enter' );
 
 		// Insert text in the last column block
-		await pressTimes( 'Tab', 2 ); // Navigate to the appender.
+		await pressKeyTimes( 'Tab', 2 ); // Navigate to the appender.
 		await page.keyboard.type( 'Third column' );
 
 		expect( await getEditedPostContent() ).toMatchSnapshot();
@@ -97,7 +97,7 @@ describe( 'Navigating the block hierarchy', () => {
 		await page.keyboard.press( 'Space' );
 
 		// Replace its content.
-		await pressWithModifier( 'primary', 'A' );
+		await pressKeyWithModifier( 'primary', 'A' );
 		await page.keyboard.type( 'and I say hello' );
 
 		expect( await getEditedPostContent() ).toMatchSnapshot();

diff --git a/test/e2e/specs/block-icons.test.js b/test/e2e/specs/block-icons.test.js
@@ -2,12 +2,13 @@
  * Internal dependencies
  */
 import {
-	pressWithModifier,
-	newPost,
+	activatePlugin,
+	createNewPost,
+	deactivatePlugin,
 	insertBlock,
+	pressKeyWithModifier,
 	searchForBlock,
 } from '../support/utils';
-import { activatePlugin, deactivatePlugin } from '../support/plugins';
 
 const INSERTER_BUTTON_SELECTOR = '.components-popover__content .editor-block-types-list__item';
 const INSERTER_ICON_WRAPPER_SELECTOR = `${ INSERTER_BUTTON_SELECTOR } .editor-block-types-list__item-icon`;
@@ -35,7 +36,7 @@ async function getFirstInserterIcon() {
 }
 
 async function selectFirstBlock() {
-	await pressWithModifier( 'access', 'o' );
+	await pressKeyWithModifier( 'access', 'o' );
 	const navButtons = await page.$$( '.editor-block-navigation__item-button' );
 	await navButtons[ 0 ].click();
 }
@@ -58,7 +59,7 @@ describe( 'Correctly Renders Block Icons on Inserter and Inspector', () => {
 	} );
 
 	beforeEach( async () => {
-		await newPost();
+		await createNewPost();
 	} );
 
 	afterAll( async () => {

diff --git a/test/e2e/specs/block-mover.test.js b/test/e2e/specs/block-mover.test.js
@@ -1,11 +1,11 @@
 /**
  * Internal dependencies
  */
-import { newPost } from '../support/utils';
+import { createNewPost } from '../support/utils';
 
 describe( 'block mover', () => {
 	beforeEach( async () => {
-		await newPost();
+		await createNewPost();
 	} );
 
 	it( 'should show block mover when more than one block exists', async () => {