所以我有一个这样的index.html文件，在根div之外有一个span。

// index.html

<div id="root" class="root-container">
    <div class="splash-holder">
        <div class="triangle-holder">
            <div class="triangle four"></div>
            <div class="triangle five"></div>
            <div class="triangle six"></div>
        </div>
    </div>
</div>
<span class="hidden-tag" id="hidden-span"></span>

字符串
我的Index.js文件看起来像这样，你可以看到主应用程序正在root-container中呈现。

// index.js

const MainApp = () => (
    <Provider store={store}>
        <Foo />
    </Provider>
);

ReactDOM.render(<MainApp/>, document.querySelector('.root-container'));

型
我的Foo组件文件如下所示。

// Foo.js

const Foo = () => {
    const ele = document.getElementById('hidden-span');
    ele.innerHTML = 'dsaas';
}

型
虽然这在实际的应用程序中工作正常，但当我尝试使用react测试库渲染组件时。

// Foo.test.js

import { render } from '@testing-library/react';
import Foo from ./components;

render(<Foo />);

型
我得到了无法找到null的innerHTML的错误。我该如何解决这个问题？