Allow require.js by bundling all js dependencies UMD style (#167)

hoetmaaiers · choldgraf · web-flow · commit e86bcd1eb5be · 2020-05-04T08:45:42.000+02:00
Co-authored-by: Chris Holdgraf &lt;choldgraf@berkeley.edu&gt;
Co-authored-by: Robin Houdmeyers &lt;robin.houdmeyers@vito.be&gt;
diff --git a/docs/conf.py b/docs/conf.py
@@ -36,6 +36,7 @@
     "sphinx.ext.autosummary",
     "numpydoc",
     "recommonmark",
+    "jupyter_sphinx.execute",
 ]
 
 autosummary_generate = True
diff --git a/docs/demo/demo.rst b/docs/demo/demo.rst
@@ -475,3 +475,21 @@ Download Links
 ==============
 
 :download:`This long long long long long long long long long long long long long long long download link should be blue, normal weight text with a leading icon, and should wrap white-spaces <static/yi_jing_01_chien.jpg>`
+
+HTML
+====
+
+The HTML below shouldn't display, but it uses RequireJS to make sure that all
+works as expected. If the widgets don't show up, RequireJS may be broken.
+
+.. jupyter-execute:: 
+
+   import plotly.io as pio
+   import plotly.express as px
+   import plotly.offline as py
+
+   pio.renderers.default = "notebook"
+
+   df = px.data.iris()
+   fig = px.scatter(df, x="sepal_width", y="sepal_length", color="species", size="sepal_length")
+   fig
diff --git a/docs/requirements.txt b/docs/requirements.txt
@@ -2,4 +2,6 @@ sphinx
 numpydoc
 recommonmark
 pandas
+jupyter_sphinx
+plotly
 numpy
diff --git a/package.json b/package.json
@@ -30,6 +30,8 @@
   },
   "dependencies": {
     "bootstrap": "^4.4.1",
-    "optimize-css-assets-webpack-plugin": "^5.0.3"
+    "jquery": "3.4.1",
+    "optimize-css-assets-webpack-plugin": "^5.0.3",
+    "popper.js": "^1.16.1"
   }
 }
diff --git a/pydata_sphinx_theme/layout.html b/pydata_sphinx_theme/layout.html
@@ -18,12 +18,8 @@
 {%- endblock %}
 
 {%- block extrahead %}
-
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <meta name="docsearch:language" content="en">
-
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
-<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
 {%- endblock %}
 
 {# Silence the sidebar's, relbar's #}
diff --git a/pydata_sphinx_theme/static/js/index.js b/pydata_sphinx_theme/static/js/index.js
diff --git a/pydata_sphinx_theme/theme.conf b/pydata_sphinx_theme/theme.conf
@@ -13,4 +13,4 @@ google_analytics_id =
 show_prev_next = True
 search_bar_text = Search the docs ...
 search_bar_position = sidebar
-navigation_with_keys = True
+navigation_with_keys = True
diff --git a/src/js/index.js b/src/js/index.js
@@ -1,3 +1,8 @@
+require('jquery/dist/jquery');
+require('popper.js/dist/umd/popper');
+require("bootstrap/dist/js/bootstrap.bundle");
+
+
 /**
  * This file should be edited in ./src/js/index.js. After bundling the resulting file in ./pydata_sphinx_theme/static/js/index.js should never be manually changed.
  * Edit ./src/js/index.js and run yarn build:dev or yarn build:production.
diff --git a/webpack.common.js b/webpack.common.js
@@ -1,3 +1,4 @@
+const webpack = require('webpack');
 const path = require('path');
 const { CleanWebpackPlugin } = require('clean-webpack-plugin');
 
@@ -40,5 +41,12 @@ module.exports = {
       },
     ],
   },
-  plugins: [new CleanWebpackPlugin()],
+  plugins: [
+    new CleanWebpackPlugin(),
+    new webpack.ProvidePlugin({
+      '$': "jquery",
+      'jQuery': "jquery",
+      'Popper': 'popper.js'
+    }),
+  ],
 };
diff --git a/yarn.lock b/yarn.lock
@@ -2895,6 +2895,11 @@ isstream@~0.1.2:
   resolved "https://registry.yarnpkg.com/isstream/-/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a"
   integrity sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo=
 
+jquery@3.4.1:
+  version "3.4.1"
+  resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.4.1.tgz#714f1f8d9dde4bdfa55764ba37ef214630d80ef2"
+  integrity sha512-36+AdBzCL+y6qjw5Tx7HgzeGCzC81MDDgaUP8ld2zhx58HdqXGoBd+tHdrBMiyjGQs0Hxs/MLZTu/eHNJJuWPw==
+
 js-base64@^2.1.8:
   version "2.5.2"
   resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.5.2.tgz#313b6274dda718f714d00b3330bbae6e38e90209"
@@ -3919,6 +3924,11 @@ pkg-dir@^3.0.0:
   dependencies:
     find-up "^3.0.0"
 
+popper.js@^1.16.1:
+  version "1.16.1"
+  resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.16.1.tgz#2a223cb3dc7b6213d740e40372be40de43e65b1b"
+  integrity sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==
+
 portfinder@^1.0.25:
   version "1.0.25"
   resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.25.tgz#254fd337ffba869f4b9d37edc298059cb4d35eca"

Original file line number	Diff line number	Diff line change
`@@ -36,6 +36,7 @@`
`36`	`36`	`"sphinx.ext.autosummary",`
`37`	`37`	`"numpydoc",`
`38`	`38`	`"recommonmark",`
	`39`	`+ "jupyter_sphinx.execute",`
`39`	`40`	`]`
`40`	`41`
`41`	`42`	`autosummary_generate = True`
Original file line number	Diff line number	Diff line change
`@@ -30,6 +30,8 @@`
`30`	`30`	`},`
`31`	`31`	`"dependencies": {`
`32`	`32`	`"bootstrap": "^4.4.1",`
`33`		`- "optimize-css-assets-webpack-plugin": "^5.0.3"`
	`33`	`+ "jquery": "3.4.1",`
	`34`	`+ "optimize-css-assets-webpack-plugin": "^5.0.3",`
	`35`	`+ "popper.js": "^1.16.1"`
`34`	`36`	`}`
`35`	`37`	`}`