Skip to content

Commit 501166a

Browse files
author
William Hawker
committed
Fix adding of events to series, Series was not defined via getSeries provided method
1 parent 43dcf52 commit 501166a

File tree

5 files changed

+111
-51
lines changed

5 files changed

+111
-51
lines changed

dist/react-jsx-highcharts.js

Lines changed: 66 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -375,7 +375,7 @@ function provideChart(WrappedComponent) {
375375

376376
var _this = (0, _possibleConstructorReturn3.default)(this, (ChartProvider.__proto__ || (0, _getPrototypeOf2.default)(ChartProvider)).call(this, props, context));
377377

378-
(0, _providedProps2.default)('ChartProvider', ['get', 'update', 'addAxis', 'addSeries', 'setTitle', 'getChart']);
378+
(0, _providedProps2.default)('ChartProvider', ['get', 'update', 'addAxis', 'addSeries', 'setTitle', 'getChart', 'getChartType']);
379379
return _this;
380380
}
381381

@@ -865,6 +865,8 @@ function provideAxis(WrappedComponent) {
865865
(0, _createClass3.default)(AxisProvider, [{
866866
key: 'render',
867867
value: function render() {
868+
var _this2 = this;
869+
868870
var id = this.props.axisId || this.props.id;
869871
if (!id) return null;
870872

@@ -876,7 +878,7 @@ function provideAxis(WrappedComponent) {
876878
var addPlotLine = axis && axis.addPlotLine.bind(axis);
877879
var removePlotLine = axis && axis.removePlotLine.bind(axis);
878880
var getAxis = function getAxis() {
879-
return axis;
881+
return _this2.props.get(id);
880882
};
881883

882884
return _react2.default.createElement(WrappedComponent, (0, _extends3.default)({}, this.props, {
@@ -3454,6 +3456,10 @@ var _react = __webpack_require__(5);
34543456

34553457
var _react2 = _interopRequireDefault(_react);
34563458

3459+
var _highstockRelease = __webpack_require__(29);
3460+
3461+
var _highstockRelease2 = _interopRequireDefault(_highstockRelease);
3462+
34573463
var _ChartProvider = __webpack_require__(10);
34583464

34593465
var _ChartProvider2 = _interopRequireDefault(_ChartProvider);
@@ -3483,13 +3489,46 @@ function provideSeries(WrappedComponent) {
34833489

34843490
var _this = (0, _possibleConstructorReturn3.default)(this, (SeriesProvider.__proto__ || (0, _getPrototypeOf2.default)(SeriesProvider)).call(this, props, context));
34853491

3486-
(0, _providedProps2.default)('SeriesProvider', ['update', 'remove', 'setData', 'setVisible', 'getSeries']);
3492+
(0, _providedProps2.default)('SeriesProvider', ['update', 'remove', 'setData', 'setVisible', 'getSeries', 'seriesAdded']);
3493+
3494+
_this.handleSeriesAdded = _this.handleSeriesAdded.bind(_this);
3495+
_this.state = {
3496+
seriesAdded: false
3497+
};
34873498
return _this;
34883499
}
34893500

34903501
(0, _createClass3.default)(SeriesProvider, [{
3502+
key: 'componentWillMount',
3503+
value: function componentWillMount() {
3504+
var _props = this.props,
3505+
get = _props.get,
3506+
getChart = _props.getChart;
3507+
3508+
var id = this.props.seriesId || this.props.id;
3509+
3510+
if (get(id)) {
3511+
return this.setState({
3512+
seriesAdded: true
3513+
});
3514+
}
3515+
3516+
_highstockRelease2.default.addEvent(getChart(), 'addSeries', this.handleSeriesAdded);
3517+
}
3518+
}, {
3519+
key: 'handleSeriesAdded',
3520+
value: function handleSeriesAdded(e) {
3521+
if (e.options.id !== this.props.id) return;
3522+
3523+
this.setState({
3524+
seriesAdded: true
3525+
});
3526+
}
3527+
}, {
34913528
key: 'render',
34923529
value: function render() {
3530+
var _this2 = this;
3531+
34933532
var id = this.props.seriesId || this.props.id;
34943533
var series = this.props.get(id);
34953534
if (!series && expectsSeriesExists) return null;
@@ -3499,15 +3538,16 @@ function provideSeries(WrappedComponent) {
34993538
var setData = series && series.setData.bind(series);
35003539
var setVisible = series && series.setVisible.bind(series);
35013540
var getSeries = function getSeries() {
3502-
return series;
3541+
return _this2.props.get(id);
35033542
};
35043543

35053544
return _react2.default.createElement(WrappedComponent, (0, _extends3.default)({}, this.props, {
35063545
update: (0, _cleanPropsBeforeUpdate2.default)(update),
35073546
remove: remove,
35083547
setData: setData,
35093548
setVisible: setVisible,
3510-
getSeries: getSeries }));
3549+
getSeries: getSeries,
3550+
seriesAdded: !!series }));
35113551
}
35123552
}]);
35133553
return SeriesProvider;
@@ -10944,45 +10984,43 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
1094410984
var Series = function (_Component) {
1094510985
(0, _inherits3.default)(Series, _Component);
1094610986

10947-
function Series(props) {
10987+
function Series() {
1094810988
(0, _classCallCheck3.default)(this, Series);
10949-
10950-
var _this = (0, _possibleConstructorReturn3.default)(this, (Series.__proto__ || (0, _getPrototypeOf2.default)(Series)).call(this, props));
10951-
10952-
_this.state = {
10953-
rendered: false
10954-
};
10955-
return _this;
10989+
return (0, _possibleConstructorReturn3.default)(this, (Series.__proto__ || (0, _getPrototypeOf2.default)(Series)).apply(this, arguments));
1095610990
}
1095710991

1095810992
(0, _createClass3.default)(Series, [{
10959-
key: 'componentDidMount',
10960-
value: function componentDidMount() {
10993+
key: 'componentWillMount',
10994+
value: function componentWillMount() {
1096110995
var _props = this.props,
1096210996
children = _props.children,
1096310997
dimension = _props.dimension,
1096410998
axisId = _props.axisId,
1096510999
addSeries = _props.addSeries,
10966-
getSeries = _props.getSeries,
10967-
rest = (0, _objectWithoutProperties3.default)(_props, ['children', 'dimension', 'axisId', 'addSeries', 'getSeries']);
11000+
rest = (0, _objectWithoutProperties3.default)(_props, ['children', 'dimension', 'axisId', 'addSeries']);
1096811001

1096911002
var nonEventProps = (0, _events.getNonEventHandlerProps)(rest);
1097011003
addSeries((0, _extends4.default)((0, _defineProperty3.default)({}, dimension + 'Axis', axisId), nonEventProps), true);
11004+
}
11005+
}, {
11006+
key: 'componentDidMount',
11007+
value: function componentDidMount() {
11008+
var _props2 = this.props,
11009+
getSeries = _props2.getSeries,
11010+
rest = (0, _objectWithoutProperties3.default)(_props2, ['getSeries']);
11011+
1097111012
(0, _events2.default)(getSeries(), rest);
10972-
this.setState({
10973-
rendered: true
10974-
});
1097511013
}
1097611014
}, {
1097711015
key: 'componentDidUpdate',
1097811016
value: function componentDidUpdate(prevProps) {
10979-
var _props2 = this.props,
10980-
visible = _props2.visible,
10981-
setVisible = _props2.setVisible,
10982-
data = _props2.data,
10983-
setData = _props2.setData,
10984-
update = _props2.update,
10985-
rest = (0, _objectWithoutProperties3.default)(_props2, ['visible', 'setVisible', 'data', 'setData', 'update']);
11017+
var _props3 = this.props,
11018+
visible = _props3.visible,
11019+
setVisible = _props3.setVisible,
11020+
data = _props3.data,
11021+
setData = _props3.setData,
11022+
update = _props3.update,
11023+
rest = (0, _objectWithoutProperties3.default)(_props3, ['visible', 'setVisible', 'data', 'setData', 'update']);
1098611024

1098711025
// Using setData is more performant than update
1098811026

@@ -11008,7 +11046,7 @@ var Series = function (_Component) {
1100811046
value: function render() {
1100911047
var children = this.props.children;
1101011048

11011-
return children && this.state.rendered ? children : null;
11049+
return children && this.props.seriesAdded ? children : null;
1101211050
}
1101311051
}]);
1101411052
return Series;

src/components/AxisProvider/index.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export default function provideAxis(WrappedComponent) {
3131
const removePlotBand = axis && axis.removePlotBand.bind(axis);
3232
const addPlotLine = axis && axis.addPlotLine.bind(axis);
3333
const removePlotLine = axis && axis.removePlotLine.bind(axis);
34-
const getAxis = () => axis;
34+
const getAxis = () => this.props.get(id);
3535

3636
return (
3737
<WrappedComponent

src/components/Series/Series.js

Lines changed: 7 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -27,25 +27,18 @@ class Series extends Component {
2727
visible: true
2828
};
2929

30-
constructor (props) {
31-
super(props);
32-
33-
this.state = {
34-
rendered: false
35-
};
36-
}
37-
38-
componentDidMount () {
39-
const { children, dimension, axisId, addSeries, getSeries, ...rest } = this.props;
30+
componentWillMount () {
31+
const { children, dimension, axisId, addSeries, ...rest } = this.props;
4032
const nonEventProps = getNonEventHandlerProps(rest);
4133
addSeries({
4234
[`${dimension}Axis`]: axisId,
4335
...nonEventProps
4436
}, true);
37+
}
38+
39+
componentDidMount () {
40+
const { getSeries, ...rest } = this.props;
4541
addEventProps(getSeries(), rest);
46-
this.setState({
47-
rendered: true
48-
});
4942
}
5043

5144
componentDidUpdate (prevProps) {
@@ -71,7 +64,7 @@ class Series extends Component {
7164

7265
render () {
7366
const { children } = this.props;
74-
return (children && this.state.rendered) ? children : null;
67+
return (children && this.props.seriesAdded) ? children : null;
7568
}
7669
}
7770

src/components/SeriesProvider/index.js

Lines changed: 31 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import React, { Component } from 'react';
2+
import Highcharts from 'highstock-release';
23
import provideChart from '../ChartProvider';
34
import providedProps from '../../utils/providedProps';
45
import cleanPropsBeforeUpdate from '../../utils/cleanPropsBeforeUpdate';
@@ -16,8 +17,34 @@ export default function provideSeries(WrappedComponent, expectsSeriesExists = tr
1617

1718
providedProps(
1819
'SeriesProvider',
19-
['update', 'remove', 'setData', 'setVisible', 'getSeries']
20+
['update', 'remove', 'setData', 'setVisible', 'getSeries', 'seriesAdded']
2021
);
22+
23+
this.handleSeriesAdded = this.handleSeriesAdded.bind(this);
24+
this.state = {
25+
seriesAdded: false
26+
};
27+
}
28+
29+
componentWillMount () {
30+
const { get, getChart } = this.props;
31+
const id = this.props.seriesId || this.props.id;
32+
33+
if (get(id)) {
34+
return this.setState({
35+
seriesAdded: true
36+
});
37+
}
38+
39+
Highcharts.addEvent(getChart(), 'addSeries', this.handleSeriesAdded);
40+
}
41+
42+
handleSeriesAdded (e) {
43+
if (e.options.id !== this.props.id) return;
44+
45+
this.setState({
46+
seriesAdded: true
47+
});
2148
}
2249

2350
render () {
@@ -29,7 +56,7 @@ export default function provideSeries(WrappedComponent, expectsSeriesExists = tr
2956
const remove = series && series.remove.bind(series);
3057
const setData = series && series.setData.bind(series);
3158
const setVisible = series && series.setVisible.bind(series);
32-
const getSeries = () => series;
59+
const getSeries = () => this.props.get(id);
3360

3461
return (
3562
<WrappedComponent
@@ -38,7 +65,8 @@ export default function provideSeries(WrappedComponent, expectsSeriesExists = tr
3865
remove={remove}
3966
setData={setData}
4067
setVisible={setVisible}
41-
getSeries={getSeries} />
68+
getSeries={getSeries}
69+
seriesAdded={!!series} />
4270
);
4371
}
4472
}

test/components/Series/Series.spec.js

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ describe('<Series />', function () {
2929
<Series id="mySeries" axisId="myAxis" dimension="x" addSeries={this.addSeries} getSeries={this.getSeries} />
3030
);
3131
expect(this.addSeries).to.have.been.calledWith(
32-
{ id: 'mySeries', xAxis: 'myAxis', type: 'line', data: [], visible: true }, true
32+
{ id: 'mySeries', xAxis: 'myAxis', type: 'line', data: [], visible: true, getSeries: this.getSeries }, true
3333
);
3434
});
3535

@@ -38,7 +38,7 @@ describe('<Series />', function () {
3838
<Series id="mySeries" axisId="myAxis" dimension="y" addSeries={this.addSeries} getSeries={this.getSeries} />
3939
);
4040
expect(this.addSeries).to.have.been.calledWith(
41-
{ id: 'mySeries', yAxis: 'myAxis', type: 'line', data: [], visible: true }, true
41+
{ id: 'mySeries', yAxis: 'myAxis', type: 'line', data: [], visible: true, getSeries: this.getSeries }, true
4242
);
4343
});
4444

@@ -48,9 +48,10 @@ describe('<Series />', function () {
4848
addSeries={this.addSeries}
4949
getSeries={this.getSeries} />
5050
);
51-
expect(this.addSeries).to.have.been.calledWith(
52-
{ id: 'mySeries', yAxis: 'myAxis', type: 'line', data: [5], visible: true, step: true }, true
53-
);
51+
expect(this.addSeries).to.have.been.calledWith({
52+
id: 'mySeries', yAxis: 'myAxis', type: 'line', data: [5],
53+
visible: true, step: true, getSeries: this.getSeries
54+
}, true);
5455
});
5556

5657
it('subscribes to Highcharts events for props that look like event handlers', function () {

0 commit comments

Comments
 (0)