fix: non loaded layers should still be visible in legend and data browser

Also rework the browsable/browse methods to try to make them more
understandable…

fix #1554

umap/static/umap/js/umap.forms.js

@@ -405,7 +405,7 @@ L.FormBuilder.DataLayerSwitcher = L.FormBuilder.Select.extend({
       if (
         datalayer.isLoaded() &&
         !datalayer.isDataReadOnly() &&
-        datalayer.canBrowse()
+        datalayer.isBrowsable()
       ) {
         options.push([L.stamp(datalayer), datalayer.getName()])
       }

umap/static/umap/js/umap.js

@@ -1189,13 +1189,13 @@ L.U.Map.include({
     if (
       datalayer &&
       !datalayer.isDataReadOnly() &&
-      datalayer.canBrowse() &&
+      datalayer.isBrowsable() &&
       datalayer.isVisible()
     ) {
       return datalayer
     }
     datalayer = this.findDataLayer((datalayer) => {
-      if (!datalayer.isDataReadOnly() && datalayer.canBrowse()) {
+      if (!datalayer.isDataReadOnly() && datalayer.isBrowsable()) {
         fallback = datalayer
         if (datalayer.isVisible()) return true
       }
@@ -1203,7 +1203,7 @@ L.U.Map.include({
     if (datalayer) return datalayer
     if (fallback) {
       // No datalayer visible, let's force one
-      this.addLayer(fallback.layer)
+      fallback.show()
       return fallback
     }
     return this.createDataLayer()

umap/static/umap/js/umap.layer.js

@@ -1,5 +1,5 @@
 L.U.Layer = {
-  canBrowse: true,
+  browsable: true,
 
   getType: function () {
     const proto = Object.getPrototypeOf(this)
@@ -138,7 +138,6 @@ L.U.Layer.Choropleth = L.FeatureGroup.extend({
     TYPE: 'Choropleth',
   },
   includes: [L.U.Layer],
-  canBrowse: true,
   // Have defaults that better suit the choropleth mode.
   defaults: {
     color: 'white',
@@ -345,7 +344,7 @@ L.U.Layer.Heat = L.HeatLayer.extend({
     TYPE: 'Heat',
   },
   includes: [L.U.Layer],
-  canBrowse: false,
+  browsable: false,
 
   initialize: function (datalayer) {
     this.datalayer = datalayer
@@ -664,7 +663,7 @@ L.U.DataLayer = L.Evented.extend({
   },
 
   eachFeature: function (method, context) {
-    if (this.layer && this.layer.canBrowse) {
+    if (this.isBrowsable()) {
       for (let i = 0; i < this._index.length; i++) {
         method.call(context || this, this._layers[this._index[i]])
       }
@@ -1458,8 +1457,22 @@ L.U.DataLayer = L.Evented.extend({
     if (bounds.isValid()) this.map.fitBounds(bounds)
   },
 
+  // Is this layer type browsable in theorie
+  isBrowsable: function () {
+    return this.layer && this.layer.browsable
+  },
+
+  // Is this layer browsable in theorie
+  // AND the user allows it
   allowBrowse: function () {
-    return !!this.options.browsable && this.canBrowse() && this.isVisible()
+    return !!this.options.browsable && this.isBrowsable()
+  },
+
+  // Is this layer browsable in theorie
+  // AND the user allows it
+  // AND it makes actually sense (is visible, it has data…)
+  canBrowse: function () {
+    return this.allowBrowse() && this.isVisible() && this.hasData()
   },
 
   count: function () {
@@ -1474,10 +1487,6 @@ L.U.DataLayer = L.Evented.extend({
     return this.layer && this.map.hasLayer(this.layer)
   },
 
-  canBrowse: function () {
-    return this.layer && this.layer.canBrowse
-  },
-
   getFeatureByIndex: function (index) {
     if (index === -1) index = this._index.length - 1
     const id = this._index[index]
@@ -1506,7 +1515,7 @@ L.U.DataLayer = L.Evented.extend({
     let next
     const index = this.map.datalayers_index
     while (((id = index[++id] ? id : 0), (next = index[id]))) {
-      if (next === this || (next.allowBrowse() && next.hasData())) break
+      if (next === this || next.canBrowse()) break
     }
     return next
   },
@@ -1516,7 +1525,7 @@ L.U.DataLayer = L.Evented.extend({
     let prev
     const index = this.map.datalayers_index
     while (((id = index[--id] ? id : index.length - 1), (prev = index[id]))) {
-      if (prev === this || (prev.allowBrowse() && prev.hasData())) break
+      if (prev === this || prev.canBrowse()) break
     }
     return prev
   },

umap/static/umap/js/umap.slideshow.js

@@ -65,7 +65,7 @@ L.U.Slideshow = L.Class.extend({
   },
 
   defaultDatalayer: function () {
-    return this.map.findDataLayer((d) => d.allowBrowse() && d.hasData())
+    return this.map.findDataLayer((d) => d.canBrowse())
   },
 
   timeSpinner: function () {

umap/tests/integration/test_browser.py

@@ -216,3 +216,15 @@ def test_should_redraw_list_on_feature_delete(live_server, map, page, bootstrap)
     expect(buttons).to_have_count(2)
     page.get_by_role("button", name="Cancel edits").click()
     expect(buttons).to_have_count(3)
+
+
+def test_should_show_header_for_display_on_load_false(
+    live_server, page, bootstrap, map, datalayer
+):
+    datalayer.settings["displayOnLoad"] = False
+    datalayer.settings["name"] = "This layer is not loaded"
+    datalayer.save()
+    page.goto(f"{live_server.url}{map.get_absolute_url()}")
+    browser = page.locator(".umap-browse-data")
+    expect(browser).to_be_visible()
+    expect(browser.get_by_text("This layer is not loaded")).to_be_visible()