update mathjax tests, also plotly.js script tag tests

Author: alexcjohnson

components/dash-core-components/tests/integration/graph/test_graph_varia.py

@@ -9,30 +9,6 @@
 from selenium.webdriver.support import expected_conditions as EC
 
 
-def findSyncPlotlyJs(scripts):
-    for script in scripts:
-        if "dash_core_components/plotly-" in script.get_attribute("src"):
-            return script
-
-
-def findAsyncPlotlyJs(scripts):
-    for script in scripts:
-        if "dash_core_components/async-plotlyjs" in script.get_attribute("src"):
-            return script
-
-
-def findAsyncMathJax(scripts):
-    for script in scripts:
-        if "dash_core_components/async-mathjax" in script.get_attribute("src"):
-            return script
-
-
-def findSyncMathJax(scripts):
-    for script in scripts:
-        if "dash_core_components/mathjax" in script.get_attribute("src"):
-            return script
-
-
 @pytest.mark.parametrize("is_eager", [True, False])
 def test_grva001_candlestick(dash_dcc, is_eager):
     app = Dash(__name__, eager_loading=is_eager)
@@ -99,7 +75,7 @@ def test_grva002_graphs_with_different_figures(dash_dcc, is_eager):
                             "x": [1, 2, 3],
                             "y": [2, 4, 5],
                             "type": "bar",
-                            "name": u"Montréal",
+                            "name": "Montréal",
                         },
                     ],
                     "layout": {"title": "Dash Data Visualization"},
@@ -119,7 +95,7 @@ def test_grva002_graphs_with_different_figures(dash_dcc, is_eager):
                             "x": [11, 22, 33],
                             "y": [22, 44, 55],
                             "type": "bar",
-                            "name": u"Montréal",
+                            "name": "Montréal",
                         },
                     ],
                     "layout": {"title": "Dash Data Visualization"},
@@ -579,7 +555,7 @@ def test_grva006_unmounted_graph_resize(dash_dcc, is_eager):
                                                     "x": [1, 2, 3],
                                                     "y": [2, 4, 5],
                                                     "type": "scattergl",
-                                                    "name": u"Montréal",
+                                                    "name": "Montréal",
                                                 },
                                             ]
                                         },
@@ -606,7 +582,7 @@ def test_grva006_unmounted_graph_resize(dash_dcc, is_eager):
                                             "x": [1, 2, 3],
                                             "y": [1, 2, 3],
                                             "type": "scattergl",
-                                            "name": u"Montréal",
+                                            "name": "Montréal",
                                         },
                                     ]
                                 },
@@ -649,11 +625,14 @@ def test_grva006_unmounted_graph_resize(dash_dcc, is_eager):
     assert dash_dcc.get_logs() == []
 
 
-def test_grva007_external_plotlyjs_prevents_lazy(dash_dcc):
+@pytest.mark.parametrize("is_eager", [False, True])
+def test_grva007_external_plotlyjs_prevents_lazy(is_eager, dash_dcc):
+    # specific plotly.js version that's older than the built-in version
+    v = "2.8.1"
     app = Dash(
         __name__,
-        eager_loading=False,
-        external_scripts=["https://unpkg.com/plotly.js-dist-min/plotly.min.js"],
+        eager_loading=is_eager,
+        external_scripts=[f"https://unpkg.com/plotly.js-dist-min@{v}/plotly.min.js"],
     )
 
     app.layout = html.Div(id="div", children=[html.Button(id="btn")])
@@ -676,18 +655,22 @@ def load_chart(n_clicks):
     # Give time for the async dependency to be requested (if any)
     time.sleep(2)
 
-    scripts = dash_dcc.driver.find_elements(By.CSS_SELECTOR, "script")
-    assert findSyncPlotlyJs(scripts) is None
-    assert findAsyncPlotlyJs(scripts) is None
+    v_loaded = dash_dcc.driver.execute_script("return Plotly.version")
+
+    # TODO: in eager mode, built-in plotly.js wins!! I don't think this is what we want.
+    # But need to look into why we use the bare plotly.js bundle in eager mode, rather
+    # than simply preloading the regular async chunk.
+    if not is_eager:
+        # as loaded in external_scripts
+        assert v_loaded == v
 
     dash_dcc.find_element("#btn").click()
 
     # Give time for the async dependency to be requested (if any)
     time.sleep(2)
 
-    scripts = dash_dcc.driver.find_elements(By.CSS_SELECTOR, "script")
-    assert findSyncPlotlyJs(scripts) is None
-    assert findAsyncPlotlyJs(scripts) is None
+    # Check that the originally-loaded version is still the one we have
+    assert dash_dcc.driver.execute_script("return Plotly.version") == v_loaded
 
     assert dash_dcc.get_logs() == []
 
@@ -862,10 +845,12 @@ def graph_dims():
 
 
 def test_grva010_external_mathjax_prevents_lazy(dash_dcc):
+    # specific MathJax version that's older than the built-in version
+    v = "3.1.4"
     app = Dash(
         __name__,
         eager_loading=False,
-        external_scripts=["https://cdn.jsdelivr.net/npm/mathjax@3.2.0/es5/tex-svg.js"],
+        external_scripts=[f"https://cdn.jsdelivr.net/npm/mathjax@{v}/es5/tex-svg.js"],
     )
 
     app.layout = html.Div(id="div", children=[html.Button(id="btn")])
@@ -895,16 +880,16 @@ def load_chart(n_clicks):
     # Give time for the async dependency to be requested (if any)
     dash_dcc.wait_for_element("button#btn")
 
-    scripts = dash_dcc.driver.find_elements(By.CSS_SELECTOR, "script")
-    assert findSyncMathJax(scripts) is None
-    assert findAsyncMathJax(scripts) is None
+    # even in eager mode (when the async bundle is preloaded) we keep the
+    # external version, which seems to be a pleasant effect of how
+    # webpack bundles these chunks!
+    assert dash_dcc.driver.execute_script("return MathJax.version") == v
 
     dash_dcc.find_element("#btn").click()
     dash_dcc.wait_for_element(".gtitle-math")
 
-    scripts = dash_dcc.driver.find_elements(By.CSS_SELECTOR, "script")
-    assert findSyncMathJax(scripts) is None
-    assert findAsyncMathJax(scripts) is None
+    # We still have the external version, not the built-in one
+    assert dash_dcc.driver.execute_script("return MathJax.version") == v
 
     assert dash_dcc.get_logs() == []
 
@@ -928,9 +913,7 @@ def test_grva011_without_mathjax(dash_dcc, is_eager):
     dash_dcc.start_server(app)
     assert dash_dcc.wait_for_element(".gtitle").text == "Apple: $2, Orange: $3"
 
-    scripts = dash_dcc.driver.find_elements(By.CSS_SELECTOR, "script")
-    assert findSyncMathJax(scripts) is None
-    assert findAsyncMathJax(scripts) is None
+    assert not dash_dcc.driver.execute_script("return !!Window.MathJax")
 
     assert dash_dcc.get_logs() == []
 
@@ -955,9 +938,7 @@ def test_grva012_with_mathjax(dash_dcc, is_eager):
     dash_dcc.start_server(app)
     dash_dcc.wait_for_element(".gtitle-math")
 
-    scripts = dash_dcc.driver.find_elements(By.CSS_SELECTOR, "script")
-    assert findSyncMathJax(scripts) is None
-    assert findAsyncMathJax(scripts) is None
+    assert dash_dcc.driver.execute_script("return !!Window.MathJax")
 
     assert dash_dcc.get_logs() == []
 
@@ -991,6 +972,9 @@ def toggle(n):
 
     # Initial state: no MathJax loaded or rendered, unformatted text is shown
     dash_dcc.wait_for_contains_text(".gtitle", gravity)
+
+    # Note: in eager mode, the async-mathjax bundle IS loaded, but it seems like
+    # it isn't executed until we ask for MathJax with import()
     assert not dash_dcc.driver.execute_script("return !!window.MathJax")
 
     btn = dash_dcc.find_element("#btn")

components/dash-core-components/tests/integration/markdown/test_markdown.py

@@ -367,6 +367,10 @@ def test_mkdw008_mathjax_visual(dash_dcc):
     )
 
     dash_dcc.start_server(app)
+    dash_dcc.find_element("h1 svg")
+    dash_dcc.find_element("#graph-with-math svg")
+    assert dash_dcc.driver.execute_script("return !!window.MathJax")
+
     dash_dcc.percy_snapshot("mkdw008 - markdown and graph with/without mathjax")
 
     assert dash_dcc.get_logs() == []