---
title: "plotly plot"
---
```{python}
import plotly.express as px
import plotly.io as pio
df = px.data.iris()
fig = px.scatter(df, x="sepal_width", y="sepal_length", 
                 color="species", 
                 marginal_y="violin", marginal_x="box", 
                 trendline="ols", template="simple_white")
fig.show()


A user suggests that smooth-scroll is to blame.

### Discussed in https://github.com/quarto-dev/quarto-cli/discussions/2920

<div type='discussions-op-text'>

<sup>Originally posted by **lukefullard** October 18, 2022</sup>
Hi all,

Occasionally when I load a html page with inspect mode activated I see the following error in the console:

site_compare.html:3905 Uncaught Error: Mismatched anonymous define() module: [object Object] https://requirejs.org/docs/errors.html#mismatch at makeError (site_compare.html:3905:1803) at T (site_compare.html:3905:8685) at site_compare.html:3905:15076



Also, sometimes Python generated figures don't show unless I refresh the page.

Has anyone had this issue before?

Thanks</div>

After a discussion at useR, I got an email with some reprex and more detail on this.

First FWIW I can't reproduce with the above example, even adding smooth-scroll: true

Though here is the example built from what I received

---
title: Reprex
format:
  html: 
    smooth-scroll: true
execute: 
  echo: false
  warning: false
---

For a demonstration of an interactive plot, see @fig-plotly.

```{python}
# | label: fig-plotly
# | fig-cap: "An interactive plot."
import plotly.express as px
import plotly.io as pio

pio.renderers.default = "plotly_mimetype+notebook"

df = px.data.iris()
fig = px.scatter(df, x="sepal_width", y="sepal_length", 
                 color="species", 
                 marginal_y="violin", marginal_x="box", 
                 trendline="ols", template="simple_white")
fig.show()

Equations

$E = mc^{2}$


Conclusion from the reproducibility is : 

* It happens when mathajx equation are used 
* And when `smooth-scroll: true` is set.

Opting out one of these doesn't reproduce. 

The browser error we get in browser console is

Uncaught Error: Mismatched anonymous define() module: [object Object] https://requirejs.org/docs/errors.html#mismatch at makeError (require.min.js:1:1795) at T (require.min.js:1:8677) at require.min.js:1:15068


So something is conflicting. I believe we can now better understand if this is on us (and we can do differently), or a conflict in plotly.js directly with what we are using. 

Modifying the original example above like this, makes it reproducible 
````markdown
---
title: "plotly plot"
format: 
  html:
    smooth-scroll: true
---
```{python}
import plotly.express as px
import plotly.io as pio
df = px.data.iris()
fig = px.scatter(df, x="sepal_width", y="sepal_length", 
                 color="species", 
                 marginal_y="violin", marginal_x="box", 
                 trendline="ols", template="simple_white")
fig.show()

$1+1$

quarto-dev / quarto-cli

smooth-scroll and jupyter widgets don't play nice together #5356

Equations