Problem with a dcc.Location component

[yura]

Hi there!

I found Dash as a very useful tool for analytic apps. Thanks for this amazing library! Working on my third app I have encountered this trouble that I had never seen before, though I used dcc.Location previously in both ready apps.

Description of a problem:
whenever I use links that should update the page-content Div (either in NavItems or as html.A), I see that link in the browser address field has been updated, but the page content wasn’t. To update the page content I need to refresh the page by pressing the F5 button. (Gifs are attached)
The issue appeared today when I installed a non-dash package (psycopg2) and some of the dash packages updated.
I’m sure that the issue is connected with some of the updates of the dash packages. And here’s another reason why. I have a virtual environment with old versions of dash installed and the sample of code below works perfectly fine as it supposed to with older versions of dash packages.

Here’s a sample of my code:

import dash_core_components as dcc
import dash_html_components as html
import dash_bootstrap_components as dbc
from dash.dependencies import Input, Output
import dash

app = dash.Dash(__name__,
                external_stylesheets=[dbc.themes.BOOTSTRAP],
                suppress_callback_exceptions=True)

nav = dbc.Nav(
    [
        dbc.NavItem(dbc.NavLink("PAGE 1", href="/page1", style={'color': '#FEFEFE'}, id='page1')),
        dbc.NavItem(dbc.NavLink("PAGE 2", href="/page2", style={'color': '#FEFEFE'}, id='page2')),
    ],
    pills=True,
    className='ml-auto flex-nowrap mt-3 my-0'
)

navbar = dbc.Navbar(
    [
        html.A(
            dbc.Row(
                [
                    dbc.Col(
                        dbc.NavbarBrand(
                            "Navbar",
                            style={'margin-left': '40px', 'font-size': '1.5rem'}
                        ),
                        className="ml-3 d-flex align-items-center"
                    ),
                ],
                align="center",
                no_gutters=True,
            ),
            href="/",
        ),
        nav
    ],
    className='navbar-dark bg-dark',
)

app.layout = html.Div([
    dcc.Location(id='url', refresh=False),
    navbar,
    html.Div(id='page-content', className='p-0', style={'background-color': '#ebeff2'}),
])


@app.callback(Output('page-content', 'children'),
              [Input('url', 'pathname')])
def display_page(pathname):
    if pathname == '/page1':
        return html.Div('PAGE 1')
    elif pathname == '/page2':
        return html.Div('PAGE 2')
    else:
        return html.Div('SELECT A PAGE')


if __name__ == '__main__':
    app.run_server(
        debug=True,
        port=8051,
    )

Versions of packages where the issue doesn’t appear:
dash 1.14.0 pyh9f0ad1d_0 conda-forge
dash-bootstrap-components 0.10.5 pyh9f0ad1d_0 conda-forge
dash-core-components 1.10.2 pyh9f0ad1d_0 conda-forge
dash-html-components 1.0.3 pyh9f0ad1d_0 conda-forge
dash-renderer 1.6.0 pyh9f0ad1d_0 conda-forge
dash-table 4.9.0 pyh9f0ad1d_0 conda-forge

Versions of packages where the issue has been noticed:
dash 1.16.1 py_0
dash-bootstrap-components 0.10.6 pypi_0 pypi
dash-core-components 1.12.1 pypi_0 pypi
dash-html-components 1.1.1 pypi_0 pypi
dash-renderer 1.8.1 pypi_0 pypi
dash-table 4.10.1 pypi_0 pypi

Please help me to understand how to resolve this issue and what versions to install to get rid of this problem.
Thank you!