Sticky selections with polygons

[Oliver_Burdekin]

I'm using the javascript SDK 4.31 and would like the user to be able to select polygon features. This works but if the user clicks a shared boundary two polygons are selected. the code aims to reset the UI if the user clicks outside the feature layer (i.e. deselecting all polygons) but one of the shared boundary polygons will persist. Below is a gif to demonstrate and the codepen available here: https://codepen.io/Oliver-Burdekin/pen/ZYzvBww

Is there a better way to deal with selections and why might the selection be persisting?

[UndralBatsukh]

Hi there, 

I noticed that in your app, you're calling the LayerView.highlight() method inside a forEach loop, which is unintentionally overriding your highlightHandle. This happens because if multiple graphics are returned from the hitTest, the highlightHandle will end up referencing only the last graphic in the list.

To fix this, I made some updates to your codepen. Instead of highlighting each graphic individually inside the loop, I now map all the graphics from the hitTest() and pass them together to the highlight() method. This ensures that the highlightHandle will reference all the highlighted graphics, not just the last one. Hope this makes sense.

[Oliver_Burdekin]

Thanks Undral, that does make sense and it was very good of you to update the codepen. This fixes the selection not clearing. I think using geometryEngine.contains might work for preventing a click on a shared boundary selecting both features as well.