Fatal编程技术网
  • javascript/
  • Javascript 未捕获错误：WCT要求web组件测试器中出现Mocha错误

Javascript 未捕获错误：WCT要求web组件测试器中出现Mocha错误

javascript npm

Javascript 未捕获错误：WCT要求web组件测试器中出现Mocha错误,javascript,npm,web-component,web-component-tester,Javascript,Npm,Web Component,Web Component Tester,我想设置web组件测试仪来测试我的web组件。我通过npm（devDependency）安装了它，并创建了以下脚本： <script> WCT.loadSuites(["src/app/modules/essen/components/essen-list/test/wct-test.html"]); <script> package.json: "scripts": { "wcttest": &q

我想设置web组件测试仪来测试我的web组件。我通过npm（devDependency）安装了它，并创建了以下脚本：

<script>
WCT.loadSuites(["src/app/modules/essen/components/essen-list/test/wct-test.html"]);
<script>
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
是项目文件夹的根名称。但是我不明白，为什么它首先打开
组件
路径

该测试打开了我安装的所有浏览器，但除了一个白色页面外，没有其他内容。如果打开控制台，将显示以下脚本：

<script>
WCT.loadSuites(["src/app/modules/essen/components/essen-list/test/wct-test.html"]);
<script>


loadSuites（[“src/app/modules/essen/components/essen list/test/WCT test.html]”）；
这里的路径看起来是正确的

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>