Map unresponsive to events: Error at Actor.receive (actor.js:81) and XHR failed loading: GET "https://a.tiles.mapbox.com/v4/chanversus.40louhe4/10/300/384.vector.pbf...

[elainechan]

mapbox-gl-js version: 0.44.0

Steps to Trigger Behavior

1. Load the map app
2. Scrolling, dragging, clicking, or hovering using the mouse.
3. Reload the app and repeat.

Expected Behavior

• The map should respond to these events:

1. Symbol on click: display information on the symbol in a popup. Feature names: Bike parking, Public benches.
2. Polygon on hover: when the Neighborhoods vector tile layer is active, hovering over a neighborhood polygon highlights it and prints its information in a popup in the bottom of the screen.
3. Map on scroll: zoom in or out of a map by scrolling.
4. Map on drag: move to a different place on the map by dragging.

Actual Behavior

• The map renders styles and custom vector tile layers successfully, but after it finishes rendering, the map does not respond to any user events.
• All the features of the map app depend entirely upon vector tiles responding to events. As a result, the app is completely broken. It is equivalent to displaying a static image on a browser.
• Perhaps similar to this issue with loading PBF files, although not the same. Also the problem does not only affect vector tile PBF files; it affects the main style files as well.

Additional Information

• The static app is hosted on GitHub Pages and the source code is here.
• A detailed debugging report can be found here.

Logged Errors

• Recurring error: this error comes up a dozen of times during each run.

Error: Error
    at Actor.receive (actor.js:81)
Evented.fire	@	evented.js:109
Evented.fire	@	evented.js:103
Evented.fire	@	evented.js:103
t._tileLoaded	@	source_cache.js:238
i	@	vector_tile_source.js:125
Actor.receive	@	actor.js:81

• Loading failures: it seems like most of the offending files are pbf custom vector tiles I created on Mapbox Studio by uploading data.
  Screenshot

blob:https://elainechan.github.io/7ffe1020-f010-4fd2-8d07-8dfa3eadcaa1:328 XHR failed loading: GET "https://a.tiles.mapbox.com/v4/chanversus.40louhe4/10/300/384.vector.pbf?access_token=pk.eyJ1IjoiY2hhbnZlcnN1cyIsImEiOiJjamE3cmJxdDMxMTU5MzJsbDdlM2d5OGFqIn0.Od7n9c17-jouVVYbaMWOsg".
exports.getArrayBuffer @ blob:https://elainechan.github.io/7ffe1020-f010-4fd2-8d07-8dfa3eadcaa1:328
loadVectorTile @ blob:https://elainechan.github.io/7ffe1020-f010-4fd2-8d07-8dfa3eadcaa1:124
VectorTileWorkerSource.loadTile @ blob:https://elainechan.github.io/7ffe1020-f010-4fd2-8d07-8dfa3eadcaa1:124
Worker.loadTile @ blob:https://elainechan.github.io/7ffe1020-f010-4fd2-8d07-8dfa3eadcaa1:126
Actor.receive @ blob:https://elainechan.github.io/7ffe1020-f010-4fd2-8d07-8dfa3eadcaa1:326
01:47:50.302

• More details on the errors can be found here.

[mollymerp]

@elainechan thanks for using mapbox and for the detailed report. Can you please include a minimal jsfiddle or jsbin reproducing this behavior as well as the browser version you're using? I cannot reproduce it on my machine following the steps you've described.

[PetrKaleta]

I am having exactly the same issue... This issue happens when panning map with drag and drop. Simply map stops responding after few seconds...

[elainechan]

@mollymerp thanks for looking into this. Here's a fiddle. The whole app is pretty much in there.

1. Behavior outside of browser environments

• In the fiddle, the problem with the Neighborhood vector-tile layer persists. Polygon on hover should display a highlighted polygon and some information in a popup box in the bottom of the screen, but nothing happens.
• The on click issues subsided.
• The slowness of scroll resizing and drag moving is less severe when using the fiddle so something might have to do with browser compatibility.

2. Browser compatibility

• I tried Chrome 63.0.3239.132 (Official Build) (64-bit) and Firefox Developer Edition 59.0b5 (64-bit) and get the same behavior.
• For Chrome errors see this section.
• For Firefox errors see this section.
• They both point to the same source: Actor.prototype.receive in
  actor.js:81:16 in this file.

[mollymerp]

@elainechan thank you for the details – sorry I didn't specify before, but could you try and make your jsfiddle test case as minimal as possible (i.e. as little code required to reproduce the issue and ideally no 3rd party libraries ). It is much easier to diagnose an issue when we don't have to sift through unrelated application code.

[elainechan]

@mollymerp

• This fiddle contains the complete app with only Mapbox-specific code; everything else has been removed and there are no external libraries.
• I've also isolated each feature in 7 different fiddles listed below.
• As expected, all features work when isolated, but all errors persist in every single isolated version, as reported by Chrome 63 inspector.
• The errors are exactly the same in each isolated version.

Single-Feature Scenarios

• All features work when isolated
• All previous errors persist in every single version:
  1. actor.js error
  2. failed loading
• 

Fiddles

• Full app (same as the one listed up top)
• Neighborhoods
  • non-interactive neighborhoods
  • interactive neighborhoods - hover to see highlighted polygon and a popup banner in the bottom containing neighborhood name. Note that this feature never works in the full app while the other ones work occasionally.
• Bike routes
  • non-interactive bike routes
  • interactive events don't apply to bike routes
• Bike parking
  • non-interactive bike parking
  • interactive bike parking - click on a bike symbol to see popup
• Public benches
  • non-interactive public benches
  • interactive public benches - click on a triangle to see popup

Please let me know your findings! Thanks again.

[mollymerp]

@elainechan Thanks for the fiddles. The errors in your stack trace are from missing tiles (i.e. tiles that have no data in your custom tilesets) and I have fixed this regression in #6126
Unfortunately, I cannot dedicate further time to debugging your app.

As expected, all features work when isolated, but all errors persist in every single isolated version, as reported by Chrome 63 inspector.

this makes me think that there is an issue with your code and not with mapbox-gl-js

if you think you find another bug, please open a new issue with a small, self-contained reproduction of the issue.