Fix bug when loading geojson layers in notebook and update notebook t…

…est (#305)

* Assign IDs to features when creating

* Update notebook test

* Update Playwright Snapshots

* Upload geojson file in test

* Update Playwright Snapshots

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

packages/base/src/mainview/mainView.tsx

@@ -29,7 +29,7 @@ import {
 import { IObservableMap, ObservableMap } from '@jupyterlab/observables';
 import { User } from '@jupyterlab/services';
 import { JSONValue, UUID } from '@lumino/coreutils';
-import { Collection, MapBrowserEvent, Map as OlMap, View } from 'ol';
+import { Collection, MapBrowserEvent, Map as OlMap, View, getUid } from 'ol';
 import { ScaleLine } from 'ol/control';
 import { GeoJSON, MVT } from 'ol/format';
 import { DragAndDrop, Select } from 'ol/interaction';
@@ -489,6 +489,10 @@ export class MainView extends React.Component<IProps, IStates> {
 
         const featureCollection = new Collection(featureArray);
 
+        featureCollection.forEach(feature => {
+          feature.setId(getUid(feature));
+        });
+
         newSource = new VectorSource({
           features: featureCollection
         });

ui-tests/tests/notebook.spec.ts

@@ -2,6 +2,8 @@ import { expect, IJupyterLabPageFixture, test } from '@jupyterlab/galata';
 import * as path from 'path';
 const klaw = require('klaw-sync');
 
+const FILENAME = 'eq.json';
+
 const testCellOutputs = async (
   page: IJupyterLabPageFixture,
   tmpPath: string,
@@ -65,6 +67,10 @@ test.describe('Notebook API Visual Regression', () => {
       path.resolve(__dirname, './notebooks'),
       tmpPath
     );
+    await page.contents.uploadFile(
+      path.resolve(__dirname, `./gis-files/${FILENAME}`),
+      `/${tmpPath}/${FILENAME}`
+    );
     await page.filebrowser.openDirectory(tmpPath);
   });
 

ui-tests/tests/notebooks/Notebook.ipynb

@@ -28,7 +28,7 @@
    "metadata": {},
    "outputs": [],
    "source": [
-    "doc = GISDocument(latitude=40.775, longitude=-73.973, zoom=13)\n",
+    "doc = GISDocument(latitude=20.718, longitude=129.940, zoom=4)\n",
     "\n",
     "doc.add_raster_layer(\n",
     "    url=\"https://tile.openstreetmap.org/{z}/{x}/{y}.png\",\n",
@@ -46,7 +46,7 @@
    "metadata": {},
    "outputs": [],
    "source": [
-    "doc = GISDocument(latitude=40.775, longitude=-73.973, zoom=13)\n",
+    "doc = GISDocument(latitude=20.718, longitude=129.940, zoom=4)\n",
     "\n",
     "doc.add_raster_layer(\n",
     "    url=\"https://tile.openstreetmap.org/{z}/{x}/{y}.png\",\n",
@@ -55,12 +55,7 @@
     "    opacity=0.6,\n",
     ")\n",
     "\n",
-    "doc.add_vectortile_layer(\n",
-    "    url=\"https://planetarycomputer.microsoft.com/api/data/v1/vector/collections/ms-buildings/tilesets/global-footprints/tiles/{z}/{x}/{y}\",\n",
-    "    source_layer=\"bingmlbuildings\",\n",
-    "    max_zoom=13,\n",
-    "    min_zoom=13,\n",
-    ")\n",
+    "doc.add_geojson_layer(path=\"./eq.json\")\n",
     "\n",
     "doc"
    ]
@@ -82,7 +77,7 @@
    "name": "python",
    "nbconvert_exporter": "python",
    "pygments_lexer": "ipython3",
-   "version": "3.12.4"
+   "version": "3.12.8"
   }
  },
  "nbformat": 4,