Merge branch 'master' into regl-build-setup

plotly · Mar 8, 2022 · 80f6f9e94f79cd109e796bdbb9eda8bf730696ff · 80f6f9e
2 parents f8548e1 + c988437
commit 80f6f9e94f79cd109e796bdbb9eda8bf730696ff
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -73,7 +73,7 @@ jobs:
     environment:
       # Alaska time (arbitrary timezone to test date logic)
       TZ: "America/Anchorage"
-    parallelism: 8
+    parallelism: 12
     working_directory: ~/plotly.js
     steps:
       - browser-tools/install-browser-tools: &browser-versions
@@ -200,6 +200,24 @@ jobs:
           name: Test MathJax on firefox-latest
           command: .circleci/test.sh mathjax-firefox82+
 
+  make-baselines-mathjax3:
+    docker:
+      - image: circleci/python:3.8.9
+    working_directory: ~/plotly.js
+    steps:
+      - attach_workspace:
+          at: ~/
+      - run:
+          name: Install kaleido, plotly.io and required fonts
+          command: .circleci/env_image.sh
+      - run:
+          name: Create mathjax v3 png files
+          command: .circleci/test.sh make-baselines-mathjax3
+      - persist_to_workspace:
+          root: ~/
+          paths:
+            - plotly.js
+
   make-baselines:
     parallelism: 4
     docker:
@@ -233,6 +251,20 @@ jobs:
           path: build
           destination: /
 
+  test-baselines-mathjax3:
+    docker:
+      - image: circleci/node:16.8.0
+    working_directory: ~/plotly.js
+    steps:
+      - attach_workspace:
+          at: ~/
+      - run:
+          name: Compare pixels of mathjax v3 baselines
+          command: .circleci/test.sh test-image-mathjax3
+      - store_artifacts:
+          path: build
+          destination: /
+
   make-exports:
     docker:
       - image: circleci/python:3.8.9
@@ -395,6 +427,12 @@ workflows:
       - flaky-no-gl-jasmine:
           requires:
             - install-and-cibuild
+      - make-baselines-mathjax3:
+          requires:
+            - install-and-cibuild
+      - test-baselines-mathjax3:
+          requires:
+            - make-baselines-mathjax3
       - make-baselines:
           requires:
             - install-and-cibuild

diff --git a/.circleci/test.sh b/.circleci/test.sh
@@ -75,7 +75,15 @@ case $1 in
         ;;
 
     mathjax-firefox82+)
-        ./node_modules/karma/bin/karma start test/jasmine/karma.conf.js --FF --skip-tags=noFF82 --bundleTest=mathjax --nowatch || EXIT_STATE=$?
+        ./node_modules/karma/bin/karma start test/jasmine/karma.conf.js --FF --bundleTest=mathjax --skip-tags=noFF82 --nowatch &&
+        ./node_modules/karma/bin/karma start test/jasmine/karma.conf.js --FF --bundleTest=mathjax --mathjax3 --skip-tags=noFF82 --nowatch &&
+        ./node_modules/karma/bin/karma start test/jasmine/karma.conf.js --FF --bundleTest=mathjax_config --mathjax3 --nowatch &&
+        ./node_modules/karma/bin/karma start test/jasmine/karma.conf.js --FF --bundleTest=mathjax_config --nowatch || EXIT_STATE=$?
+        exit $EXIT_STATE
+        ;;
+
+    make-baselines-mathjax3)
+        python3 test/image/make_baseline.py mathjax3    legend_mathjax_title_and_items mathjax parcats_grid_subplots table_latex_multitrace_scatter table_plain_birds table_wrapped_birds ternary-mathjax || EXIT_STATE=$?
         exit $EXIT_STATE
         ;;
 
@@ -90,6 +98,11 @@ case $1 in
         exit $EXIT_STATE
         ;;
 
+    test-image-mathjax3)
+        node test/image/compare_pixels_test.js mathjax3 || { tar -cvf build/baselines.tar build/test_images/*.png ; exit 1 ; } || EXIT_STATE=$?
+        exit $EXIT_STATE
+        ;;
+
     source-syntax)
         npm run lint        || EXIT_STATE=$?
         npm run test-syntax || EXIT_STATE=$?

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -9,6 +9,35 @@ To see all merged commits on the master branch that will be part of the next plo
 
 where X.Y.Z is the semver of most recent plotly.js release.
 
+## [2.10.1] -- 2022-03-08
+
+### Fixed
+ - Fix `mesh3d` generation when `alphahull` is a positive number (regression introduced in 2.5.1) [[#6133](https://github.com/plotly/plotly.js/pull/6133)]
+
+
+## [2.10.0] -- 2022-03-04
+
+### Added
+ - Add support to use version 3 of MathJax and add `typesetMath` attribute to config [[#6073](https://github.com/plotly/plotly.js/pull/6073)],
+   with thanks to [Equinor](https://www.equinor.com) for sponsoring the related development!
+ - Add `fillpattern` options to `scatter` trace [[#6101](https://github.com/plotly/plotly.js/pull/6101)],
+   with thanks to @s417-lama for the contribution!
+
+
+## [2.9.0] -- 2022-02-04
+
+### Added
+ - Implement `ticklabelstep` to reduce labels on 2D axes and colorbars [[#6088](https://github.com/plotly/plotly.js/pull/6088)],
+   this feature was anonymously sponsored: thank you to our sponsor!
+
+### Changed
+ - Display the version of plotly.js when hovering over the modebar [[#6077](https://github.com/plotly/plotly.js/pull/6077)]
+ - Various dependency updates as listed under [the v2.9.0 milestone](https://github.com/plotly/plotly.js/milestone/69?closed=1)
+
+### Fixed
+ - Fix vertical spacing of legend items in horizontal mode [[#6094](https://github.com/plotly/plotly.js/pull/6094)]
+
+
 ## [2.8.3] -- 2021-12-20
 
 ### Fixed

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -118,7 +118,7 @@ npm start
 
 This command bundles up the source files with source maps using
 [browserify](https://github.com/substack/node-browserify), starts a
-[watchify](https://github.com/substack/watchify) file watcher (making the your
+[watchify](https://github.com/substack/watchify) file watcher (making your
 dev plotly.js bundle update every time a source file is saved) and opens up a
 tab in your browser.
 

diff --git a/README.md b/README.md
@@ -55,7 +55,7 @@ You may also consider using [`plotly.js-dist`](https://www.npmjs.com/package/plo
 
 ```html
 <head>
-    <script src="https://cdn.plot.ly/plotly-2.8.3.min.js"></script>
+    <script src="https://cdn.plot.ly/plotly-2.10.1.min.js"></script>
 </head>
 <body>
     <div id="gd"></div>
@@ -72,7 +72,7 @@ You may also consider using [`plotly.js-dist`](https://www.npmjs.com/package/plo
 Alternatively you may consider using [native ES6 import](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) in the script tag.
 ```html
 <script type="module">
-    import "https://cdn.plot.ly/plotly-2.8.3.min.js"
+    import "https://cdn.plot.ly/plotly-2.10.1.min.js"
     Plotly.newPlot("gd", [{ y: [1, 2, 3] }])
 </script>
 ```
@@ -82,16 +82,24 @@ Fastly supports Plotly.js with free CDN service. Read more at <https://www.fastl
 ### Un-minified versions are also available on CDN
 While non-minified source files may contain characters outside UTF-8, it is recommended that you specify the `charset` when loading those bundles.
 ```html
-<script src="https://cdn.plot.ly/plotly-2.8.3.js" charset="utf-8"></script>
+<script src="https://cdn.plot.ly/plotly-2.10.1.js" charset="utf-8"></script>
 ```
 
 > Please note that as of v2 the "plotly-latest" outputs (e.g. https://cdn.plot.ly/plotly-latest.min.js) will no longer be updated on the CDN, and will stay at the last v1 patch v1.58.5. Therefore, to use the CDN with plotly.js v2 and higher, you must specify an exact plotly.js version.
 
-To support MathJax, you need to load version two of MathJax e.g. `v2.7.5` files from CDN or npm.
+To support MathJax, you could load either version two or version three of MathJax files, for example:
 ```html
 <script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-AMS-MML_SVG.js"></script>
 ```
 
+```html
+<script src="https://cdn.jsdelivr.net/npm/mathjax@3.2.0/es5/tex-svg.js"></script>
+```
+
+> When using MathJax version 3, it is also possible to use `chtml` output on the other parts of the page in addition to `svg` output for the plotly graph.
+Please refer to `devtools/test_dashboard/index-mathjax3chtml.html` to see an example.
+
+
 ## Bundles
 There are two kinds of plotly.js bundles:
 1. Complete and partial official bundles that are distributed to `npm` and the `CDN`, described in [the dist README](https://github.com/plotly/plotly.js/blob/master/dist/README.md).

diff --git a/devtools/test_dashboard/index-mathjax3.html b/devtools/test_dashboard/index-mathjax3.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Plotly.js Devtools - MathJax v3 loaded with svg output</title>
+  <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Open+Sans:600,400,300,200|Droid+Sans|PT+Sans+Narrow|Gravitas+One|Droid+Sans+Mono|Droid+Serif|Raleway|Old+Standard+TT"/>
+  <link rel="stylesheet" type="text/css" href="./style.css">
+</head>
+<body>
+  <header>
+    <img src="http://images.plot.ly/logo/plotlyjs-logo@2x.png" onClick="Tabs.reload();" />
+    <span id="reload-time"></span>
+
+    <input id="mocks-search" type="text" placeholder="mocks search" />
+    <input id="css-transform" type="text" placeholder="css transform" />
+  </header>
+
+  <section id="mocks-list"></section>
+
+  <p id="pWithMathJax">MathJax $V^3$ with $svg$ output on the page as well as plotly graphs</p>
+  <h4>no MathJax: Apple: $2, Orange: $3</h4>
+
+  <div id="plots">
+    <div id="graph"></div>
+  </div>
+  <div id="snapshot"></div>
+
+  <script>
+    window.MathJax = {
+      startup: {
+        elements: [
+          document.getElementById('pWithMathJax')
+        ],
+        // typeset: false,
+        // in case the elements array is empty one could disable startup typeset
+        // https://docs.mathjax.org/en/latest/options/startup/startup.html#the-configuration-block
+      }
+    };
+  </script>
+  <script src="../../node_modules/mathjax-v3/es5/tex-svg.js"></script>
+  <script charset="utf-8" id="source" src="../../build/plotly.js" type="module"></script>
+  <script charset="utf-8" src="../../build/test_dashboard-bundle.js"></script>
+</body>
+</html>
diff --git a/devtools/test_dashboard/index-mathjax3chtml.html b/devtools/test_dashboard/index-mathjax3chtml.html
@@ -0,0 +1,67 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Plotly.js Devtools - MathJax v3 loaded with chtml output</title>
+  <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Open+Sans:600,400,300,200|Droid+Sans|PT+Sans+Narrow|Gravitas+One|Droid+Sans+Mono|Droid+Serif|Raleway|Old+Standard+TT"/>
+  <link rel="stylesheet" type="text/css" href="./style.css">
+</head>
+<body>
+  <header>
+    <img src="http://images.plot.ly/logo/plotlyjs-logo@2x.png" onClick="Tabs.reload();" />
+    <span id="reload-time"></span>
+
+    <input id="mocks-search" type="text" placeholder="mocks search" />
+    <input id="css-transform" type="text" placeholder="css transform" />
+  </header>
+
+  <section id="mocks-list"></section>
+
+  <p>MathJax $V^3$ with $chtml$ output on the page and <b>svg</b> output on the plotly graphs</p>
+  <div id="plots">
+    <div id="graph"></div>
+  </div>
+  <div id="snapshot"></div>
+
+  <script>
+    window.MathJax = window.MathJax || {
+      // see https://github.com/mathjax/MathJax/issues/2705#issuecomment-859742446
+      loader: {load: ['output/svg']},
+      startup: {
+        ready() {
+          // Get the MathJax modules that we need.
+          const {mathjax} = MathJax._.mathjax;
+          const {SVG} = MathJax._.output.svg_ts;
+
+          // Do the normal setup
+          MathJax.startup.defaultReady();
+
+          // Create an SVG output jax and a new MathDocument that uses it.
+          const svgOutput = new SVG(MathJax.config.svg);
+          const svgDocument = mathjax.document(document, {
+            ...MathJax.config.options,
+            InputJax: MathJax.startup.input,
+            OutputJax: svgOutput
+          });
+
+          // Define the SVG-based conversion methods
+          MathJax.tex2svg = (math, options = {}) => {
+            options.format = svgDocument.inputJax[0].name;
+            return svgDocument.convert(math, options);
+          };
+          /*
+          MathJax.tex2svgPromise = (math, options = {}) => {
+            options.format = svgDocument.inputJax[0].name;
+            return mathjax.handleRetriesFor(() => svgDocument.convert(math, options));
+          };
+          */
+          MathJax.svgStylesheet = () => svgOutput.styleSheet(svgDocument);
+        }
+      }
+    };
+  </script>
+  <script src="../../node_modules/mathjax-v3/es5/tex-chtml.js"></script>
+
+  <script charset="utf-8" id="source" src="../../build/plotly.js" type="module"></script>
+  <script charset="utf-8" src="../../build/test_dashboard-bundle.js"></script>
+</body>
+</html>
diff --git a/devtools/test_dashboard/index-strict.html b/devtools/test_dashboard/index-strict.html
@@ -22,7 +22,7 @@
   </div>
   <div id="snapshot"></div>
 
-  <script src="../../node_modules/mathjax/MathJax.js?config=TeX-AMS-MML_SVG"></script>
+  <script src="../../node_modules/mathjax-v2/MathJax.js?config=TeX-AMS-MML_SVG"></script>
   <script charset="utf-8" id="source" src="../../build/plotly.js"></script>
   <script charset="utf-8" src="../../build/test_dashboard-bundle.js"></script>
 </body>

diff --git a/devtools/test_dashboard/index.html b/devtools/test_dashboard/index.html
@@ -20,8 +20,8 @@
   </div>
   <div id="snapshot"></div>
 
-  <script src="../../node_modules/mathjax/MathJax.js?config=TeX-AMS-MML_SVG"></script>
-  <script charset="utf-8" id="source"  type="module">import "../../build/plotly.js"</script>
+  <script src="../../node_modules/mathjax-v2/MathJax.js?config=TeX-AMS-MML_SVG"></script>
+  <script charset="utf-8" id="source" src="../../build/plotly.js" type="module"></script>
   <script charset="utf-8" src="../../build/test_dashboard-bundle.js"></script>
 </body>
 </html>
diff --git a/devtools/test_dashboard/server.js b/devtools/test_dashboard/server.js
@@ -13,6 +13,8 @@ var shortcutPaths = require('../../tasks/util/shortcut_paths');
 var args = minimist(process.argv.slice(2), {});
 var PORT = args.port || 3000;
 var strict = args.strict;
+var mathjax3 = args.mathjax3;
+var mathjax3chtml = args.mathjax3chtml;
 
 // Create server
 var server = http.createServer(ecstatic({
@@ -25,7 +27,11 @@ var server = http.createServer(ecstatic({
 // Make watchified bundle for plotly.js
 var bundlePlotly = makeWatchifiedBundle(strict, function() {
     // open up browser window on first bundle callback
-    open('http://localhost:' + PORT + '/devtools/test_dashboard/index' + (strict ? '-strict' : '') + '.html');
+    open('http://localhost:' + PORT + '/devtools/test_dashboard/index' + (
+        strict ? '-strict' :
+        mathjax3 ? '-mathjax3' :
+        mathjax3chtml ? '-mathjax3chtml' : ''
+    ) + '.html');
 });
 
 // Bundle devtools code