javascript - enzyme /Jest 测试错误 - 不变违规 : Target container is not a DOM element

Question

我刚开始进行单元测试，但一直收到错误消息:不变违规:目标容器不是 DOM 元素。我认为这与我的 app.js 的结构方式有关，因为它一直引用这一行 ReactDOM.render(, document.getElementById('app'));。下面是它现在的结构:

import React from 'react';
import ReactDOM from 'react-dom';
import HomePage from './HomePage';

class App extends React.Component {
  render() {
    return (

      <div>
        <HomePage />
      </div>
    )
  }
}

ReactDOM.render(<App />, document.getElementById('app'));

这是否需要为了测试目的而重组？

Answer 1

您应该将文件的两部分分开，组件声明和通过 ReactDom 安装到 Dom 中。

ReactDom 与测试无关。

从“ react ”中导入 react ；从 'react-dom' 导入 ReactDOM；从 './HomePage' 导入主页；

// App.jsx
import React from 'react';
import HomePage from './HomePage';

export class App extends React.Component {
  render() {
    return (

      <div>
        <HomePage />
      </div>
    )
  }
}

// index.jsx
import React from 'react';
import ReactDOM from 'react-dom';
import {App} from './App';

ReactDOM.render(<App />, document.getElementById('app'));