From a404ae3c5bc9719e97cd1bdd5c4ad456b141553c Mon Sep 17 00:00:00 2001 From: Victor Cazanave Date: Thu, 11 Jun 2020 11:13:30 +0800 Subject: [PATCH] Handle invalid id in checkbox svg map --- __tests__/checkbox-svg-map.test.js | 4 ++-- src/checkbox-svg-map.jsx | 5 +++-- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/__tests__/checkbox-svg-map.test.js b/__tests__/checkbox-svg-map.test.js index b083a3e..dd1d8cd 100644 --- a/__tests__/checkbox-svg-map.test.js +++ b/__tests__/checkbox-svg-map.test.js @@ -106,7 +106,7 @@ describe('CheckboxSVGMap component', () => { wrapper = mount( , { attachTo: container } @@ -121,7 +121,7 @@ describe('CheckboxSVGMap component', () => { handleOnChange.mockClear(); }); - test('selects initial locations when ids are provided', () => { + test('selects initial locations when valid ids are provided', () => { expect(selectedLocation.props()['aria-checked']).toBeTruthy(); expect(otherSelectedLocation.props()['aria-checked']).toBeTruthy(); expect(unselectedLocation.props()['aria-checked']).toBeFalsy(); diff --git a/src/checkbox-svg-map.jsx b/src/checkbox-svg-map.jsx index d2818ec..24d2b59 100644 --- a/src/checkbox-svg-map.jsx +++ b/src/checkbox-svg-map.jsx @@ -24,7 +24,8 @@ class CheckboxSVGMap extends React.Component { // Cannot use ref on SvgMap (with React 16.0.0) because it is a functional component // https://5a046bf5a6188f4b8fa4938a--reactjs.netlify.app/docs/refs-and-the-dom.html#refs-and-functional-components const svgNode = ReactDOM.findDOMNode(this); - const selectedLocations = this.props.selectedLocationIds.map(locationId => svgNode.getElementById(locationId)); + const selectedLocations = this.props.selectedLocationIds.map(locationId => svgNode.getElementById(locationId)) + .filter(location => !!location); // Remove null locations when invalid id this.setState({ selectedLocations }); } @@ -37,7 +38,7 @@ class CheckboxSVGMap extends React.Component { * @returns {boolean} True if the location is selected */ isLocationSelected(location) { - return this.state.selectedLocations.findIndex(selectedLocation => selectedLocation.id === location.id) > -1; + return this.state.selectedLocations.some(selectedLocation => selectedLocation.id === location.id); } /**