canmove, Confirmed users, Bureaucrats and Sysops emeriti
4,747
edits
WebDriver/RemoteProtocol/GutenbergCDPUsage: Difference between revisions
WebDriver/RemoteProtocol/GutenbergCDPUsage (view source)
Revision as of 20:09, 26 February 2021
, 26 February 2021Whimboo moved page Remote/GutenbergCDPUsage to WebDriver/RemoteProtocol/GutenbergCDPUsage: Reorganization for WebDriver BiDi project documenation
(Move Page.frameNavigated to events) |
m (Whimboo moved page Remote/GutenbergCDPUsage to WebDriver/RemoteProtocol/GutenbergCDPUsage: Reorganization for WebDriver BiDi project documenation) |
||
| (7 intermediate revisions by 2 users not shown) | |||
| Line 2: | Line 2: | ||
__FORCETOC__ | __FORCETOC__ | ||
== Running the gutenberg tests against Firefox == | |||
=== Prerequisites === | |||
The following is a quickstart based on Gutenberg's [https://github.com/WordPress/gutenberg/blob/master/docs/contributors/testing-overview.md#end-to-end-testing docs]. | |||
# Make sure Docker is running | |||
# <code>nvm install</code> in gutenberg dir to ensure correct node version is installed | |||
# <code>npm ci</code> -- you might see some warnings, this is fine. | |||
# <code>npm run build</code> | |||
# Build local env: <code>npm run wp-env install</code>. Avoid running <code>npm run dev</code>; takes a long time, not useful. | |||
# Start the environment: <code>npm run wp-env start</code> | |||
To stop the local WordPress instance: <code>npm run env stop</code> | |||
=== Firefox prerequisites === | |||
Update the config in <code>packages/scripts/config/puppeteer.config.js</code>: | |||
<pre> | |||
module.exports = { | |||
launch: { | |||
headless: false, | |||
slowMo: 0, | |||
executablePath: 'path/to/firefox', | |||
}, | |||
}; | |||
</pre> | |||
<small>Note: Puppeteer can download and install Firefox Nightly and you can use the path it installs into for the executablePath. For example, on macOS: <code>path/to/gutenberg/node_modules/puppeteer/.local-firefox/mac-80/Firefox\ Nightly.app/Contents/MacOS/firefox</code></small> | |||
# Copy Firefox's modifications of Puppeteer: | |||
<pre> | |||
cp -r <mozilla-central>/remote/test/puppeteer/ node_modules/puppeteer/ | |||
npm run build | |||
</pre> | |||
=== Running tests === | |||
Select Firefox by setting <code>PUPPETEER_PRODUCT</code>, otherwise Chromium will be used. `DEBUG=*` will show all debug logs, or you | |||
can filter it as in the example below: | |||
<pre> | |||
PUPPETEER_PRODUCT=firefox DEBUG=puppeteer:* npm run test-e2e | |||
</pre> | |||
To run a specific test: | |||
<pre> | |||
npm run test-e2e links.test.js | |||
</pre> | |||
The <code>--puppeteer-interactive</code> option can be useful for debugging: | |||
<pre> | |||
npm run test-e2e links.test.js -- --puppeteer-interactive | |||
</pre> | |||
Equivalent to <code>PUPPETEER_HEADLESS=false PUPPETEER_SLOWMO=80 npm run test-e2e:watch</code> | |||
=== Simple tests to consider === | |||
* mentions.tests.js | |||
* post-visibility.test.js | |||
* manage-reusable-blocks.test.js | |||
* style-variation-test.js | |||
== Methods == | == Methods == | ||
| Line 72: | Line 140: | ||
* Target.setAutoAttach | * Target.setAutoAttach | ||
== Methods & Events logged during test setup == | |||
=== Methods === | |||
<pre> | |||
cat visit-admin-page.log create-new-post.log | grep '"id":' | grep -oE '"method":"[^"]+\.[^"]+"' | sed 's/"method":"//' | sed 's/"//' | sort | uniq -c | sort -r | |||
52 Runtime.callFunctionOn | |||
52 Input.dispatchKeyEvent | |||
16 Runtime.releaseObject | |||
11 Runtime.evaluate | |||
9 Input.dispatchMouseEvent | |||
8 Page.navigate | |||
6 Emulation.setDeviceMetricsOverride | |||
4 Target.setDiscoverTargets | |||
3 Page.getLayoutMetrics | |||
3 DOM.getContentQuads | |||
2 Target.setAutoAttach | |||
2 Target.getBrowserContexts | |||
2 Target.createTarget | |||
2 Target.closeTarget | |||
2 Target.attachToTarget | |||
2 Runtime.enable | |||
2 Performance.enable | |||
2 Page.setInterceptFileChooserDialog | |||
2 Page.getFrameTree | |||
2 Page.enable | |||
2 Page.createIsolatedWorld | |||
2 Page.addScriptToEvaluateOnNewDocument | |||
2 Network.enable | |||
2 Log.enable | |||
1 DOM.resolveNode | |||
1 DOM.describeNode | |||
</pre> | |||
=== Events === | |||
<pre> | |||
cat visit-admin-page.log create-new-post.log | grep -v '"id":' | grep -oE '"method":"[^"]+\.[^"]+"' | sed 's/"method":"//' | sed 's/"//' | sort | uniq -c | sort -r | |||
820 Network.dataReceived | |||
576 Network.requestWillBeSent | |||
571 Network.loadingFinished | |||
560 Network.responseReceived | |||
298 Network.responseReceivedExtraInfo | |||
275 Network.requestServedFromCache | |||
273 Network.requestWillBeSentExtraInfo | |||
110 Page.lifecycleEvent | |||
53 Target.targetInfoChanged | |||
24 Runtime.executionContextCreated | |||
20 Runtime.executionContextDestroyed | |||
16 Target.targetCreated | |||
14 Runtime.consoleAPICalled | |||
10 Runtime.executionContextsCleared | |||
10 Page.loadEventFired | |||
10 Page.frameNavigated | |||
10 Page.frameStoppedLoading | |||
10 Page.frameStartedLoading | |||
10 Page.domContentEventFired | |||
8 Page.navigatedWithinDocument | |||
6 Emulation.setTouchEmulationEnabled | |||
6 Page.frameResized | |||
5 Target.targetDestroyed | |||
3 Network.resourceChangedPriority | |||
3 Log.entryAdded | |||
2 Target.detachedFromTarget | |||
2 Target.attachedToTarget | |||
2 Page.setLifecycleEventsEnabled | |||
2 Page.frameScheduledNavigation | |||
2 Page.frameRequestedNavigation | |||
2 Page.frameClearedScheduledNavigation | |||
2 Inspector.detached | |||
</pre> | |||
== Methods & Events ranked by frequency == | == Methods & Events ranked by frequency == | ||