Ignore style.loadURL abort error when style is removed (#4425)

* Add test for style#loadURL abort error

* Ignore style.loadURL abort error

* Add test for style#loadURL firing error if request fails

* Fix a style#loadURL test to use promises

* Fix a style#loadURL test to remove sleep(0)

* Revert "Fix a style#loadURL test to remove sleep(0)"

This reverts commit f6e7764.

---------

Co-authored-by: Harel M <harel.mazor@gmail.com>

CHANGELOG.md

@@ -10,6 +10,7 @@
 - Fix lag on fast map zoom ([#4366](https://github.com/maplibre/maplibre-gl-js/pull/4366))
 - Fix unguarded read access to possibly undefined object ([#4431](https://github.com/maplibre/maplibre-gl-js/pull/4431))
 - Fix remove hash string when map is removed ([#4427](https://github.com/maplibre/maplibre-gl-js/pull/4427))
+- Fix `style.loadURL` abort error being logged when removing style ([#4425](https://github.com/maplibre/maplibre-gl-js/pull/4425))
 - _...Add new stuff here..._
 
 ## 4.5.0

src/style/style.test.ts

@@ -172,6 +172,32 @@ describe('Style#loadURL', () => {
         style._remove();
         expect((server.lastRequest as any).aborted).toBe(true);
     });
+
+    test('does not fire an error if removed', async () => {
+        const style = new Style(getStubMap());
+        const spy = jest.fn();
+
+        style.on('error', spy);
+        style.loadURL('style.json');
+        style._remove();
+        await sleep(0);
+
+        expect(spy).not.toHaveBeenCalled();
+    });
+
+    test('fires an error if the request fails', async () => {
+        const style = new Style(getStubMap());
+        const errorStatus = 400;
+
+        const promise = style.once('error');
+        style.loadURL('style.json');
+        server.respondWith(request => request.respond(errorStatus));
+        server.respond();
+        const {error} = await promise;
+
+        expect(error).toBeTruthy();
+        expect(error.status).toBe(errorStatus);
+    });
 });
 
 describe('Style#loadJSON', () => {

src/style/style.ts

@@ -290,12 +290,13 @@ export class Style extends Evented {
 
         const request = this.map._requestManager.transformRequest(url, ResourceType.Style);
         this._loadStyleRequest = new AbortController();
+        const abortController = this._loadStyleRequest;
         getJSON<StyleSpecification>(request, this._loadStyleRequest).then((response) => {
             this._loadStyleRequest = null;
             this._load(response.data, options, previousStyle);
         }).catch((error) => {
             this._loadStyleRequest = null;
-            if (error) {
+            if (error && !abortController.signal.aborted) { // ignore abort
                 this.fire(new ErrorEvent(error));
             }
         });