Fix mathjax default url and bump ipywidgets packages (#1496)

* Fix default mathjax url

* Bump ipywidgets

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Fix ui-tests

* More visual regression fixes

* Yarn f***** dedupe

---------

Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>

Author: martinRenou

packages/voila/package.json

@@ -11,8 +11,8 @@
   },
   "browserslist": ">0.8%, not ie 11, not op_mini all, not dead",
   "dependencies": {
-    "@jupyter-widgets/base": "^6.0.6",
-    "@jupyter-widgets/jupyterlab-manager": "^5.0.9",
+    "@jupyter-widgets/base": "^6.0.10",
+    "@jupyter-widgets/jupyterlab-manager": "^5.0.13",
     "@jupyterlab/application": "^4.0.0",
     "@jupyterlab/apputils": "^4.0.0",
     "@jupyterlab/apputils-extension": "^4.0.0",

packages/voila/src/tools.ts

@@ -90,7 +90,7 @@ export function shouldUseMathJax2() {
     PageConfig.setOption(
       urlParam,
       url === 'null'
-        ? 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js'
+        ? 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/3.2.2/es5/latest.min.js'
         : url
     );
     PageConfig.setOption(

ui-tests/package.json

@@ -4,7 +4,7 @@
   "description": "Voila UI Tests",
   "private": true,
   "scripts": {
-    "start": "voila ../notebooks --no-browser --show_tracebacks True --Voila.mathjax_url=https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js",
+    "start": "voila ../notebooks --no-browser --show_tracebacks True",
     "start:detached": "yarn run start&",
     "test": "npx playwright test",
     "test:debug": "PWDEBUG=1 playwright test",

ui-tests/tests/voila.test.ts

@@ -83,7 +83,7 @@ test.describe('Voila performance Tests', () => {
     const testFunction = async () => {
       await page.goto(`/voila/render/${notebookName}.ipynb?template=classic`);
       // wait for the widgets to load
-      await page.waitForSelector('span[role="presentation"] >> text=x');
+      await page.waitForSelector('.slider-container');
     };
     await addBenchmarkToTest(notebookName, testFunction, testInfo, browserName);
 
@@ -103,7 +103,7 @@ test.describe('Voila performance Tests', () => {
     const testFunction = async () => {
       await page.goto(`/voila/render/${notebookName}.ipynb`);
       // wait for the widgets to load
-      await page.waitForSelector('span.mjx-char >> text=x');
+      await page.waitForSelector('.slider-container');
     };
     await addBenchmarkToTest(notebookName, testFunction, testInfo, browserName);
     // change the value of the slider
@@ -128,7 +128,7 @@ test.describe('Voila performance Tests', () => {
     const testFunction = async () => {
       await page.goto(`/voila/render/${notebookName}.ipynb?theme=dark`);
       // wait for the widgets to load
-      await page.waitForSelector('span[role="presentation"] >> text=x');
+      await page.waitForSelector('.slider-container');
     };
     await addBenchmarkToTest(notebookName, testFunction, testInfo, browserName);
 
@@ -148,7 +148,7 @@ test.describe('Voila performance Tests', () => {
         `/voila/render/${notebookName}.ipynb?theme=JupyterLab%20Miami%20Nights`
       );
       // wait for the widgets to load
-      await page.waitForSelector('span[role="presentation"] >> text=x');
+      await page.waitForSelector('.slider-container');
     };
     await addBenchmarkToTest(notebookName, testFunction, testInfo, browserName);
 
@@ -334,7 +334,7 @@ test.describe('Voila performance Tests', () => {
     const notebookName = 'reveal';
     const testFunction = async () => {
       await page.goto(`/voila/render/${notebookName}.ipynb`);
-      await page.waitForSelector('span[role="presentation"] >> text=x');
+      await page.waitForSelector('.slider-container');
     };
     await addBenchmarkToTest(notebookName, testFunction, testInfo, browserName);
     expect(await page.screenshot()).toMatchSnapshot(`${notebookName}.png`);

voila/utils.py

@@ -102,7 +102,8 @@ def get_page_config(base_url, settings, log, voila_configuration: VoilaConfigura
     }
     mathjax_config = settings.get("mathjax_config", "TeX-AMS_CHTML-full,Safe")
     mathjax_url = settings.get(
-        "mathjax_url", "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js"
+        "mathjax_url",
+        "https://cdnjs.cloudflare.com/ajax/libs/mathjax/3.2.2/es5/latest.min.js",
     )
     page_config.setdefault("mathjaxConfig", mathjax_config)
     page_config.setdefault("fullMathjaxUrl", mathjax_url)