Я хочу настроить web-component-tester для тестирования моих веб-компонентов. Я установил его через npm (devDependency) и создал следующий сценарий:
package. json:
"scripts": {
"wcttest": "./node_modules/.bin/wct --npm src/app/modules/essen/components/essen-list/test/wct-test.html"
},
Как указано в сценарии, у меня есть файл. html, расположенный там. Но теперь, если я запустил сценарий npm run wcttest, откроется следующий маршрут:
http://localhost:8081/components/wc-frontend/generated-index.html?cli_browser_id=0, где wc-frontend - это root имя папки проекта. Но я не понимаю, почему он сначала открывает путь components.
Тест открывает все браузеры, которые я установил, но нет ничего, кроме белой страницы. Если я открою консоль, появится следующий сценарий:
<script>
WCT.loadSuites(["src/app/modules/essen/components/essen-list/test/wct-test.html"]);
<script>
Здесь путь выглядит правильным.
wct-test. html
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<script src="../../../../../../../node_modules/mocha/mocha.js</script>
<script src="../../../../../../../node_modules/wct-mocha/wct-
mocha.js"></script>
<script src="../../../../../../../node_modules/web-component-tester/browser.js"></script>
<script type="module" src="../essen-list.component.js"></script>
</head>
<body>
<mp-essen-list></mp-essen-list>
<script>
suite('suite', function () {
const list = document.body.querySelector('mp-essen-list');
test('test', function () {
list.setAttribute('value', 100);
assert.equal(list.value, 100);
//console.log('test');
//assert.equal(list.shadowRoot.querySelector('#speisekarte').style.left, 50);
});
});
</script>
</body>
</html>
Изменить: Я заметил, что это не неправильный путь. Я просмотрел ошибки консоли и обнаружил следующую ошибку:
wct-mocha.js:2446 Uncaught Error: WCT requires Mocha. Please ensure that it is present in WCT.environmentScripts, or that you load it before loading web-component-tester/browser.js
at _ensureMocha (wct-mocha.js:2446)
at Object.ensureDependenciesPresent (wct-mocha.js:2435)
at HTMLDocument.<anonymous> (wct-mocha.js:2781)