Picto field: fix clicking on preview to open the form

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

@@ -535,6 +535,7 @@ L.FormBuilder.IconUrl = L.FormBuilder.BlurInput.extend({
 
   onDefine: function () {
     this.buttons.innerHTML = ''
+    this.footer.innerHTML = ''
     this.buildTabs()
     const value = this.value()
     if (!value || value.startsWith('/')) this.showSymbolsTab()
@@ -556,6 +557,7 @@ L.FormBuilder.IconUrl = L.FormBuilder.BlurInput.extend({
   },
 
   buildTabs: function () {
+    this.tabs.innerHTML = ''
     const symbol = L.DomUtil.add(
         'button',
         'flat tab-symbols',
@@ -613,22 +615,14 @@ L.FormBuilder.IconUrl = L.FormBuilder.BlurInput.extend({
     if (this.isDefault()) return
     if (!L.Util.hasVar(this.value())) {
       // Do not try to render URL with variables
+      const box = L.DomUtil.create('div', 'umap-pictogram-choice', this.buttons)
+      L.DomEvent.on(box, 'click', this.onDefine, this)
       if (this.isImg()) {
-        const img = L.DomUtil.create(
-          'img',
-          '',
-          L.DomUtil.create('div', 'umap-pictogram-choice', this.buttons)
-        )
+        const img = L.DomUtil.create('img', '', box)
         img.src = this.value()
-        L.DomEvent.on(img, 'click', this.showSymbolsTab, this)
       } else {
-        const el = L.DomUtil.create(
-          'span',
-          '',
-          L.DomUtil.create('div', 'umap-pictogram-choice', this.buttons)
-        )
+        const el = L.DomUtil.create('span', '', box)
         el.textContent = this.value()
-        L.DomEvent.on(el, 'click', this.showSymbolsTab, this)
       }
     }
     this.button = L.DomUtil.createButton(

umap/static/umap/map.css

@@ -1269,6 +1269,7 @@ a.add-datalayer:hover,
     vertical-align: middle;
     color: white;
     font-weight: bold;
+    font-size: 1.2rem;
 }
 .umap-circle-icon {
     border: 1px solid white;

umap/tests/integration/test_picto.py

@@ -210,8 +210,8 @@ def test_can_use_char_as_picto(map, live_server, page, pictos):
     close.click()
     edit_settings.click()
     shape_settings.click()
-    modify = page.locator(".umap-field-iconUrl").get_by_text("Change")
-    expect(modify).to_be_visible()
-    modify.click()
+    preview = page.locator(".umap-pictogram-choice")
+    expect(preview).to_be_visible()
+    preview.click()
     # Should be on URL tab
     expect(input_el).to_be_visible()