Update the worker images once an image is added or removed + Render t…

…ests (#9911)

* Update the worker images once an image is added or removed.

* Factorize the {add,remove}Image code.

* Add render test coverage for image coalesce fallback

Co-authored-by: François de Metz <francois@2metz.fr>

src/style/style.js

@@ -515,10 +515,7 @@ class Style extends Evented {
             return this.fire(new ErrorEvent(new Error('An image with this name already exists.')));
         }
         this.imageManager.addImage(id, image);
-        this._availableImages = this.imageManager.listImages();
-        this._changedImages[id] = true;
-        this._changed = true;
-        this.fire(new Event('data', {dataType: 'style'}));
+        this._afterImageUpdated(id);
     }
 
     updateImage(id: string, image: StyleImage) {
@@ -534,9 +531,14 @@ class Style extends Evented {
             return this.fire(new ErrorEvent(new Error('No image with this name exists.')));
         }
         this.imageManager.removeImage(id);
+        this._afterImageUpdated(id);
+    }
+
+    _afterImageUpdated(id: string) {
         this._availableImages = this.imageManager.listImages();
         this._changedImages[id] = true;
         this._changed = true;
+        this.dispatcher.broadcast('setImages', this._availableImages);
         this.fire(new Event('data', {dataType: 'style'}));
     }
 

test/integration/render-tests/runtime-styling/image-add-coalesce/style.json

@@ -0,0 +1,45 @@
+{
+  "version": 8,
+  "metadata": {
+    "test": {
+      "width": 64,
+      "height": 64,
+      "operations": [
+        [
+          "addImage",
+          "rocket",
+          "./image/rocket.png"
+        ],
+        [
+          "addLayer",
+          {
+            "id": "geometry",
+            "type": "symbol",
+            "source": "geometry",
+            "layout": {
+              "icon-image": ["coalesce",
+                ["image", "non-existing-image1"],
+                ["image", "non-existing-image2"],
+                ["image", "rocket"],
+                ["image", "non-existing-image3"]
+              ]
+            }
+          }
+        ],
+        [
+          "wait"
+        ]
+      ]
+    }
+  },
+  "sources": {
+    "geometry": {
+      "type": "geojson",
+      "data": {
+        "type": "Point",
+        "coordinates": [0, 0]
+      }
+    }
+  },
+  "layers": []
+}