Почему MockHTMLElement в шаблоне отсутствует метод insertAdjacentHTML? - PullRequest
Новая
       53

Почему MockHTMLElement в шаблоне отсутствует метод insertAdjacentHTML?

0 голосов
/ 30 октября 2019

Я пишу юнит-тесты для моего веб-компонента трафарета. В одном из моих методов я использовал insertHTMLElement над элементом, который находится внутри JSX моего веб-компонента. Компонент работает нормально, когда я обычно использую его в браузере.

Но при написании модульных тестов, когда я создаю этот компонент с использованием интерфейса newSpecPage, он ломается, потому что insertAdjacentHTML и аналогичные методы отсутствуют в интерфейсе MockHTMLElement, так как Jestзаменяет обычный интерфейс DOM своим собственным MockDOM

my-component.spec.ts 

 it('should work',()=>{
   const myComponent = await newSpecPage({
        components: [MyComponent],
        html: `<my-component></my-component>`
   }); // throws ERROR
   expect(myComponent.root.querySelector('#test')).notToBeNull(); // fails
 });

my-component.tsx 

@Component({
    tag: 'my-component'
})
export class MyComponent {
@Element() rootElem:HTMLElement;

    componentDidLoad() {
      // throws TypeError: this.rootElem.insertAdjacentHTML is not a function
      // this.rootElem is of type MockHTML element when run from test else HTMLELement
      this.rootElem.addAdjacentHTML('beforeend','<span id="test"></span>);
    }


    render() {
        return (
            <div id="container">
            </div>
        );
    }
}
...