Как смоделировать теневой элемент в шутливом тестировании - PullRequest
Новая
       20

Как смоделировать теневой элемент в шутливом тестировании

1 голос
/ 11 января 2020

У меня есть компонент реагирования ReactComponentContainer, который получает конфигурацию и shadowRoot. 

import React from 'react';
import App from './App';
import ReactComponent from './ReactComponent';

const ReactComponentContainer = function({config, shadowRoot}) {

  configme(shadowRoot.host || shadowRoot);

  return (
    <App renderRoot={shadowRoot}>
      <ReactComponent/>
    </App>
  );
};

export default ReactComponentContainer;

В моем тестовом файле jest мне нужно смоделировать теневой домен, чтобы я мог перейти к ReactComponentContainer в качестве параметра. 

const header = document.createElement('header');
const shadowRoot = header.attachShadow({mode: 'open'});
shadowRoot.innerHTML = '<h1>Hello Shadow DOM</h1>';

import React from 'react';
import ReactComponentContainer from './ReactComponentContainer';

describe('ReactComponentContainer', () => {
  beforeEach(() => {
    setUp = (props) => {
      return mount(<ReactComponentContainer {...props} />);
    };
  });

  it('initailize ReactComponentContainer', () => {

    // mock a shadow dom
    const header = document.createElement('header');
    // Error: attachShadow is undefined
    const shadowRoot = header.attachShadow({mode: 'open'});
    shadowRoot.innerHTML = '<h1>Hello Shadow DOM</h1>';

    const props = {
      config: {},
      renderRoot: shadowRoot
    };

    const element = setUp(props);
  });
});

Я получаю Error: attachShadow is undefined. Я думаю, потому что это только браузер.

Мой вопрос:

Как мне издеваться над теневым домом, чтобы я мог запустить его в шутливом тестировании?

...