✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
🐇 Announcing Dash VTK for 3d simulation graphics. Check out the March webinar.

Dash Bootstrap Components Navbar not triggering URL Callback

Hi There,

I’m stuck with a problem and no idea how to debug it. I have a SimpleNavBar from Dash Bootstrap Components and it used to work (actually the same code on a different PC works!)

So what the navbar should do when clicking on an item is triggering the callback below. However, it just updates the URL in the address bar of Chrome and does nothing else. Then, when I hit F5, it triggeres the Callback.

At least that is what I see when setting a breakpoint there.

Any Idea what’s wrong or what could prevent chrome from reloading the page properly?

Also, interestingly, the Spinners (dbc.Spinner) stopped working as well. The spin and spin without end. When I revove a Spinner from a Graph, it shows the graph just fine.

Maybe uses the same mechanism? But what could be wrong?

def callback_url(app):
    @app.callback(Output('page-content', 'children'),
                  [Input('url', 'pathname')])
    def display_page(pathname):
        # HPLC specific
        if pathname == '/HPLC/worldmap':
            return layouts.layout_worldmap("HPLC")
        elif pathname == '/HPLC/sales_history':
            return layouts.layout_sales_hist_wo_cuv("HPLC")
        elif pathname == '/HPLC/hemoglobinopathies':
            return layouts.layout_hemoglobinopathies_worldmap()
        # coag specific
        elif pathname == '/coag/worldmap':
            return layouts.layout_worldmap("Hemostasis")
        elif pathname == '/coag/market_estimation':
            return layouts.layout_coag_market_est()
        elif pathname == '/coag/sales_history':
            return layouts.layout_sales_hist_w_cuv("Hemostasis")
        #
        else:
            return layouts.layout_nopage()

For the record: got it to work again on that machine.

It was somehow related to the packages in the venv. Installing from requirements didn’t help. Actually I managed to break the project on the second PC as well be creating a fresh venv using the requirements.txt.

So what I did was:

  1. create new venv
  2. run / install missing dep / run <- cycle until all dependencies were installed
  3. works again!

I only got this message when installing dash_bootstrap_components. I have no idea what it means, though.

(venv) C:\Users\solbachd\PycharmProjects\insideout>python -m pip  install dash_bootstrap_components
Processing c:\users\solbachd\appdata\local\pip\cache\wheels\dc\7d\bd\daf13b460efbe46ee53ba7449f20729c1a10e8f50cfd0d64e3\dash_bootstrap_components-0.9.2-py3-none-any.whl
Requirement already satisfied: dash>=1.9.0 in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from dash_bootstrap_components) (1.12.0)
Requirement already satisfied: flask-compress in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from dash>=1.9.0->dash_bootstrap_components) (1.5.0)
Requirement already satisfied: Flask>=1.0.2 in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from dash>=1.9.0->dash_bootstrap_components) (1.1.2)
Requirement already satisfied: dash-html-components==1.0.3 in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from dash>=1.9.0->dash_bootstrap_components) (1.0.3)
Requirement already satisfied: plotly in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from dash>=1.9.0->dash_bootstrap_components) (4.7.0)
Requirement already satisfied: dash-core-components==1.10.0 in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from dash>=1.9.0->dash_bootstrap_components) (1.10.0)
Requirement already satisfied: dash-table==4.7.0 in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from dash>=1.9.0->dash_bootstrap_components) (4.7.0)
Requirement already satisfied: dash-renderer==1.4.1 in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from dash>=1.9.0->dash_bootstrap_components) (1.4.1)
Requirement already satisfied: future in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from dash>=1.9.0->dash_bootstrap_components) (0.18.2)
Requirement already satisfied: brotli in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from flask-compress->dash>=1.9.0->dash_bootstrap_components) (1.0.7)
Requirement already satisfied: click>=5.1 in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from Flask>=1.0.2->dash>=1.9.0->dash_bootstrap_components) (7.1.2)
Requirement already satisfied: Werkzeug>=0.15 in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from Flask>=1.0.2->dash>=1.9.0->dash_bootstrap_components) (1.0.1)
Requirement already satisfied: itsdangerous>=0.24 in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from Flask>=1.0.2->dash>=1.9.0->dash_bootstrap_components) (1.1.0)
Requirement already satisfied: Jinja2>=2.10.1 in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from Flask>=1.0.2->dash>=1.9.0->dash_bootstrap_components) (2.11.2)
Requirement already satisfied: retrying>=1.3.3 in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from plotly->dash>=1.9.0->dash_bootstrap_components) (1.3.3)
Requirement already satisfied: six in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from plotly->dash>=1.9.0->dash_bootstrap_components) (1.14.0)
Requirement already satisfied: MarkupSafe>=0.23 in c:\users\solbachd\pycharmprojects\insideout\venv\lib\site-packages (from Jinja2>=2.10.1->Flask>=1.0.2->dash>=1.9.0->dash_bootstrap_components) (1.1.1)
Could not build wheels for dash, since package 'wheel' is not installed.
Could not build wheels for flask-compress, since package 'wheel' is not installed.
Could not build wheels for Flask, since package 'wheel' is not installed.
Could not build wheels for dash-html-components, since package 'wheel' is not installed.
Could not build wheels for plotly, since package 'wheel' is not installed.
Could not build wheels for dash-core-components, since package 'wheel' is not installed.
Could not build wheels for dash-table, since package 'wheel' is not installed.
Could not build wheels for dash-renderer, since package 'wheel' is not installed.
Could not build wheels for future, since package 'wheel' is not installed.
Could not build wheels for brotli, since package 'wheel' is not installed.
Could not build wheels for click, since package 'wheel' is not installed.
Could not build wheels for Werkzeug, since package 'wheel' is not installed.
Could not build wheels for itsdangerous, since package 'wheel' is not installed.
Could not build wheels for Jinja2, since package 'wheel' is not installed.
Could not build wheels for retrying, since package 'wheel' is not installed.
Could not build wheels for six, since package 'wheel' is not installed.
Could not build wheels for MarkupSafe, since package 'wheel' is not installed.
Installing collected packages: dash-bootstrap-components
Successfully installed dash-bootstrap-components-0.9.2

Try this:

pip install wheel
python -m pip install dash-bootstrap-components

The way navigation works in Dash changed recently, so it won’t work if you have a new version of Dash but an old version of dash-bootstrap-components. I suspect that you probably just needed to update dash-bootstrap-components

The “Could not build wheels” message is I think because the dash-bootstrap-components pyproject.toml which we use for configuring some of our linting / code formatting tools started getting bundled with our distributions when uploaded to PyPI which triggers some changes in how packages are built. This wasn’t something we did intentionally, I think something changed with the tools we are using to distribute like twine. Anyway, the fix @Kireal should work, even though the messages are harmless I believe. I’m going to work on a fix for future releases.