Add development mode for running e2e tests

This commit is contained in:
Julia Amosova 2019-08-23 18:02:13 +01:00
parent 337b134c10
commit b3b3b15f6d
8 changed files with 110 additions and 112 deletions

View File

@ -27,7 +27,7 @@ matrix:
- name: "Coding standard check"
php: 7.2
env: WP_VERSION=latest WP_MULTISITE=0 RUN_PHPCS=1
- name: "e2e tests (Selenium)"
- name: "e2e tests"
php: 7.2
env: WP_VERSION=latest WP_MULTISITE=0 RUN_E2E=1
addons:

124
package-lock.json generated
View File

@ -111,6 +111,12 @@
"upath": "^1.1.1"
}
},
"commander": {
"version": "2.20.0",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.0.tgz",
"integrity": "sha512-7j2y+40w61zy6YC2iRNpUe/NwhNyoXrYpHMrSunaMG64nRnaf96zO/KMQR4OyN/UnE5KLyEBnKHd4aG3rskjpQ==",
"dev": true
},
"expand-brackets": {
"version": "2.1.4",
"resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-2.1.4.tgz",
@ -4824,9 +4830,9 @@
}
},
"commander": {
"version": "2.20.0",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.0.tgz",
"integrity": "sha512-7j2y+40w61zy6YC2iRNpUe/NwhNyoXrYpHMrSunaMG64nRnaf96zO/KMQR4OyN/UnE5KLyEBnKHd4aG3rskjpQ==",
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/commander/-/commander-3.0.0.tgz",
"integrity": "sha512-pl3QrGOBa9RZaslQiqnnKX2J068wcQw7j9AIaBQ9/JEp5RY6je4jKTImg0Bd+rpoONSe7GUFSgkxLeo17m3Pow==",
"dev": true
},
"commondir": {
@ -5439,6 +5445,12 @@
"sigmund": "^1.0.1"
},
"dependencies": {
"commander": {
"version": "2.20.0",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.0.tgz",
"integrity": "sha512-7j2y+40w61zy6YC2iRNpUe/NwhNyoXrYpHMrSunaMG64nRnaf96zO/KMQR4OyN/UnE5KLyEBnKHd4aG3rskjpQ==",
"dev": true
},
"lru-cache": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-3.2.0.tgz",
@ -6420,6 +6432,14 @@
"chalk": "^2.0.1",
"commander": "^2.11.0",
"debug": "^2.6.8"
},
"dependencies": {
"commander": {
"version": "2.20.0",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.0.tgz",
"integrity": "sha512-7j2y+40w61zy6YC2iRNpUe/NwhNyoXrYpHMrSunaMG64nRnaf96zO/KMQR4OyN/UnE5KLyEBnKHd4aG3rskjpQ==",
"dev": true
}
}
},
"find-up": {
@ -10027,69 +10047,6 @@
}
}
},
"jest-image-snapshot": {
"version": "2.9.0",
"resolved": "https://registry.npmjs.org/jest-image-snapshot/-/jest-image-snapshot-2.9.0.tgz",
"integrity": "sha512-ih/DwdW2AWjQLgTZeaXDH1qMw7g346t6RUK+2KVGXX8c4tNpTinSKR3h059AWhFQGxlZpBZ/dds3DMigosUcdw==",
"dev": true,
"requires": {
"chalk": "^1.1.3",
"get-stdin": "^5.0.1",
"lodash": "^4.17.4",
"mkdirp": "^0.5.1",
"pixelmatch": "^4.0.2",
"pngjs": "^3.3.3",
"rimraf": "^2.6.2"
},
"dependencies": {
"ansi-regex": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
"integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
"dev": true
},
"ansi-styles": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
"integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
"dev": true
},
"chalk": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
"integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
"dev": true,
"requires": {
"ansi-styles": "^2.2.1",
"escape-string-regexp": "^1.0.2",
"has-ansi": "^2.0.0",
"strip-ansi": "^3.0.0",
"supports-color": "^2.0.0"
}
},
"get-stdin": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-5.0.1.tgz",
"integrity": "sha1-Ei4WFZHiH/TFJTAwVpPyDmOTo5g=",
"dev": true
},
"strip-ansi": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
"integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
"dev": true,
"requires": {
"ansi-regex": "^2.0.0"
}
},
"supports-color": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
"integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
"dev": true
}
}
},
"jest-jasmine2": {
"version": "24.8.0",
"resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-24.8.0.tgz",
@ -11151,6 +11108,12 @@
"fill-range": "^7.0.1"
}
},
"commander": {
"version": "2.20.0",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.0.tgz",
"integrity": "sha512-7j2y+40w61zy6YC2iRNpUe/NwhNyoXrYpHMrSunaMG64nRnaf96zO/KMQR4OyN/UnE5KLyEBnKHd4aG3rskjpQ==",
"dev": true
},
"cosmiconfig": {
"version": "5.2.1",
"resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-5.2.1.tgz",
@ -12806,15 +12769,6 @@
"node-modules-regexp": "^1.0.0"
}
},
"pixelmatch": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/pixelmatch/-/pixelmatch-4.0.2.tgz",
"integrity": "sha1-j0fc7FARtHe2fbA8JDvB8wheiFQ=",
"dev": true,
"requires": {
"pngjs": "^3.0.0"
}
},
"pkg-dir": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz",
@ -12875,12 +12829,6 @@
"integrity": "sha512-2qHaIQr2VLRFoxe2nASzsV6ef4yOOH+Fi9FBOVH6cqeSgUnoyySPZkxzLuzd+RYOQTRpROA0ztTMqxROKSb/nA==",
"dev": true
},
"pngjs": {
"version": "3.4.0",
"resolved": "https://registry.npmjs.org/pngjs/-/pngjs-3.4.0.tgz",
"integrity": "sha512-NCrCHhWmnQklfH4MtJMRjZ2a8c80qXeMlQMv2uVp9ISJMTt562SbGd6n2oq0PaPgKm7Z6pL9E2UlLIhC+SHL3w==",
"dev": true
},
"posix-character-classes": {
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
@ -16436,6 +16384,14 @@
"requires": {
"commander": "~2.20.0",
"source-map": "~0.6.1"
},
"dependencies": {
"commander": {
"version": "2.20.0",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.0.tgz",
"integrity": "sha512-7j2y+40w61zy6YC2iRNpUe/NwhNyoXrYpHMrSunaMG64nRnaf96zO/KMQR4OyN/UnE5KLyEBnKHd4aG3rskjpQ==",
"dev": true
}
}
},
"underscore.string": {
@ -16827,6 +16783,12 @@
"supports-color": "^2.0.0"
}
},
"commander": {
"version": "2.20.0",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.0.tgz",
"integrity": "sha512-7j2y+40w61zy6YC2iRNpUe/NwhNyoXrYpHMrSunaMG64nRnaf96zO/KMQR4OyN/UnE5KLyEBnKHd4aG3rskjpQ==",
"dev": true
},
"strip-ansi": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",

View File

@ -16,7 +16,7 @@
"test": "cross-env NODE_CONFIG_DIR='./tests/e2e-tests/config' BABEL_ENV=commonjs mocha \"tests/e2e-tests\" --require babel-register --recursive",
"test:grep": "cross-env NODE_CONFIG_DIR='./tests/e2e-tests/config' BABEL_ENV=commonjs mocha \"tests/e2e-tests\" --require babel-register --grep ",
"test:single": "cross-env NODE_CONFIG_DIR='./tests/e2e-tests/config' BABEL_ENV=commonjs mocha --require babel-register",
"test:e2e": "cross-env NODE_CONFIG_DIR='./tests/e2e-tests/config' NODE_ENV=development JEST_PUPPETEER_CONFIG='./tests/e2e-tests/config/jest-puppeteer.config.js' jest --config='./tests/e2e-tests/config/jest.config.js' --maxWorkers=1 --rootDir=./",
"test:e2e": "./tests/bin/e2e-test-integration.js",
"makepot": "grunt makepot",
"git:update-hooks": "rm -r .git/hooks && mkdir -p .git/hooks && node ./node_modules/husky/husky.js install"
},
@ -33,6 +33,7 @@
"chai": "4.2.0",
"chai-as-promised": "7.1.1",
"chromedriver": "75.1.0",
"commander": "^3.0.0",
"config": "3.2.2",
"cross-env": "5.2.0",
"eslint": "6.1.0",

View File

@ -0,0 +1,35 @@
#!/usr/bin/env node
const { spawn } = require( 'child_process' );
const program = require( 'commander' );
program
.usage( '<file ...> [options]' )
.option( '--dev', 'Development mode' )
.parse( process.argv );
const testEnvVars = {
NODE_ENV: 'test:e2e',
JEST_PUPPETEER_CONFIG: 'tests/e2e-tests/config/jest-puppeteer.config.js',
NODE_CONFIG_DIR: 'tests/e2e-tests/config',
};
if ( program.dev ) {
testEnvVars.JEST_PUPPETEER_CONFIG = 'tests/e2e-tests/config/jest-puppeteer.dev.config.js';
}
const envVars = Object.assign( {}, process.env, testEnvVars );
spawn(
'jest',
[
'--maxWorkers=1',
'--config=tests/e2e-tests/config/jest.config.js',
'--rootDir=./',
program.args,
],
{
stdio: 'inherit',
env: envVars,
}
);

View File

@ -32,7 +32,7 @@ npm install
#### Test Configuration
The tests use environment variables to specify values for the tests.
The tests use environment variables to specify login test data needed to run tests.
To login to the site, `loginUser()` utility function of [`e2e-test-utils`](https://github.com/WordPress/gutenberg/tree/master/packages/e2e-test-utils) package is being used. The function relies on the following [`config.js`](https://github.com/WordPress/gutenberg/blob/master/packages/e2e-test-utils/src/shared/config.js) file to specify base URL, Admin user details and Test user details (could be different from Admin. For example, customer):
@ -87,18 +87,20 @@ To run e2e tests use the following command:
npm run test:e2e
```
Puppeteer runs headless by default. However, sometimes it's useful to observe the browser while running tests. To do so you can use these environment variables:
Tests are being run headless by default. However, sometimes it's useful to observe the browser while running tests. To do so, `Development mode` can be enabled by passing `--dev` flag to the `test:e2e` script in `./package.json` file as follows:
```bash
PUPPETEER_HEADLESS=false PUPPETEER_SLOWMO=50 npm run test:e2e
"test:e2e": "./tests/bin/e2e-test-integration.js --dev",
```
SlowMo slows down Puppeteers operations so we can see whats going on in the browser. `PUPPETEER_SLOWMO=50` means test actions will be slowed down by 50 milliseconds.
Once done, start tests as usual by running `npm run test:e2e`.
The `Development mode` also enables SlowMo mode. SlowMo slows down Puppeteers operations so we can better see what is happening in the browser. You can adjust the SlowMo value by editing `PUPPETEER_SLOWMO` variable in `./tests/e2e-tests/config/jest-puppeteer.dev.config.js` file. The default `PUPPETEER_SLOWMO=50` means test actions will be slowed down by 50 milliseconds.
To run an individual test, use the direct path to the spec. For example:
```bash
npm run test-e2e ./tests/e2e-tests/specs/activate-woocommerce.test.js
npm run test:e2e ./tests/e2e-tests/specs/activate-woocommerce.test.js
```
You can also provide the base URL, Test username and Test password like this:

View File

@ -1,22 +1,6 @@
/** @format */
module.exports = {
launch: {
slowMo: parseInt( process.env.PUPPETEER_SLOWMO, 10 ) || 0,
headless: process.env.PUPPETEER_HEADLESS !== 'false',
ignoreHTTPSErrors: true,
args: [
'--window-size=1920,1080',
'--user-agent=puppeteer-debug',
],
// devtools: true,
defaultViewport: {
width: 1280,
height: 800,
},
// Required for the logged out and logged in tests so they don't share app state/token.
browserContext: 'incognito',
// This will pipe browser's console to node.
dumpio: true,
}
// Required for the logged out and logged in tests so they don't share app state/token.
browserContext: 'incognito',
};

View File

@ -0,0 +1,20 @@
/** @format */
module.exports = {
launch: {
slowMo: process.env.PUPPETEER_SLOWMO ? false : 50,
headless: process.env.PUPPETEER_HEADLESS || false,
ignoreHTTPSErrors: true,
args: [
'--window-size=1920,1080',
'--user-agent=puppeteer-debug',
],
devtools: true,
defaultViewport: {
width: 1280,
height: 800,
},
// Required for the logged out and logged in tests so they don't share app state/token.
browserContext: 'incognito',
}
};

View File

@ -5,9 +5,3 @@
*/
let jestTimeoutInMilliSeconds = 10000;
jest.setTimeout( jestTimeoutInMilliSeconds );
/**
* Extend expect to have the toMatchImageSnapshop function
*/
const { toMatchImageSnapshot } = require('jest-image-snapshot');
expect.extend({ toMatchImageSnapshot });