Errors when `@jupyterlab/geojson-extension` and `jupyter-leaflet` are both enabled

Not sure where to report this issue as it is an interaction between

@jupyterlab/geojson-extension v0.18.1
jupyter-leaflet v0.10.1

using:

jupyter-lab --version is 0.35.4

Individually both extensions work so long as the other one is disabled (I’m disabling at user level), but if both are enabled none work. They break with different error messages to the javascript console.

I’m not trying to use both in one notebook, separate notebooks

• Test notebook for GeoJSON

from IPython.display import GeoJSON
GeoJSON({
    "type": "Feature",
    "geometry": {
        "type": "Point",
        "coordinates": [-118.4563712, 34.0163116]
    }
})

• Test notebook for ipyleaflet

from ipyleaflet import Map
Map(zoom=2)

Looks like some sort of vendor package clashing issue.

Links:

• https://github.com/jupyter-widgets/ipyleaflet
• https://github.com/jupyterlab/jupyter-renderers/tree/master/packages/geojson-extension
• https://github.com/jupyterlab/jupyter-renderers/issues/189

[Kirill888]

This is environment I’m testing in:

#!/bin/bash
set -e -u
env_path="$(pwd)/jup"
python3 -m venv "${env_path}"
source "${env_path}/bin/activate"
which pip
pip install --upgrade pip
pip install jupyterlab ipywidgets ipyleaflet
jupyter-labextension install --no-build @jupyter-widgets/jupyterlab-manager
jupyter-labextension install --no-build jupyter-leaflet
jupyter-labextension install --no-build @jupyterlab/geojson-extension
jupyter lab build

On first load there is this warning

Deprecated include of L.Mixin.Events: this property will be removed in future releases, please inherit from L.Evented instead. checkDeprecatedMixinEvents@http://localhost:8888/lab/static/vendors~main.1e93c2b700311c8f2422.js:19905:47
4R65/</Class.extend@http://localhost:8888/lab/static/vendors~main.1e93c2b700311c8f2422.js:19833:3
OTXi@http://localhost:8888/lab/static/vendors~main.1e93c2b700311c8f2422.js:104879:22
__webpack_require__@http://localhost:8888/lab/static/main.129b72774f1aafaeff51.js:84:12
mGYY@http://localhost:8888/lab/static/vendors~main.1e93c2b700311c8f2422.js:212018:1
__webpack_require__@http://localhost:8888/lab/static/main.129b72774f1aafaeff51.js:84:12
MIrW@http://localhost:8888/lab/static/vendors~main.1e93c2b700311c8f2422.js:98160:9
__webpack_require__@http://localhost:8888/lab/static/main.129b72774f1aafaeff51.js:84:12
O3wJ@http://localhost:8888/lab/static/vendors~main.1e93c2b700311c8f2422.js:103903:13
__webpack_require__@http://localhost:8888/lab/static/main.129b72774f1aafaeff51.js:84:12
xtrE@http://localhost:8888/lab/static/vendors~main.1e93c2b700311c8f2422.js:265343:18
__webpack_require__@http://localhost:8888/lab/static/main.129b72774f1aafaeff51.js:84:12
12aA@http://localhost:8888/lab/static/vendors~main.1e93c2b700311c8f2422.js:11479:23
__webpack_require__@http://localhost:8888/lab/static/main.129b72774f1aafaeff51.js:84:12
main@http://localhost:8888/lab/static/main.129b72774f1aafaeff51.js:1614:16
leaflet-src.js:400
Existing `L` detected, running ipyleaflet's Leaflet in no-conflict mode as `ipyL`

then when displaying Map this is printed to js console

TypeError: "this.obj is undefined"
    processPhosphorMessage Map.js:266
    processMessage widget.js:666
    invokeHandler index.js:433
    sendMessage index.js:169
    runMessageLoop index.js:483
index.js:380
TypeError: L is undefined[Learn More] leaflet.draw.js:9:7373

[drwelby]

@Kirill888 good debugging work and I like your solution.