Visibility problem in graphics drawing - js API 4.10

[NettaBeninson]

We are trying to upgrade our js api to 4.10 (from 4.8, 4.9 had some problems) and we are experiencing a major issue with graphics drawing behavior.

When drawing new polyline/polygon - the new shape is partially to not visible during the draw action - as seen in the attached video.

During the drawing action:

1. The new drawn shape seems truncated/cut by 'squares' (tiles?)

2. New graphic text is smeared (we are using the recently activated halo)

3. hittest is working on complex graphic - but the graphic is not visible

This behavior indicates a major change from 4.9 and prior which is not documented, I think it is the same issue as version 4.10 of Javascript API, GraphicsLayer items truncated 

and also related to this issue:

Cut off of symbols with WebGL on. 

Is there an available fix or documentaion about the changes in "esri/views/2d/draw/Draw"?

Thanks!

[UndralBatsukh]

Hi there, 

1. I am not able to reproduce the issue you described using sketch widget sample. Can you please give a reproducible case or at the very least tell me what classes you are using where and how you are creating the graphics? 

2. Can you please give a reproducible case or properties you are setting for the textsymbol?

3. So I confirmed that MapView.hitTest is returning a graphic where its visible property is set to false. Will fix this this issue in a future release. 

Thanks,

-Undral

[NettaBeninson]

Hi, thank you for your response.

We are not using the newly introduced sketch widget, but draw and draw action.

We are creating draw actions and have a function that is called on several events:

action.on("vertex-add", redrawPolyline);
action.on("vertex-remove", redrawPolyline);
action.on("cursor-update", redrawPolyline);
action.on("draw-complete", redrawPolyline);

We created and used these actions since upgrading to the 4.x api and now the behavior is broken, even without text.

Our implementation is very simillar to the first example in Draw | API Reference | ArcGIS API for JavaScript 4.10 .

I coulndn't find an example for drawing a graphic in a GraphicsLayer | API Reference | ArcGIS API for JavaScript 4.10 , so it might have something to do with on the fly re-rendering of graphicsLayer.

Thanks for the hittest check.

I'll try creating a sandbox, if I won't be able to, we'll send you a link to a working sandbox of our system.

[NettaBeninson]

I suspect it might has something to do with basmap, I was able to reproduce "cutting" the drawn line after zoom and pan when the map had no basemap.

codepen link: Draw polyline - 4.10 - no basemap  (based on the basic draw example)

[In the gif I didn't change my pan/zoom during drawing, only before I drew.]

[XavierIrias]

Netta, I share your suspicion that the root cause of your issue is the same as my issue.  Unfortunately I don't yet have a trivial example showing the error but it's definitely true that version 4.10 is truncating graphics where 4.9 does not.  Also 4.10 is prone to hanging when given a large amount of graphics to draw, such that I have to kill the browser tab.  So far I have observed these problems with Firefox and Chrome on OSX.

It should be possible to disable WebGL on the browser (rather than asking the Esri API to not use it).  I will attempt to do so and report back since that would be a smoking gun implicating the webGL code.

[UndralBatsukh]

Hi, 

Please tag me if you can reproduce the issue consistently. I am trying to reproduce the issue but I am not able to so in Chrome and Firefox on mac. What versions of firefox, chrome and osx? 

[XavierIrias]

I did some further testing.  The graphics clipping in 4.10 seems to happen if and only if Array.prototype.remove is polyfilled. I don't know why but removing the polyfill made the issue disappear in Chrome on OSX.  I also tested with some console.log calls to see if my polyfill was even being called, and it's not.  So it's not the content of the polyfill for .remove but its mere presence that makes version 4.10 fail, so perhaps version 4.10 is property-sniffing and is thrown off by the presence of a .remove member on Array? 

Very odd but it seems highly repeatable so I thought it might be helpful for you to know.

[UndralBatsukh]

Hi there, 

When view does not have a basemap, the view scale and zoom properties are not properly. So what you are seeing is similar to as if you were to zoom out all the way on the same sample. The lines are being cut along the edge. If you update your code pen to 4.9, you will see the same behavior. With this said, please tag me if you can reproduce the issue consistently. I am trying to reproduce it but having no luck. 

[NettaBeninson]

Hey, I currently cannot produce an instance of our entire system.

But it appears that other people also have this issue.

Can you please try to tell me/us what changed in the sketch action command?

It looks like the tiles are cutting the sketch, and zooming make the graphic appear again.

We are using a basemap of 4 layers, this happens even if I neutralize all the base layers ortho, vectortiles and esri basemap.

[BradBarnell]

I also am having this problem in 4.10.  Works in 4.9.  See attached polygon graphics that are getting clipped randomly.