javascript - Mocha Webcomponents testing - ReferenceError: customElements er ikke definert

Jeg prøver å gjøre noen veldig grunnleggende webkomponenttester ved å bruke TypeScript og Mocha. Jeg bruker jsdom for å mocke ut det grunnleggende dokumentet globalt, så jeg har --require jsdom-global/register i mine Mocha-innstillinger.

Her er min test:

import { assert } from "chai";

class WordCount extends HTMLParagraphElement {
  constructor() {
    super();
  }
}

describe("simple test", () => {
    it("works", () => {
      customElements.define('word-count', WordCount, { extends: 'p' });
      assert.isOk(true);
    });
});

Men jeg får følgende feil:

ReferenceError: customElements is not defined

Den nyeste versjonen av JSDom (som jeg bruker) støtter customElements. Jeg tror problemet koker ned til window.customElements mot customElements. Den førstnevnte syntaksen fungerer, men koden jeg prøver å teste bruker den sistnevnte syntaksen. Hva er forskjellen?

Svar #1

I nettleserkonteksten er det ingen forskjell mellom window.customElements og customElements fordi window er standardnavnerommet for variabler definert globalt.

var my_var = 'foo"
console.log( window.my_var ) //foo
console.log( window.customElement === customElement )

Testbiblioteket JSDoc kjøres i Node.js-konteksten, som ikke er en nettleser og derfor ikke vil eksponere window som sitt globale/standard navnerom.

Men JSDoc eksponerer en simulert nettleserkontekst gjennom en window-egenskap. Så du kan bruke window.customElements() og det er ingen forskjell med koden du prøver å teste.

Relaterte artikler