preserveDrawingBuffer and marker dragging breaks down rendering

[PanierAvide]

maplibre-gl-js version: 4.1.3 (possibly also 3.x branch)

browser: Firefox 125, Chromium 123

Steps to Trigger Behavior

1. Have a MapLibre Map, with vector tiles, a marker and these options:

• preserveDrawingBuffer: true
• maxZoom: 24
• zoom: 16

2. Go from zoom 16 to 24
3. Step back a bit to zoom 23.5 (any decimal value between 23 and 24)
4. Move the map by clicking/dragging on marker (a bit frenetically)
5. Zoom to a decimal level between 23 and 24 (23.5 for example)
6. Move the map by clicking on marker (a bit frenetically)
7. Zoom back to level 16

Link to Demonstration

https://jsbin.com/cisuvaruze/edit?html,output

Expected Behavior

Map shows vector tiles correctly, without any issue.

Actual Behavior

Map rendering breaks down, only marker is shown, no more vector tiles background.

No particular error in the web console, only warnings (but not alarming ones).

This happens in the very particular configuration given (map coordinates, decimal zoom level between 23-24, preserveDrawingBuffer). Changing any of them makes the behavior harder/impossible to reproduce.

Issue was first reported here, on a more complex MapLibre map we use. The JSBin is the minimal example to reproduce this issue.

[PanierAvide]

GIF of behavior for better understanding 🎥

[HarelM]

I'm having a hard time reproducing this, although I did manage to reproduce this once in chrome.
If I needed to guess the problem is probably due to the fact that the drawing buffer gets too big (from zoom 14 to zoom 24) and the preserver drawing buffer is probably not helpful.
Since there's no error in the console I tend to say that this is a webgl issue.
But all of these are guesses, I don't have anything concrete...
warning in FF are known issue and reported in a different issue: #2030.