Leaflet does not initialise properly and flickers

[hal2000gh]

Description

I have an issue with leaflet maps. I have an app where I want to select and display an GPS track. When the track is selected I move the view to the track with "flyToBounds" (or "fitBounds", which shows the same effect) and quite often the map flickers after moving to the specified area and only the track is visible but not the map.
The same effect appears on the nicegui example for "Wait for Initialization"... see the screen capture. The first reload works properly but the second does not:

Nicegui.Leaflet.mp4

There was a bugfix in release 1.4.26 ("Prevent ui.leaflet from flickering...") which I suppose should have fixed the issue, but it is still occurring (particularly prevalent on Safari on iPad).

[falkoschindler]

Thanks for reporting this issue, @hal2000gh!

Somehow I can reproduce the behavior, but not reliably.
We could try increasing the delay of 20ms introduced in PR #3125 and discussed in #3035. With 50ms the problem seems to be gone.
But I'd love to find a more robust solution that prevents race-conditions once and for all. Does anyone have an idea?

[falkoschindler]

No, 50ms doesn't help reliably. Here's my test setup, by the way:

@ui.page('/')
async def page():
    m = ui.leaflet(zoom=5)
    central_park = m.generic_layer(name='polygon', args=[[
        (40.767809, -73.981249),
        (40.800273, -73.958291),
        (40.797011, -73.949683),
        (40.764704, -73.973741),
    ]])
    await m.initialized()
    bounds = await central_park.run_method('getBounds')
    m.run_map_method('fitBounds', [[bounds['_southWest'], bounds['_northEast']]])

[falkoschindler]

I might have found a solution in PR #4121.

[hal2000gh]

Great! Many thanks!