Когда я импортирую компонент (react-slider
) и стилизую его с помощью Styled Components, Jest падает.
Код этого выглядит следующим образом:
Мой Component.styles.js
файл:
import styled, { css } from 'styled-components'
import ReactSlider from 'react-slider'
const StyledReactSlider = styled(ReactSlider)`
...CSS here
`
Мой компонент выглядит следующим образом:
import React from 'react'
import PropTypes from 'prop-types'
import * as Styled from './Component.styles'
...Lots of code
<Styled.StyledReactSlider
barClassName={'slider-bar'}
handleClassName={'slider-handle'}
withBars
max={max}
value={value}
onChange={onChange}
/>
...Lots more code
И, наконец, мой очень простой тестовый файл:
import React from 'react'
import { mount } from 'enzyme'
import 'jest-styled-components'
import MyComponent from './MyComponent'
describe('Component Tests ', () => {
it(`should render the <MyComponent /> default correctly`, () => {
const component = mount(<MyComponent />)
expect(component).toMatchSnapshot()
component.unmount()
})
})
Результатом этого является большая ошибка, котораяпохоже, что узлу не хватает памяти (куча JavaScript из памяти сообщений), терминал зависает.
Это использует react-slider 0.11.2
, styled-components 4.3.1
и jest 24.8.0
.
Примечание : Тест выполняется нормально, если я не импортирую компонент в файл стилей, поэтому я думаю, что я должен что-то делать неправильно со стилем импортированного компонента?