Энзимный базовый тест с использованием мелких ошибок с "Target is not a DOM element"

Я пробую невероятно простой тест, используя shallow. У меня было впечатление, что shallow требует нулевых зависимостей вне самого компонента, но я попал в эту ошибку:

 FAIL  src/test/app/AppHeader/buttons/LogoButton.test.tsx

  ● Test suite failed to run



    Invariant Violation: Target container is not a DOM element.



      16 |   })

      17 | }

    > 18 | 

      19 | ReactDOM.render(

      20 |   <Provider store={store}>

      21 |     <Router history={history}>



      at invariant (node_modules/react-dom/cjs/react-dom.development.js:55:15)

Мой код для теста:

import * as React from 'react'

import { shallow } from 'enzyme'

import LogoButton from 'components/app/AppHeader/buttons/LogoButton'



describe('test of initial load', () => {

    it('test', () => {

        const wrapper = shallow(

            <LogoButton />

        )

        expect(true).toBe(true)

    })

})

И мой index.tsx (который является местом ошибки) таков:

import * as React from 'react'

import * as ReactDOM from 'react-dom'

import './index.css'

import registerServiceWorker from 'registerServiceWorker'

import store from 'redux/Store'

import { Provider } from 'react-redux'

import { createHashHistory } from 'history'

import { Router } from 'react-router-dom'

import Root from 'routes/Root'



export const history = createHashHistory()



if (process.env.NODE_ENV !== 'production') {

  Object.defineProperty(window, 'store', {

    get: () => store.getState()

  })

}



ReactDOM.render(

  <Provider store={store}>

    <Router history={history}>

        <Root />

    </Router>

  </Provider>,

  document.getElementById('root') as HTMLElement

)

registerServiceWorker()

Я считаю, что тот факт, что я использую TypeScript, не имеет отношения к моей проблеме. Честно говоря, я понятия не имею, что случилось. На общем уровне я мог понять, почему это произойдет, если я использую mount, но почему с shallow? Почему этот тест столкнулся с проблемами с моим кодом в index.tsx?

class LogoButton extends React.Component<Props> {

    handleReset = async () => {

        history.push('/')

        this.props.setUIElementStatus({

            uiElement: UI_ELEMENTS.UI_SEARCH_BAR, show: false

        })

        this.props.setSearchInputValue({ text: '' })

    }



    render() {

        const { titleFilled, titleBlank } = this.props.classes

        const titleClass = this.props.uiStatus.searchBar ? titleFilled : titleBlank

        const navButtonProps = {

            onClick: this.handleReset,

            className: titleClass,

            variant: 'flat' as 'flat',

            disableFocusRipple: true,

            disableRipple: true

        }

        return (

            <Button {...navButtonProps}>

                Tansaki

            </Button>

        )

    }

}



const mapStateToProps = (state: storeTypes.Store) => {

    const { uiStatus } = state

    return { uiStatus }

}



const { setSearchInputValue } = InputActions

const { setUIElementStatus } = UiActions



const mapDispatchToProps = { setSearchInputValue, setUIElementStatus }



export default withStyles(styles)(connect(

    mapStateToProps, mapDispatchToProps

)(LogoButton))