fix(external pointer): avoid recursive-loops on pointer events

[markov00]

Summary

If the consumer code doesn't take care of correctly distribute the pointer events avoiding feeding a chart with its own cursor position, it will end up with a recursive loop that ultimately throw a max stack trace. This provide the fix for such case.

BREAKING CHANGE: The onCursorUpdate Settings property is changed to a more generic
onPointerUpdate. The same apply for the event type CursorEvent that is now PointerEvent and can assume a PointerOverEvent or PointOutEvent shape (see TS types)

To test on previous version:

import React from 'react';
import { Chart, Settings, TooltipType, AreaSeries, PointerEvent } from '../src';
import { KIBANA_METRICS } from '../src/utils/data_samples/test_dataset_kibana';
export class Playground extends React.Component {
  chartRef: React.RefObject<Chart> = React.createRef();
  chartRef2: React.RefObject<Chart> = React.createRef();
  onPointerUpdate = (event: PointerEvent) => {
    if (this.chartRef && this.chartRef.current) {
      this.chartRef.current.dispatchExternalPointerEvent(event);
    }
    if (this.chartRef2 && this.chartRef2.current) {
      this.chartRef2.current.dispatchExternalPointerEvent(event);
    }
  };
  render() {
    return (
      <>
        <button onClick={this.onSnapshot}>Snapshot</button>
        <div className="chart">
          <Chart ref={this.chartRef}>
            <Settings
              tooltip={{ type: TooltipType.VerticalCursor }}
              showLegend
              onPointerUpdate={this.onPointerUpdate}
            />
            <AreaSeries
              id="lines"
              xAccessor={0}
              yAccessors={[1]}
              stackAccessors={[0]}
              data={KIBANA_METRICS.metrics.kibana_os_load[0].data.slice(0, 5)}
            />
          </Chart>
        </div>
        <div className="chart">
          <Chart ref={this.chartRef2}>
            <Settings
              tooltip={{ type: TooltipType.VerticalCursor }}
              showLegend
              onPointerUpdate={this.onPointerUpdate}
            />
            <AreaSeries
              id="lines"
              xAccessor={0}
              yAccessors={[1]}
              stackAccessors={[0]}
              data={KIBANA_METRICS.metrics.kibana_os_load[0].data.slice(0, 5)}
            />
          </Chart>
        </div>
      </>
    );
  }
}

fix #504

Checklist

Use strikethroughs to remove checklist items you don't feel are applicable to this PR.

• Any consumer-facing exports were added to src/index.ts (and stories only import from ../src except for test data & storybook)
• This was checked for cross-browser compatibility, including a check against IE11
• [ ] Proper documentation or storybook story was added for features that require explanation or tutorials
• Unit tests were updated or added to match the most common scenarios
• Each commit follows the convention

[codecov-io]

Codecov Report

Merging #503 into master will increase coverage by 0.7%.
The diff coverage is 94.73%.

@@            Coverage Diff            @@
##           master     #503     +/-   ##
=========================================
+ Coverage   83.84%   84.55%   +0.7%     
=========================================
  Files         158      169     +11     
  Lines        4729     4887    +158     
  Branches      963      983     +20     
=========================================
+ Hits         3965     4132    +167     
+ Misses        749      739     -10     
- Partials       15       16      +1

Impacted Files	Coverage Δ
src/specs/settings.tsx	100% <100%> (ø)	⬆️
src/components/chart.tsx	77.01% <100%> (ø)	⬆️
...hart/state/selectors/get_elements_at_cursor_pos.ts	95% <100%> (+15%)	⬆️
src/state/actions/events.ts	100% <100%> (+33.33%)	⬆️
..._types/xy_chart/state/selectors/get_cursor_band.ts	90.32% <100%> (+12.9%)	⬆️
src/utils/events.ts	100% <100%> (+50%)	⬆️
src/state/chart_state.ts	85.71% <100%> (+6.12%)	⬆️
.../selectors/get_tooltip_values_highlighted_geoms.ts	90.9% <100%> (+3.4%)	⬆️
...xy_chart/state/selectors/on_pointer_move_caller.ts	95.23% <88.23%> (+37.09%)	⬆️
src/mocks/series/series.ts	81.96% <0%> (ø)
... and 16 more

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 48db8c8...3e1ba7a. Read the comment docs.

[markov00]

🎉 This PR is included in version 16.0.0 🎉

The release is available on:

• GitHub release
• npm package (@latest dist-tag)

Your semantic-release bot 📦🚀