问题描述
我正在尝试在Gutenberg块上运行一组简单的e2e测试。它来自现有的Git存储库以演示e2e测试。我没有做任何改动，但是作者没有答复，所以我正在努力使它生效。
下面是一个测试（我已经注释掉其他测试，直到我通过了）：
import {
createNewPost,enablePageDialogAccept,getEditedPostContent,insertBlock,} from '@wordpress/e2e-test-utils';
describe( 'Wrapper block',() => {
beforeAll( async () => {
await enablePageDialogAccept();
} );
beforeEach( async () => {
await createNewPost();
} );
it( 'Wrapper block should be available',async () => {
await insertBlock( 'Wrapper Block' );
// Check if block was inserted
expect( await page.$( '[data-type="e2e-tests-example/wrapper-block"]' ) ).not.toBeNull();
expect( await getEditedPostContent() ).toMatchSnapshot();
} );
} );
下面是我的package.json及其版本和脚本命令：
{
"name": "e2e-tests-example",...
"scripts": {
...
"test:e2e": "wp-scripts test-e2e"
},"wp-env": {
"plugin-dir": "e2e-tests-example","plugin-name": "E2E Tests Example","docker-template": "./docker-compose.override.yml","welcome-logo": [
"E2E Tests Example"
],"welcome-build-command": "npm run dev"
}
}
当我尝试运行e2e测试时，似乎没有可用的测试环境，只是出现错误：
PS C:\...\e2e-tests-example-wp-plugin> npm run test:e2e
> e2e-tests-example@1.0.0 test:e2e C:\Users\marty\Sites\nmis-wp\wp-content\plugins\e2e-tests-example-wp-plugin
> wp-scripts test-e2e
FAIL e2e-tests/wrapper-block.spec.js (7.233s)
● Wrapper block › Wrapper block should be available
net::ERR_CONNECTION_REFUSED at http://localhost:8889/wp-admin/post-new.PHP
at navigate (node_modules/puppeteer/lib/FrameManager.js:120:37)
-- ASYNC --
at Frame.<anonymous> (node_modules/puppeteer/lib/helper.js:111:15)
at Page.goto (node_modules/puppeteer/lib/Page.js:675:49)
at Page.goto (node_modules/puppeteer/lib/helper.js:112:23)
at _callee$ (node_modules/@wordpress/e2e-test-utils/build/@wordpress/e2e-test-utils/src/visit-admin-page.js:20:13)
at tryCatch (node_modules/regenerator-runtime/runtime.js:45:40)
at Generator.invoke [as _invoke] (node_modules/regenerator-runtime/runtime.js:271:22)
at Generator.prototype.(anonymous function) [as next] (node_modules/regenerator-runtime/runtime.js:97:21)
at asyncGeneratorStep (node_modules/@babel/runtime/helpers/asyncToGenerator.js:3:24)
at _next (node_modules/@babel/runtime/helpers/asyncToGenerator.js:25:9)
at node_modules/@babel/runtime/helpers/asyncToGenerator.js:32:7
-- ASYNC --
at Page.goto (node_modules/puppeteer/lib/helper.js:111:15)
at _callee$ (node_modules/@wordpress/e2e-test-utils/build/@wordpress/e2e-test-utils/src/visit-admin-page.js:20:13)
at tryCatch (node_modules/regenerator-runtime/runtime.js:45:40)
at Generator.invoke [as _invoke] (node_modules/regenerator-runtime/runtime.js:271:22)
at Generator.prototype.(anonymous function) [as next] (node_modules/regenerator-runtime/runtime.js:97:21)
at asyncGeneratorStep (node_modules/@babel/runtime/helpers/asyncToGenerator.js:3:24)
at _next (node_modules/@babel/runtime/helpers/asyncToGenerator.js:25:9)
at node_modules/@babel/runtime/helpers/asyncToGenerator.js:32:7
at node_modules/@babel/runtime/helpers/asyncToGenerator.js:21:12
● Wrapper block › Wrapper block should be available
No node found for selector: .edit-post-header [aria-label="Add block"]
at assert (node_modules/puppeteer/lib/helper.js:283:11)
at DOMWorld.click (node_modules/puppeteer/lib/DOMWorld.js:366:5)
-- ASYNC --
at Frame.<anonymous> (node_modules/puppeteer/lib/helper.js:111:15)
at Page.click (node_modules/puppeteer/lib/Page.js:1067:29)
at _callee$ (node_modules/@wordpress/e2e-test-utils/build/@wordpress/e2e-test-utils/src/open-global-block-inserter.js:5:13)
at tryCatch (node_modules/regenerator-runtime/runtime.js:45:40)
at Generator.invoke [as _invoke] (node_modules/regenerator-runtime/runtime.js:271:22)
at Generator.prototype.(anonymous function) [as next] (node_modules/regenerator-runtime/runtime.js:97:21)
at asyncGeneratorStep (node_modules/@babel/runtime/helpers/asyncToGenerator.js:3:24)
at _next (node_modules/@babel/runtime/helpers/asyncToGenerator.js:25:9)
at node_modules/@babel/runtime/helpers/asyncToGenerator.js:32:7
› 3 snapshots obsolete.
• Wrapper block Alignment should be set 1
• Wrapper block Background color should be applied 1
• Wrapper block Margin bottom should be applied 1
FAIL e2e-tests/wrapper-block-filters.spec.js
● Test suite Failed to run
Your test suite must contain at least one test.
at node_modules/@jest/core/build/TestScheduler.js:242:24
at asyncGeneratorStep (node_modules/@jest/core/build/TestScheduler.js:131:24)
at _next (node_modules/@jest/core/build/TestScheduler.js:151:9)
at node_modules/@jest/core/build/TestScheduler.js:156:7
at node_modules/@jest/core/build/TestScheduler.js:148:12
at onResult (node_modules/@jest/core/build/TestScheduler.js:271:25)
Snapshot Summary
› 3 snapshots obsolete from 1 test suite. To remove them all,re-run jest with `-u`.
↳ e2e-tests/wrapper-block.spec.js
• Wrapper block Alignment should be set 1
• Wrapper block Background color should be applied 1
• Wrapper block Margin bottom should be applied 1
Test Suites: 2 Failed,2 total
Tests: 1 Failed,1 total
Snapshots: 3 obsolete,0 total
Ran all test suites.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! e2e-tests-example@1.0.0 test:e2e: `wp-scripts test-e2e`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the e2e-tests-example@1.0.0 test:e2e script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\marty\AppData\Roaming\npm-cache\_logs\2020-09-11T11_17_03_665Z-debug.log
如果我错过了需要包含的任何其他文件，请告诉我。我正在使用的存储库（包含所有文件）可以在这里找到-https://github.com/liip/e2e-tests-example-wp-plugin
我注意到有一个docker-compose.override.yml文件，但没有手动运行任何Docker容器的指令，也没有docker-compose.yml文件。我没有在与gutenberg进行的端到端测试中找到大量资源，只是认为从一个正在运行的项目中进行学习并从中学习是很好的。
解决方法
我遇到了完全相同的问题，但就我而言，这是因为MAMP和Puppeteer之间存在端口冲突而发生的。 为了避免这种情况，我为Docker实例使用了自定义端口，但是Puppeteer仍在访问默认的8889端口。
Tu在自定义端口上运行Docker实例，我使用了.wp-env.js文件，并在其中添加了port参数：
{
"core": "WordPress/WordPress","plugins": ["."],"port": 3338
}
然后启动Docker实例，如下所示：
npm run wp-env start
要在自定义端口上运行测试，您可以运行：
npm run test:e2e -- --wordpress-base-url=http://localhost:3338/
上面的命令可以在非Docker环境下运行测试，或者在我们的情况下在自定义端口上运行测试。