[BUG] onStyleLoaded is called before style is fully loaded

[albertmoravec]

Platforms

web

Version of flutter maplibre_gl

0.20.0

Bug Description

onStyleLoaded callback is called before style loading is actually done.
The issue is described more in-depth here: mapbox/mapbox-gl-js/issues/2268.

Steps to Reproduce

Testing

1. Define an onStyleLoaded callback which adds a new GeoJSON (or possibly other) source immediately after it is called.
2. Quickly switch between different style definitions (e.g. from basic to satellite map and back) - wait for onStyleLoaded to be called before switching to the next.
3. Check for the added source's existence after some time.

Expected Results

Source should still be present and not overwritten by newly loaded style.

Actual Results

Source added in onStyleLoaded callback is no longer present, as it was overwritten by the loaded style, even though onStyleLoaded was called earlier.

Code Sample

Only general idea provided, as checking for source existence is currently not possible (I added my own hasSource() implementation to maplibre-gl-web to test this)

In onStyleLoaded:

await controller.addGeoJsonSource(
  'dummy_source',
  {"type": "FeatureCollection", "features": []},
);

Future.delayed(
  const Duration(seconds: 3),
 () async => print('Has source: ${await controller.hasSource('dummy_source')}'),
);

[thanhdt-vietmap]

Maybe I know this bug, it happened on our fork. The problem is that the map loaded the style successfully, but the SDK has not rendered the map. If you add any layer to the map during this time, your app will crash. The solution is native SDK has an onMapRendered callback, and putting your code in this function will not meet any problem. Let me open a PR for this callback.
Ah, I just have experience with Android and iOS SDK, so I don't know if web SDK has this callback @@