View hitTest wrong GRAPHIC

Question

I'm using the view hitTest function to determine which feature is selected. But it seems like there are some issues with the hitTest for a dynamic updating layer.

Reproduce steps:

- A FeatureLayer displaying 40 graphics. Each 100ms a mocked update will be processed by ApplyEdits. 
- HitTest function with hitResults[ => The first result will be used for the content and location of the popup.

Why we're using hitTest:

We're creating a custom web element for displaying a popup instead of displaying the default popupTemplate. (should be created each time an asset changes)

=> A wrong popup is displayed when clicking a feature/graphic.

Codepen

https://codepen.io/michaelk95/pen/abKoGxz?editors=1000

Thanks

MKpoa · Answer

https://community.esri.com/t5/arcgis-api-for-javascript-questions/selected-feature-popup-not-correct/td-p/1234432

New issue (selected feature)

MKpoa · Answer

When applying your changes in a codepen, I still see the same issues. 
Seems like the results of the hitTest function returns the wrong feature. (Because the layer is updating at the same time)

JoelBennett · Answer

The problem isn't so much with hitTest as it is with the workflow.  On a click, the popup is natively opened for the clicked feature, and your handler simply updates its location (without need).  Then, as applyEdits is repeatedly called, it seems the location gets out of sync with the features value (which was natively set).

I recommend making the following adjustments (the first line of each has not been changed from what you wrote, but the rest have):

layer.applyEdits(edits).then((res) => {
	if ((view.popup.visible) && (popupID === graphicForUpdate.attributes.ObjectID))
		view.popup.location = graphicForUpdate.geometry.centroid;
});

view.on('click', (event) => {
	popupID = 0;
	view.hitTest(event).then((hitResult) => {
		if ((Array.isArray(hitResult.results)) && (hitResult.results.length !== 0) && (hitResult.results[0].type == "graphic"))
			popupID = hitResult.results[0].graphic.attributes.ObjectID;
	});
});