Merge pull request #3142 from fcollonval/fcollonval/issue3036

Refactor JupyterLab JS extensions and package as federated extension

Author: nicolaskruchten

Diff for: .circleci/config.yml

@@ -165,6 +165,7 @@ jobs:
         environment:
           PERCY_ENABLED: True
           PERCY_PROJECT: plotly/plotly.py
+    resource_class: large
 
     steps:
       - checkout
@@ -196,6 +197,7 @@ jobs:
   python_37_chart_studio:
     docker:
       - image: circleci/python:3.7-stretch-node-browsers
+    resource_class: large
 
     steps:
       - checkout
@@ -212,12 +214,13 @@ jobs:
       - image: circleci/python:3.7-stretch-node-browsers
         environment:
           LANG: en_US.UTF-8
+    resource_class: large
 
     steps:
       - checkout
       - run:
           name: Install dependencies
-          command: "cd packages/python; sudo pip install -r ./plotly/test_requirements/requirements_37_core.txt black inflect"
+          command: "cd packages/python; sudo pip install -r ./plotly/test_requirements/requirements_37_core.txt black inflect; sudo pip install jupyterlab~=3.0"
       - run:
           name: Update jupyterlab-plotly version
           command: "cd packages/python/plotly; python setup.py updateplotlywidgetversion"
@@ -232,7 +235,6 @@ jobs:
           name: Commit
           command: |
             cd packages/python/plotly
-            sudo mkdir /dist
             git config --global user.email "[email protected]"
             git config --global user.name "Your Name"
             git add -A
@@ -243,15 +245,6 @@ jobs:
           command: |
             cd packages/python/plotly
             python setup.py sdist
-            sudo cp dist/* /dist
-          when: always
-      - run:
-          name: npm-pack widget
-          command: |
-            cd packages/javascript/jupyterlab-plotly/
-            npm install webpack
-            npm pack
-            sudo cp ./jupyterlab-plotly* /dist
           when: always
       - store_artifacts:
           path: packages/python/plotly/dist

Diff for: .gitignore

@@ -48,3 +48,7 @@ doc/python/.mapbox_token
 doc/.ipynb_checkpoints
 tags
 doc/check-or-enforce-order.py
+
+packages/javascript/jupyterlab-plotly/lib/
+packages/python/plotly/jupyterlab_plotly/labextension/
+packages/python/plotly/jupyterlab_plotly/nbextension/index.js*

Diff for: README.md

@@ -39,7 +39,7 @@ Our recommended IDE for Plotly’s Python graphing library is Dash Enterprise’
 
 `pip install plotly==4.14.3`
 
-Inside [Jupyter notebook](https://jupyter.org/install) (installable with `pip install "notebook>=5.3" "ipywidgets>=7.5"`):
+Inside [Jupyter](https://jupyter.org/install) (installable with `pip install "jupyterlab>=3" "ipywidgets>=7.6"`):
 
 ```python
 import plotly.graph_objects as go
@@ -95,37 +95,22 @@ or conda.
 conda install -c plotly plotly=4.14.3
 ```
 
-### Jupyter Notebook Support
-
-For use in the Jupyter Notebook, install the `notebook` and `ipywidgets`
-packages using `pip`:
-
-```
-pip install "notebook>=5.3" "ipywidgets>=7.5"
-```
-
-or `conda`:
-
-```
-conda install "notebook>=5.3" "ipywidgets>=7.5"
-```
-
 ### JupyterLab Support
 
 For use in JupyterLab, install the `jupyterlab` and `ipywidgets`
 packages using `pip`:
 
 ```
-pip install jupyterlab "ipywidgets>=7.5"
+pip install jupyterlab>=3 "ipywidgets>=7.6"
 ```
 
 or `conda`:
 
 ```
-conda install jupyterlab "ipywidgets>=7.5"
+conda install jupyterlab>=3 "ipywidgets>=7.6"
 ```
 
-Then run the following commands to install the required JupyterLab extensions (note that this will require [`node`](https://nodejs.org/) to be installed):
+For JupyterLab 2 or earlier, run the following commands to install the required JupyterLab extensions (note that this will require [`node`](https://nodejs.org/) to be installed):
 
 ```
 # Basic JupyterLab renderer support
@@ -137,6 +122,21 @@ jupyter labextension install @jupyter-widgets/jupyterlab-manager plotlywidget@4.
 
 Please check out our [Troubleshooting guide](https://plotly.com/python/troubleshooting/) if you run into any problems with JupyterLab.
 
+### Jupyter Notebook Support
+
+For use in the Jupyter Notebook, install the `notebook` and `ipywidgets`
+packages using `pip`:
+
+```
+pip install "notebook>=5.3" "ipywidgets>=7.5"
+```
+
+or `conda`:
+
+```
+conda install "notebook>=5.3" "ipywidgets>=7.5"
+```
+
 ### Static Image Export
 
 plotly.py supports [static image export](https://plotly.com/python/static-image-export/),

Diff for: doc/python/getting-started.md

@@ -144,16 +144,16 @@ For use in [JupyterLab](https://jupyterlab.readthedocs.io/en/stable/), install t
 packages using `pip`:
 
 ```
-$ pip install jupyterlab "ipywidgets>=7.5"
+$ pip install jupyterlab "ipywidgets>=7.6"
 ```
 
 or `conda`:
 
 ```
-$ conda install jupyterlab "ipywidgets>=7.5"
+$ conda install jupyterlab "ipywidgets>=7.6"
 ```
 
-Then run the following commands to install the required JupyterLab extensions (note that this will require [`node`](https://nodejs.org/) to be installed):
+For JupyterLab 2 or earlier, run the following commands to install the required JupyterLab extensions (note that this will require [`node`](https://nodejs.org/) to be installed):
 
 ```
 # JupyterLab renderer support

Diff for: doc/python/renderers.md

@@ -72,7 +72,7 @@ fig
 
 > To be precise, figures will display themselves using the current default renderer when the two following conditions are true. First, the last expression in a cell must evaluate to a figure. Second, `plotly.py` must be running from within an `IPython` kernel.
 
-**In many contexts, an appropriate renderer will be chosen automatically and you will not need to perform any additional configuration.** These contexts include the classic [Jupyter Notebook](https://jupyter.org/), [JupyterLab](https://jupyterlab.readthedocs.io/en/stable/) (provided the `jupyterlab-plotly` JupyterLab extension is installed), [Visual Studio Code notebooks](https://code.visualstudio.com/docs/python/jupyter-support), [Google Colaboratory](https://colab.research.google.com/notebooks/intro.ipynb), [Kaggle](https://www.kaggle.com/kernels) notebooks, [Azure](https://notebooks.azure.com/) notebooks, and the [Python interactive shell](https://www.python.org/shell/).
+**In many contexts, an appropriate renderer will be chosen automatically and you will not need to perform any additional configuration.** These contexts include the classic [Jupyter Notebook](https://jupyter.org/), [JupyterLab](https://jupyterlab.readthedocs.io/en/stable/) (provided the `plotlywidget` JupyterLab extension is installed), [Visual Studio Code notebooks](https://code.visualstudio.com/docs/python/jupyter-support), [Google Colaboratory](https://colab.research.google.com/notebooks/intro.ipynb), [Kaggle](https://www.kaggle.com/kernels) notebooks, [Azure](https://notebooks.azure.com/) notebooks, and the [Python interactive shell](https://www.python.org/shell/).
 
 Additional contexts are supported by choosing a compatible renderer including the [IPython console](https://docs.spyder-ide.org/ipythonconsole.html), [QtConsole](https://qtconsole.readthedocs.io/en/stable/), [Spyder](https://www.spyder-ide.org/), and more.
 
@@ -169,7 +169,7 @@ This renderer may be useful when working with notebooks than contain lots of lar
 
 ###### `plotly_mimetype`
 
-The `plotly_mimetype` renderer creates a specification of the figure (called a MIME-type bundle), and requests that the current user interface displays it. User interfaces that support this renderer include [JupyterLab](https://jupyterlab.readthedocs.io/en/stable/) (requires the [`jupyterlab-plotly`](https://www.npmjs.com/package/jupyterlab-plotly) extension), [nteract](https://nteract.io/), and the Visual Studio Code [notebook interface](https://code.visualstudio.com/docs/python/jupyter-support).
+The `plotly_mimetype` renderer creates a specification of the figure (called a MIME-type bundle), and requests that the current user interface displays it. User interfaces that support this renderer include [JupyterLab](https://jupyterlab.readthedocs.io/en/stable/) (requires the [`plotlywidget`](https://www.npmjs.com/package/plotlywidget) extension), [nteract](https://nteract.io/), and the Visual Studio Code [notebook interface](https://code.visualstudio.com/docs/python/jupyter-support).
 
 ###### `jupyterlab`, `nteract`, and `vscode`
 These are aliases for `plotly_mimetype` since this renderer is a good choice when working in JupyterLab, nteract, and the Visual Studio Code notebook interface. Note that in VSCode Notebooks, the version of Plotly.js that is used to render is provided by the [vscode-python extension](https://code.visualstudio.com/docs/languages/python) and often trails the latest version by several weeks, so the latest features of `plotly` may not be available in VSCode right away. The situation is similar for Nteract.

Diff for: doc/python/troubleshooting.md

@@ -65,15 +65,23 @@ IFrame(snippet_url + 'renderers', width='100%', height=630)
 
 ### JupyterLab Problems
 
-In order to use `plotly` in JupyterLab, you *must have the extensions installed* as detailed in the [Getting Started guide](/python/getting-started). There are two extensions: `jupyterlab-plotly` for rendering figures with `fig.show()` and `plotlywidget` for the `FigureWidget`. Please note that the *extension version matters*: the extension versions in the [Getting Started](/python/getting-started) guide match the version of `plotly` at the top of the guide and so they should be installed together.
+In order to use `plotly` in JupyterLab, you *must have the extensions installed* as detailed in the [Getting Started guide](/python/getting-started). There is one extension: `plotlywidget`. Please note that the *extension version matters*: the extension versions in the [Getting Started](/python/getting-started) guide match the version of `plotly` at the top of the guide and so they should be installed together. Note also that these extensions are meant to work with JupyterLab 1 or above but not 0.x.
 
 To list your current extensions, run the following command in a terminal shell **from the same environment as JupyterLab was launched**:
 
 ```bash
 $ jupyter labextension list
 ```
 
-If you have [installed additional python environments](https://ipython.readthedocs.io/en/stable/install/kernel_install.html) (or kernels) to use with JupyterLab, or if you are using a centrally hosted JupyterLab installation, you need to make sure that the extensions are installed in the python environment used to launch JupyterLab (the "server" environment). If you accidentally installed the extensions (and run the command above) in one of the additional python environments ("processing" environments), then it is possible for the command above to list the correct extensions but for them to not be available in the JupyterLab front-end you have loaded in your browser. To check if this is the problem, you can [look at the active extension list through your browser via the JupyterLab Extension Manager](https://jupyterlab.readthedocs.io/en/stable/user/extensions.html#using-the-extension-manager), which will always list the extensions in the "server" environment. To summarize: if you use JupyterLab with multiple python environments, the extensions must be installed in the "server" environment, and the plotly python library must be installed in each "processing" environment that you intend to use. 
+If you have [installed additional python environments](https://ipython.readthedocs.io/en/stable/install/kernel_install.html) (or kernels) to use with JupyterLab, or if you are using a centrally hosted JupyterLab installation, you need to make sure that the extensions are installed in the python environment used to launch JupyterLab (the "server" environment). If you accidentally installed the extensions (and run the command above) in one of the additional python environments ("processing" environments), then it is possible for the command above to list the correct extensions but for them to not be available in the JupyterLab front-end you have loaded in your browser. To check if this is the problem, you can [look at the active extension list through your browser via the JupyterLab Extension Manager](https://jupyterlab.readthedocs.io/en/stable/user/extensions.html#using-the-extension-manager), which will always list the extensions in the "server" environment. To summarize: if you use JupyterLab with multiple python environments, the extensions must be installed in the "server" environment, and the plotly python library must be installed in each "processing" environment that you intend to use.
+
+> Version 4.14.3 or earlier needed two extensions (`jupyterlab-plotly` and `plotlywidget`) to be installed manually running:
+
+```bash
+$ jupyter labextension install jupyterlab-plotly @jupyter-widgets/jupyterlab-manager plotlywidget
+```
+
+#### JupyterLab 2 and earlier
 
 If you have the correct version of the extensions installed and active in your active JupyterLab sessions and are still seeing problems, the issue may clear up if you rebuild JupyterLab. This shouldn't be required in principle but many users have resolved their issues this way. To rebuild JupyterLab, shut down JupyterLab and run the following command in a terminal shell **from the same environment as JupyterLab was launched**:
 
@@ -84,7 +92,6 @@ $ jupyter lab build
 To uninstall your Plotly extensions prior to reinstalling them, run the following commands in a terminal shell before reinstalling them by following the instructions in the [Getting Started guide](/python/getting-started):
 
 ```bash
-$ jupyter labextension uninstall jupyterlab-plotly
 $ jupyter labextension uninstall plotlywidget
 ```
 

Diff for: packages/javascript/jupyterlab-plotly/README.md

@@ -1,5 +1,6 @@
-JupyterLab Extension for Plotly.py
+Jupyter Extension for Plotly.py
 
 See https://plot.ly/python/getting-started/ for details.
 
-Install with `jupyter labextension install jupyterlab-plotly`
+Install with `jupyter labextension install plotlywidget` in JupyterLab, otherwise
+just install Plotly.py and it will automatically work in Classic Notebooks.