diff --git a/superset/assets/javascripts/chart/Chart.jsx b/superset/assets/javascripts/chart/Chart.jsx index d370c7947da..111c48ee24d 100644 --- a/superset/assets/javascripts/chart/Chart.jsx +++ b/superset/assets/javascripts/chart/Chart.jsx @@ -87,7 +87,7 @@ class Chart extends React.PureComponent { componentDidUpdate(prevProps) { if ( this.props.queryResponse && - this.props.chartStatus === 'success' && + ['success', 'rendered'].indexOf(this.props.chartStatus) > -1 && !this.props.queryResponse.error && ( prevProps.annotationData !== this.props.annotationData || prevProps.queryResponse !== this.props.queryResponse || @@ -210,7 +210,7 @@ class Chart extends React.PureComponent { {!this.props.chartAlert && { diff --git a/superset/assets/spec/javascripts/chart/Chart_spec.jsx b/superset/assets/spec/javascripts/chart/Chart_spec.jsx new file mode 100644 index 00000000000..f4754f477ca --- /dev/null +++ b/superset/assets/spec/javascripts/chart/Chart_spec.jsx @@ -0,0 +1,71 @@ +import React from 'react'; +import { shallow } from 'enzyme'; +import { describe, it } from 'mocha'; +import { expect } from 'chai'; +import sinon from 'sinon'; + +import { chart as initChart } from '../../../javascripts/chart/chartReducer'; +import Chart from '../../../javascripts/chart/Chart'; + +describe('Chart', () => { + const chart = { + ...initChart, + queryResponse: { + form_data: {}, + error: null, + status: 'success', + }, + }; + const mockedProps = { + ...chart, + chartKey: 'slice_223', + containerId: 'slice-container-223', + datasource: {}, + formData: {}, + vizType: 'pie', + height: 300, + width: 400, + actions: { + runQuery: () => {}, + }, + }; + + describe('renderViz', () => { + let wrapper; + let stub; + beforeEach(() => { + wrapper = shallow( + , + ); + stub = sinon.stub(wrapper.instance(), 'renderViz'); + }); + + it('should not call when loading', () => { + const prevProp = wrapper.props(); + wrapper.setProps({ + height: 100, + }); + wrapper.instance().componentDidUpdate(prevProp); + expect(stub.callCount).to.equals(0); + }); + + it('should call after chart stop loading', () => { + const prevProp = wrapper.props(); + wrapper.setProps({ + chartStatus: 'success', + }); + wrapper.instance().componentDidUpdate(prevProp); + expect(stub.callCount).to.equals(1); + }); + + it('should call after resize', () => { + const prevProp = wrapper.props(); + wrapper.setProps({ + chartStatus: 'rendered', + height: 100, + }); + wrapper.instance().componentDidUpdate(prevProp); + expect(stub.callCount).to.equals(1); + }); + }); +});