Это мой первый пост, давний тайник.
Я пытаюсь написать тест для компонента-оболочки React (<Chart />
) для Highcharts. Да, я знаю о реакции высоких карт, но я предпочитаю катиться с моими собственными компонентами. Диаграмма отображается в componentDidMount()
, и я получаю распространенную ошибку Highcharts # 13 при попытке запустить мой тест. Кто-нибудь может предложить лучший способ тестирования компонентов, которые отображаются с componentDidMount()
с ферментом?
Я пытался явно вызвать wrapper.instance().componentDidMount()
, но я получаю ту же ошибку.
chart.test.tsx
import * as React from 'react';
import { shallow } from 'enzyme';
import { Chart } from '../chart';
const chartData: Highcharts.Options = {
chart: {
type: 'bar'
},
plotOptions: {
bar: {
dataLabels: {
enabled: false
},
pointWidth: 12,
pointPadding: 0
},
series: {
borderWidth: 0
}
},
xAxis: {
categories: [0, 1, 2].map(String)
},
series: [{
name: 'Me',
data: [507, 831, 635, 1203, 728],
type: 'bar'
},
{
name: 'My Team',
data: [633, 656, 947, 908, 623],
type: 'bar'
},
{
name: 'Median',
data: [973, 914, 1054, 732, 834],
type: 'bar'
}]
};
describe('Chart', () => {
it('ComponentDidMount', () => {
const wrapper = shallow(
<Chart
id="my-chart"
config={chartData}
/>
);
wrapper.instance().componentDidMount();
expect(wrapper.find('.highcharts-container').length).toBe(1);
});
});
Ожидаемый результат - найти обработанный компонент <Chart />
, у которого есть дочерний элемент .highcharts-container
. Заранее спасибо!