问题
I am struggling to find someway approach to test my vanilla webcomponents. I found someone trying the same and I try to reproduce exactly his steps and the answer accepted (Web Component / HtmlElement : unit testing).
I can't imagine a reason for not finding the test. It seems it looks in wrong place. If so, maybe the answer to my question will be how to edit the path to in wct.conf.js to find the real test (I am not sure it is the root cause but it is my best in front of the error provided).
wct.conf.js
module.exports = {
npm:true,
verbose: true,
plugins: {
local: {
browsers: ["chrome"]
}
},
configuration: { suites:
[ 'test/hello-world-test.html']},
wctPackageName: "wct-browser-legacy"
};
hello-world-test.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="../node_modules/web-component-tester/browser.js"></script>
<script src="../src/hello-world.js"></script>
</head>
<body>
<test-fixture id="helloWorldFixture">
<template>
<hello-world>
</hello-world>
</template>
</test-fixture>
<script>
suite('<hello-world>', () => {
let component;
setup(() => {
component = fixture('helloWorldFixture');
});
test('contains hello world string ?', () => {
let index = component.innerText.indexOf('Hello');
assert.isAtLeast(index, 0);
});
});
</script>
</body>
</html>
console:
resource@DESKTOP-AKCNE7F C:\_d\WSs\basic-vanilla-webcomponent
# wct --npm -wct-package-name=wct-browser-legacy
step: loadPlugins
step: configure
hook: configure
Expanded local browsers: [ 'chrome' ] into capabilities: [ { browserName: 'chrome',
version: '75',
chromeOptions:
{ binary:
'C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe',
args: [Array] } } ] with browserOptions: undefined
configuration: { suites: [ 'test/hello-world-test.html' ],
verbose: true,
quiet: false,
expanded: false,
testTimeout: 90000,
persistent: false,
extraScripts: [],
clientOptions:
{ root: '/components/',
verbose: true,
environmentScripts:
[ 'stacky/browser.js',
'wct-browser-legacy/node_modules/async/lib/async.js',
'wct-browser-legacy/node_modules/lodash/index.js',
'wct-browser-legacy/node_modules/mocha/mocha.js',
'chai/chai.js',
'@polymer/sinonjs/sinon.js',
'sinon-chai/lib/sinon-chai.js',
'accessibility-developer-tools/dist/js/axs_testing.js',
'wct-browser-legacy/node_modules/@polymer/test-fixture/test-fixture.js' ] },
compile: 'auto',
activeBrowsers:
[ { browserName: 'chrome', version: '75', chromeOptions: [Object] } ],
browserOptions: {},
plugins:
{ local:
{ disabled: false,
browsers: [Array],
seleniumArgs: [],
javaArgs: [],
skipSeleniumInstall: false },
sauce: { disabled: false } },
registerHooks: [Function: registerHooks],
enforceJsonConf: false,
webserver:
{ hostname: 'localhost',
_generatedIndexContent:
'<!doctype html>\n<html>\n\n<head>\n <meta charset="utf-8">\n <script>\n window.WCT = {"root":"/components/","verbose":true,"environmentScripts":["stacky/browser.js","wct-browser-legacy/node_modules/async/lib/async.js","wct-browser-legacy/node_modules/lodash/index.js","wct-browser-legacy/node_modules/mocha/mocha.js","chai/chai.js","@polymer/sinonjs/sinon.js","sinon-chai/lib/sinon-chai.js","accessibility-developer-tools/dist/js/axs_testing.js","wct-browser-legacy/node_modules/@polymer/test-fixture/test-fixture.js"]};\n window.__generatedByWct = true;\n </script>\n \n <script src="../wct-browser-legacy/browser.js"></script>\n \n \n</head>\n\n<body>\n <script>\n WCT.loadSuites(["test/hello-world-test.html"]);\n </script>\n</body>\n\n</html>\n' },
moduleResolution: 'node',
npm: true,
configuration: { suites: [ 'test/hello-world-test.html' ] },
wctPackageName: 'wct-browser-legacy',
root: 'C:\\_d\\WSs\\basic-vanilla-webcomponent',
ttyOutput: true,
_: [],
origSuites: [ 'test/' ] }
hook: prepare
hook: prepare:selenium
Installing and starting Selenium server for local browsers
----------
selenium-standalone installation starting
----------
---
selenium install:
from: https://selenium-release.storage.googleapis.com/3.141/selenium-server-standalone-3.141.59.jar
to: C:\_d\WSs\basic-vanilla-webcomponent\node_modules\selenium-standalone\.selenium\selenium-server\3.141.59-server.jar
---
chrome install:
from: https://chromedriver.storage.googleapis.com/2.43/chromedriver_win32.zip
to: C:\_d\WSs\basic-vanilla-webcomponent\node_modules\selenium-standalone\.selenium\chromedriver\2.43-x64-chromedriver
---
ie install:
from: https://selenium-release.storage.googleapis.com/3.12/IEDriverServer_x64_3.12.0.zip
to: C:\_d\WSs\basic-vanilla-webcomponent\node_modules\selenium-standalone\.selenium\iedriver\3.12.0-x64-IEDriverServer.exe
---
firefox install:
from: https://github.com/mozilla/geckodriver/releases/download/v0.20.1/geckodriver-v0.20.1-win64.zip
to: C:\_d\WSs\basic-vanilla-webcomponent\node_modules\selenium-standalone\.selenium\geckodriver\0.20.1-x64-geckodriver
---
edge install:
from: https://download.microsoft.com/download/F/8/A/F8AF50AB-3C3A-4BC4-8773-DC27B32988DD/MicrosoftWebDriver.exe
to: C:\_d\WSs\basic-vanilla-webcomponent\node_modules\selenium-standalone\.selenium\edgedriver\17134-MicrosoftEdgeDriver.exe
---
File from https://selenium-release.storage.googleapis.com/3.12/IEDriverServer_x64_3.12.0.zip has already been downloaded
---
File from https://selenium-release.storage.googleapis.com/3.141/selenium-server-standalone-3.141.59.jar has already been downloaded
---
File from https://chromedriver.storage.googleapis.com/2.43/chromedriver_win32.zip has already been downloaded
---
File from https://github.com/mozilla/geckodriver/releases/download/v0.20.1/geckodriver-v0.20.1-win64.zip has already been downloaded
-----
selenium-standalone installation finished
-----
16:22:38.752 INFO [GridLauncherV3.parse] - Selenium server version: 3.141.59, revision: e82be7d358
16:22:38.872 INFO [GridLauncherV3.lambda$buildLaunchers$3] - Launching a standalone Selenium Server on port 59287
2019-07-16 16:22:38.970:INFO::main: Logging initialized @682ms to org.seleniumhq.jetty9.util.log.StdErrLog
16:22:39.638 INFO [WebDriverServlet.<init>] - Initialising WebDriverServlet
16:22:40.476 INFO [SeleniumServer.boot] - Selenium Server is up and running on port 59287
Selenium server running on port 59287
hook: define:webserver
hook: prepare:webserver
step: runTests
chrome 75 CALL init({"browserName":"chrome","version":"75","chromeOptions":{"binary":"C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe","args":["start-maximized"]},"variant":""})
chrome 75 POST /session {"desiredCapabilities":{"browserName":"chrome","version":"75","chromeOptions":{"binary":"C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe","args":["start-maximized"]},"variant":"","javascriptEnabled":true,"platform":"ANY"}}
16:22:44.347 INFO [ActiveSessionFactory.apply] - Capabilities are: {
"browserName": "chrome",
"chromeOptions": {
"binary": "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe",
"args": [
"start-maximized"
]
},
"javascriptEnabled": true,
"variant": "",
"version": "75"
}
16:22:44.349 INFO [ActiveSessionFactory.lambda$apply$11] - Matched factory org.openqa.selenium.grid.session.remote.ServicedSession$Factory (provider: org.openqa.selenium.chrome.ChromeDriverService)
Starting ChromeDriver 2.43.600210 (68dcf5eebde37173d4027fa8635e332711d2874a) on port 2488
Only local connections are allowed.
16:22:47.850 INFO [ProtocolHandshake.createSession] - Detected dialect: OSS
chrome 75 RESPONSE init({"browserName":"chrome","version":"75","chromeOptions":{"binary":"C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe","args":["start-maximized"]},"variant":""})
chrome 75 CALL get("http://localhost:8081/components/undefined/generated-index.html?cli_browser_id=0")
chrome 75 POST /session/:sessionID/url {"url":"http://localhost:8081/components/undefined/generated-index.html?cli_browser_id=0"}
16:22:48.253 INFO [RemoteSession$Factory.lambda$performHandshake$0] - Started new session a21a3321683b76d725efa872eeb59d5b (org.openqa.selenium.chrome.ChromeDriverService)
[BABEL] Note: The code generator has deoptimised the styling of undefined as it exceeds the max of 500KB.
Test client opened sideband socket
chrome 75 Beginning tests via http://localhost:8081/components/undefined/generated-index.html?cli_browser_id=0
chrome 75 CALL maximize()
chrome 75 POST /session/:sessionID/window/function(err)%20%7B%0A%20%20%20%20%20%20if(err)%20%7B%0A%20%20%20%20%20%20%20%20err.message%20=%20%27[%27%20+%20name%20+%20niceArgs(fargs.all)%20+%20%22]%20%22%20+%20err.message;%0A%20%20%20%20%20%20%20%20if(fargs.callback)%20%7B%20fargs.callback(err);%20%7D%0A%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20var%20cbArgs%20=%20__slice.call(arguments,%200);%0A%20%20%20%20%20%20%20%20_this.emit(%27command%27,%20%22RESPONSE%22%20,%20name%20+%20niceArgs(fargs.all),%0A%20%20%20%20%20%20%20%20%20%20niceResp(_.drop(cbArgs)));%0A%20%20%20%20%20%20%20%20if(fargs.callback)%20%7B%20fargs.callback.apply(null,%20cbArgs);%20%7D%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%7D/maximize
chrome 75 RESPONSE get("http://localhost:8081/components/undefined/generated-index.html?cli_browser_id=0")
chrome failed to maximize
chrome 75 CALL title()
chrome 75 GET /session/:sessionID/title
chrome 75 RESPONSE title()
chrome 75 ✖ test/hello-world-test.html
Timed out loading http://localhost:8081/components/undefined/test/hello-world-test.html
<unknown> at <unknown> at /components/wct-browser-legacy/browser.js:733:0
chrome 75 Tests failed: 1 failed tests
chrome 75 CALL quit()
chrome 75 DELETE /session/:sessionID
chrome 75 RESPONSE quit()
chrome 75 BrowserRunner complete
Test run ended in failure: 1 failed tests
hook: cleanup
chrome 75 (0/0/1)
Error: 1 failed tests
回答1:
I stumbled in the answer in Specify browser location for wct-local test. It is different question (it is regard using gulp) but I noticed something different from my wct.conf.js which I gave a try and it in https://github.com/jimisdrpc/basic-vanilla-webcomponent now unit testing working with wct. What I changed was instead of
configuration: { suites:
[ 'test/hello-world-test.html']},
I wrote
suites:
["test/hello-world-test.html"],
I am still getting the warnning "chrome failed to maximize" but this is posted in another question ("chrome failed to maximize" during unit tests) and I don't know if it is really important since now the unit tests is up and running. Finally I just type wct in my command prompt.
PS.: I wish there was more articles expalining how unit test vanilla webcomponents. I am still wondering if I am in the right direction use wct from polymer to test vanilla webconmponents.
来源：https://stackoverflow.com/questions/57064334/during-wct-test-failed-to-load-resource-the-server-responded-with-a-status-of