JavaScript Exception - Uncaught (in promise) Error after upgrading dash to 2.7.1 #6444

kevalshah90 · 2023-01-24T05:02:53Z

My application renders a map and passes the lat, long values from a pandas dataframe for plotly's scattermapbox graph object.

import dash
from dash import dcc
import pandas as pd
import mapbox
import plotly
import geojson
import ast
import dash
from dash.dependencies import Input, Output, State, ClientsideFunction
from dash import dcc
from dash import html, dash_table
import dash_bootstrap_components as dbc
import dash_daq as daq
import plotly as py
from plotly import graph_objs as go
from plotly.graph_objs import *

df = pd.DataFrame({
                   'x': [1, 2, 3],
                   'Lat': [37.774322, 37.777035, 37.773033],
                   'Long': [-122.489761, -122.485555, -122.491220]
                 }) 

layout = html.Div(
                   dcc.Graph(id="map"),
                   dcc.Input(id="inp")
                 )

@app.callback(
              Output('map','figure'),
              Input('inp','value')
             )
def fin(val):
    
    # do something

    data = []
    
    data.append({

                                 "type": "scattermapbox",
                                 "lat": df["Lat"],
                                 "lon": df["Long"],
                                 "name": "Location",
                                 "showlegend": False,
                                 "hoverinfo": "text",
                                 "mode": "markers",
                                 "clickmode": "event+select",
                                 "customdata": df.loc[:,cd_cols].values,
                                 "marker": {
                                            "symbol": "circle",
                                            "size": 8,
                                            "opacity": 0.7,
                                            "color": "black"
                                           }
                                 }
                   )

      layout = {

                     "autosize": True,
                     "hovermode": "closest",
                     "mapbox": {

                         "accesstoken": MAPBOX_KEY,
                         "bearing": 0,
                         "center": {
                             "lat": xxx,
                             "lon": xxx
                         },
                         "pitch": 0,
                         "zoom": zoom,
                         "style": "satellite-streets",

                     },

                    
        }

        return ({'data': data, 'layout': layout})

I upgraded the dash and plotly libraries to the latest version 2.7.1 and 5.13.0. I am not able to render the points on the map. I do not see any errors in the application logs. The only exceptions I see are JS in console.

Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received


Uncaught (in promise) Error: There is already a source with this ID

at r.addSource (async-plotlyjs.js:2:1020888)
    at i.addSource (async-plotlyjs.js:2:1219363)
    at l.addSource (async-plotlyjs.js:2:2988732)
    at async-plotlyjs.js:2:2989736
    at h (async-plotlyjs.js:2:2989770)
    at l.update (async-plotlyjs.js:2:2990100)
    at b.updateData (async-plotlyjs.js:2:2338377)
    at async-plotlyjs.js:2:2336961

The text was updated successfully, but these errors were encountered:

alexcjohnson · 2023-01-24T16:03:42Z

Thanks @kevalshah90 - are you able to reduce this to a standalone app? I try to do that and it works with no error, but I had to comment out some of your missing variables

from dash import Dash, dcc, html, Input, Output
import pandas as pd

MAPBOX_KEY = "<YOUR KEY>"

df = pd.DataFrame({
    'x': [1, 2, 3],
    'Lat': [37.774322, 37.777035, 37.773033],
    'Long': [-122.489761, -122.485555, -122.491220]
})

app = Dash(__name__)

app.layout = html.Div([dcc.Graph(id="map"), dcc.Input(id="inp")])

@app.callback(Output('map','figure'), Input('inp','value'))
def fin(val):
    data = [{
        "type": "scattermapbox",
        "lat": df["Lat"],
        "lon": df["Long"],
        "name": "Location",
        "showlegend": False,
        "hoverinfo": "text",
        "mode": "markers",
        "clickmode": "event+select",
        #  "customdata": df.loc[:,cd_cols].values,
        "marker": {
            "symbol": "circle",
            "size": 8,
            "opacity": 0.7,
            "color": "black"
        }
    }]

    layout = {
        "autosize": True,
        "hovermode": "closest",
        "mapbox": {
            "accesstoken": MAPBOX_KEY,
            "bearing": 0,
            #  "center": {
            #      "lat": xxx,
            #      "lon": xxx
            #  },
            #  "pitch": 0,
            #  "zoom": zoom,
            "style": "satellite-streets",
        }
    }

    return ({'data': data, 'layout': layout})

if __name__ == '__main__':
    app.run(debug=True)

alexcjohnson · 2023-02-01T01:05:19Z

The observation in plotly/dash#2406 that this happens between Dash v2.6.1 and v2.7.1 narrows this down a bit - you could try adding a specific plotly.js version to your app, either by putting it in the assets/ folder or with a CDN link in external_scripts. That Dash range upgraded plotly.js from 2.13.3 to 2.16.4, so perhaps we can figure out which precise plotly.js release broke this for you.

Of course that's still not the same as reproducing it, what we really need is a standalone app that triggers the bug. Perhaps you can augment my app above with more details from your app until the bug appears?

kevalshah90 · 2023-02-01T02:22:52Z

@alexcjohnson which specific version of plotly.js? The current version that is bugfree (no JS errors) is dash 2.6.2 and plotly 5.13.0.

I'll try to create shareable reproducible App, there are several dependencies, security credentials, env variables that make it tricky to create a minimal standalone App, but let me try.

alexcjohnson · 2023-02-01T02:39:04Z

Right so I bet if you use the latest versions of dash and plotly.py but load plotly.js 2.13.3 it will work correctly. Then you can step forward from there to plotly.js 2.16.4 that won't work... the question is which intermediate version caused the bug? the full set of possibilities is 2.14.0, 2.15.0, 2.15.1, 2.16.0, 2.16.1, 2.16.2, 2.16.3, 2.16.4... most likely it's one of the minors, not one of the patches.

My guess is it'll be 2.16.0, specifically #5827. That already caused one other bug that we've fixed: #6382 - but that apparently didn't fix your issue.

alexcjohnson · 2023-02-01T02:50:35Z

ooh the app @Coding-with-Adam posted in plotly/plotly.py#3631 (comment) shows the same JS error, and it's pretty simple. @archmoj is that enough to go off?

kevalshah90 · 2023-02-01T06:15:12Z

ok, so the resolution for the time being is to go with dash==2.6.2 and plotly.js==2.13.3? To confirm, I'll add it in app.py where I instantiate the app as external script and also update requirements.txt with version 2.13.3?

ciskoh · 2023-02-01T08:40:56Z

Hi all,
I am having a problem with scatter_mapbox not updating upon callback and I do see the following error:

Uncaught (in promise) Error: Mapbox error.
    at i.r (plotly.v2_7_0m1667509735.min.js:37:1056684)
    at Et.fire (plotly.v2_7_0m1667509735.min.js:20:333027)
    at Et.fire (plotly.v2_7_0m1667509735.min.js:20:333170)
    at Et.fire (plotly.v2_7_0m1667509735.min.js:20:333170)
    at Et.fire (plotly.v2_7_0m1667509735.min.js:20:333170)
    at r._tileLoaded (plotly.v2_7_0m1667509735.min.js:20:768423)
    at plotly.v2_7_0m1667509735.min.js:20:725812
    at plotly.v2_7_0m1667509735.min.js:20:330966
    at plotly.v2_7_0m1667509735.min.js:20:328968

My stack:
dash: 2.7.0
dash-core-components: 2.0.0
dash-html-components: 2.0.0

More details on my problem is here: https://community.plotly.com/t/mapbox-custom-raster-tiles-not-updating/71962

ciskoh · 2023-02-01T08:46:00Z

ok, so the resolution for the time being is to go with dash==2.6.2 and plotly.js==2.13.3? To confirm, I'll add it in app.py where I instantiate the app as external script and also update requirements.txt with version 2.13.3?

How do you specify the plotly.js version in python? Having a similar problem with tiles and polygons not updating

ciskoh · 2023-02-01T09:31:54Z

Reporting after trying with dash version 2.6.2

I have tried running the dashboard with dash 2.6.2 and my problem (scattermapbox not displaying new raster tiles following callback) seems reduced but not disappeared. WIth version 2.7.0 the problem (tiles not refreshing) and the Uncaught (in promise) Error: Mapbox error. would appear at the second request. Now it takes between 5-10 subsequent request but the error comes back and my map is stuck again.

Still haven't specified the plotly.js version (if this is even needed in a python dashboard).- If someone can provide indications for that I can try and report again

EDIT: tried plotly (python) v 5.10. Problem appears to be worst

EDIT2: I installed plotly version 5.9.0 which seems (according to the changelog) to run on plotly.js v 2.13.3 and unfortunately I still get the error:

Uncaught (in promise) Error: Mapbox error.
    at i.r (plotly.v2_6_2m1663979822.min.js:37:1050862)
    at Et.fire (plotly.v2_6_2m1663979822.min.js:20:333027)
    at Et.fire (plotly.v2_6_2m1663979822.min.js:20:333170)
    at Et.fire (plotly.v2_6_2m1663979822.min.js:20:333170)
    at Et.fire (plotly.v2_6_2m1663979822.min.js:20:333170)
    at r._tileLoaded (plotly.v2_6_2m1663979822.min.js:20:768423)
    at plotly.v2_6_2m1663979822.min.js:20:725812
    at plotly.v2_6_2m1663979822.min.js:20:330966
    at plotly.v2_6_2m1663979822.min.js:20:328968

so my latest stack is:
dash-bootstrap-components 1.3.1
dash-core-components 2.0.0
dash-extensions 0.1.6
dash-html-components 2.0.0
plotly 5.9.0

and the problem is still there

alexcjohnson · 2023-02-01T13:04:12Z

@ciskoh I believe you’re seeing #5505 which is a different bug from this one

archmoj · 2023-02-02T21:26:39Z

To replicate this issue on plotly.js
@kevalshah90 would you please fork this codepen and make changes to data and layout (something similar to what is changing in your app) so that using react step 0 then react step 1 triggers the issue?

kevalshah90 · 2023-02-10T20:58:40Z

@archmoj It is not clear what changes you'd like me to make.

Do you want to me to wrap my callback return statement in js within the .py file?

For reference, this what my return statement looks like:

return ({"data": datad, "layout": layout}, df.to_dict("records") })

archmoj · 2023-02-10T22:43:42Z

@kevalshah90 Could you provide the minimal data and layout changes in the codepen that could trigger the bug when reacting between state 1 and state 2?
Without that I can't replicate the bug.

tomboehling · 2023-05-03T09:30:21Z

Right so I bet if you use the latest versions of dash and plotly.py but load plotly.js 2.13.3 it will work correctly. Then you can step forward from there to plotly.js 2.16.4 that won't work... the question is which intermediate version caused the bug? the full set of possibilities is 2.14.0, 2.15.0, 2.15.1, 2.16.0, 2.16.1, 2.16.2, 2.16.3, 2.16.4... most likely it's one of the minors, not one of the patches.

My guess is it'll be 2.16.0, specifically #5827. That already caused one other bug that we've fixed: #6382 - but that apparently didn't fix your issue.

I tried different plotly.js versions with the latest dash/plotly version.

plotly==5.14.1
dash==2.9.3

plotly.js (Strikethrough not working)

2.13.3, 2.14.0, 2.15.0, 2.15.1, 2.16.0, 2.16.1, 2.16.2, 2.16.3, ~~2.16.4~~, ..., ~~2.20.0~~, ~~2.21.0~~, 2.22.0
untested: versions between 2.16.4 and 2.20.0

It looks like it works with the latest plotly.js version (2.22.0)

alexcjohnson mentioned this issue Feb 1, 2023

[BUG] JS Error for a multi-page dash application when upgrading to > 2.7 plotly/dash#2406

Closed

This was referenced Feb 1, 2023

scatter_mapbox not updating in Dash with plotly.js 2.16.1 #6363

Closed

[BUG] Dynamic update of Mapbox style not working plotly/dash#1152

Closed

Error when changing mapbox style with layers using Plotly.react() #5505

Open

archmoj mentioned this issue Feb 10, 2023

scattermapbox plot doesn't update with change in pandas dataframe in a callback plotly/plotly.py#3631

Closed

archmoj added bug something broken regression this used to work labels Feb 10, 2023

archmoj closed this as completed Jun 22, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

JavaScript Exception - Uncaught (in promise) Error after upgrading dash to 2.7.1 #6444

JavaScript Exception - Uncaught (in promise) Error after upgrading dash to 2.7.1 #6444

kevalshah90 commented Jan 24, 2023

alexcjohnson commented Jan 24, 2023

alexcjohnson commented Feb 1, 2023

kevalshah90 commented Feb 1, 2023 •

edited

Loading

alexcjohnson commented Feb 1, 2023

alexcjohnson commented Feb 1, 2023

kevalshah90 commented Feb 1, 2023 •

edited

Loading

ciskoh commented Feb 1, 2023 •

edited

Loading

ciskoh commented Feb 1, 2023

ciskoh commented Feb 1, 2023 •

edited

Loading

alexcjohnson commented Feb 1, 2023

archmoj commented Feb 2, 2023

kevalshah90 commented Feb 10, 2023

archmoj commented Feb 10, 2023

tomboehling commented May 3, 2023

JavaScript Exception - Uncaught (in promise) Error after upgrading dash to 2.7.1 #6444

JavaScript Exception - Uncaught (in promise) Error after upgrading dash to 2.7.1 #6444

Comments

kevalshah90 commented Jan 24, 2023

alexcjohnson commented Jan 24, 2023

alexcjohnson commented Feb 1, 2023

kevalshah90 commented Feb 1, 2023 • edited Loading

alexcjohnson commented Feb 1, 2023

alexcjohnson commented Feb 1, 2023

kevalshah90 commented Feb 1, 2023 • edited Loading

ciskoh commented Feb 1, 2023 • edited Loading

ciskoh commented Feb 1, 2023

ciskoh commented Feb 1, 2023 • edited Loading

alexcjohnson commented Feb 1, 2023

archmoj commented Feb 2, 2023

kevalshah90 commented Feb 10, 2023

archmoj commented Feb 10, 2023

tomboehling commented May 3, 2023

kevalshah90 commented Feb 1, 2023 •

edited

Loading

kevalshah90 commented Feb 1, 2023 •

edited

Loading

ciskoh commented Feb 1, 2023 •

edited

Loading

ciskoh commented Feb 1, 2023 •

edited

Loading