npm - 如何在不依赖 bower 的情况下运行 web-component-tester 来测试 vanilla web-component

问题描述

我在 GIT 中发现了一些类似的问题，但使用的是 Polymer，而我根本没有使用它。

我在下面粘贴了我得到的错误以及到目前为止我是如何尝试的。

我的测试文件：

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <script src="../node_modules/web-component-tester/browser.js"></script>
        <script src="../public/simple-call.js"></script>
    </head>
    <body>

        <test-fixture id="simple-call-fixture">
            <simple-call></simple-call>
        </test-fixture>

        <script>

            suite('<simple-call>', function() {

                let component = document.querySelector('simple-call');

                test('renders div', () => {
                    assert.isOk(component.shadowRoot.querySelector('input'));
                });

            });
        </script>
    </body>
</html>

香草网络组件

const template = document.createElement('template');
template.innerHTML = `<input id="inputSimpleRequest"/>`;

class SimpleCall extends HTMLElement {
  constructor() {
    super();
  }

  connectedCallback() {

    this.attachShadow({mode: 'open'})
    this.shadowRoot.appendChild(template.content.cloneNode(true))

    const inputSimpleRequest = this.shadowRoot.getElementById('inputSimpleRequest');
    const url = 'http://localhost:8081/';

    fetch(url)
    .then(response => response.json())
    .then(data => {
      inputSimpleRequest.value = data.somephrase; 
    })
    .catch(error => console.error(error));

  }
}

window.customElements.define("simple-call", SimpleCall);

包.json

{
  "name": "simplest-webcomponent",
  "version": "0.1.0",
  "private": true,
  "proxy": "http://localhost:5000",
  "dependencies": {
    "express": "^4.17.1",
    "mocha": "^6.1.4",
    "web-component-tester": "^6.9.2"
  }
}

安慰

# wct                                                                                                                                                                    
Installing and starting Selenium server for local browsers                                                                                                               
Selenium server running on port 51339                                                                                                                                    
no bower.json found, defaulting to packageName=simplest-webcomponent                                                                                                     



Error:                                                                                                                                                                   
The web-component-tester Bower package is not installed as a dependency of this project (simplest-webcomponent).                                                         

Please run this command to install:                                                                                                                                      
    bower install --save-dev web-component-tester                                                                                                                        

Web Component Tester >=6.0 requires that support files needed in the browser are installed as part of the project's dependencies or dev-dependencies. This is to give pro
jects greater control over the versions that are served, while also making Web Component Tester's behavior easier to understand.                                         

Expected to find a package.json or bower.json or .bower.json at: C:\_d\WSs\simplest-webcomponent\bower_components\web-component-tester/

标签： npmmocha.jsweb-componentwct

npm - 如何在不依赖 bower 的情况下运行 web-component-tester 来测试 vanilla web-component

问题描述

解决方案

推荐阅读