don't stop animation on map resize

[andrewharvey]

Launch Checklist

• briefly describe the changes in this PR
  closes Flying ends on window resize and browser zoom change #4041
  closes Geocoder control's flyTo animation on result selection gets interrupted on Android devices #4481

allows animations from flyTo to continue even when the map resizes. You can end up with the point you're flyingTo no longer being inside the map window if the map is resized a lot, but I feel it's no worse than the current behaviour, something than can be fixed in a future PR, and addresses the root cause of mapbox-gl-geocoder not working on Android.

• write tests for all new functionality

• check new unit test fails on master without this change

• n/a document any changes to public APIs

• n/a post benchmark scores

• manually test the debug page

• n/a tagged @mapbox/studio and/or @mapbox/maps-design if this PR includes style spec changes

[jdaudier]

I can't wait for this to land! I need this fix!

[andrewharvey]

I'm not too familiar with the animation/interaction code, so not sure if there are any implications of this change I've overlooked.

[mollymerp]

hmm yeah – it does temporarily bork the transform state but it does seem to me that this behavior is preferable considering the drawbacks of the current approach. @mourner @ansis are there undesirable side-effects of this that I'm missing?

[ansis]

Is this related to the resize fix or something separate?
No need to split it out if it's separate, I'm just wondering if I'm missing a relation between this and the resize bug.

[andrewharvey]

I think I needed this so that scrolling on the map cancelled an active flyTo.

[ansis]

@mollymerp nah, I think this is fine. If it doesn't finish in the right location we should try to fix that but this seems fine to me.

[andrewharvey]

test-flow is failing with:

Cannot call `this.resize()._update` because property `_update` is missing in `Evented` [1].

   src/ui/map.js:1738:13
   1738|             this.resize()._update();
                     ^^^^^^^^^^^^^^^^^^^^^^^

References:
   src/util/evented.js:47:14
     47| export class Evented {
                      ^^^^^^^ [1]

🤔

[mollymerp]

@andrewharvey I think flow was confused by returning this.fire.... from map.resize() 🤷‍♀️

[ansis]

Looks good to me!

[jdaudier]

Any idea when this fix will be released?

[allthesignals]

This is a little tangential, but what is the behavior called when MapboxGL (or WebGL) pauses animation (or rendering) when the window/tab isn't "active" (isn't visible in the user's desktop)? Having an automation issue, and trying to find the correct language to understand...

[ryanhamley]

AFAIK, we (and WebGL) do not pause rendering on background tabs. Processes in background tabs are throttled as the default behavior of many modern browsers for performance reasons.

[allthesignals]

@ryanhamley thank you! Makes sense that it's way lower level than a MapboxGL thing.

EDIT: https://winaero.com/blog/disable-tab-throttling-google-chrome/