From 99696cb302535933babc8bbcc45343e08845bc77 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Mon, 17 Nov 2025 01:08:22 +0100 Subject: [PATCH] Add aria-label to markers in admin map settings We forgot to do so in commit b896fc4bb. Back then, we said: > Note that we aren't providing a proper aria-label for markers on the > map we use in the form to create a proposal or an investment. Adding > one isn't trivial given the current code, and keyboard users can't add > a marker in the first place. We'll have to revisit this issue when we > add keyboard support for this. However, in the admin section, the marker is already there, so it should have a label. In this case, we're using the coordinates as label because it's the most relevant text for the marker in the context of a form. We could also use "Default map location" instead, but that information is already present on the page. Axe was reporting the same accessibility error we mentioned in commit b896fc4bb in this situation. --- .../shared/map_location_component.rb | 10 ++++- config/locales/en/general.yml | 1 + config/locales/es/general.yml | 1 + .../shared/map_location_component_spec.rb | 44 +++++++++++++++++++ spec/system/admin/settings_spec.rb | 3 ++ 5 files changed, 58 insertions(+), 1 deletion(-) diff --git a/app/components/shared/map_location_component.rb b/app/components/shared/map_location_component.rb index 05c06dac7..bd59e52db 100644 --- a/app/components/shared/map_location_component.rb +++ b/app/components/shared/map_location_component.rb @@ -62,12 +62,20 @@ class Shared::MapLocationComponent < ApplicationComponent marker_investments_coordinates: investments_coordinates, marker_latitude: map_location.latitude.presence, marker_longitude: map_location.longitude.presence, - marker_title: map_location.title.presence, + marker_title: map_location.title.presence || marker_coordinates_text, marker_clustering: feature?("map.feature.marker_clustering"), geozones: geozones_data }.merge(input_selectors) end + def marker_coordinates_text + return unless map_location.available? + + t("proposals.form.map_marker_coordinates", + latitude: map_location.latitude, + longitude: map_location.longitude) + end + def input_selectors if form { diff --git a/config/locales/en/general.yml b/config/locales/en/general.yml index 269452fb7..b54745690 100644 --- a/config/locales/en/general.yml +++ b/config/locales/en/general.yml @@ -328,6 +328,7 @@ en: tags_placeholder: "Enter the tags you would like to use, separated by commas (',')" map_location: "Map location" map_location_instructions: "Navigate the map to the location and place the marker." + map_marker_coordinates: "Latitude: %{latitude}. Longitude: %{longitude}" map_remove_marker: "Remove map marker" index: featured_proposals: Featured diff --git a/config/locales/es/general.yml b/config/locales/es/general.yml index 9bcb5566a..514378598 100644 --- a/config/locales/es/general.yml +++ b/config/locales/es/general.yml @@ -328,6 +328,7 @@ es: tags_placeholder: "Escribe las etiquetas que desees separadas por coma (',')" map_location: "Ubicación en el mapa" map_location_instructions: "Navega por el mapa hasta la ubicación y coloca el marcador." + map_marker_coordinates: "Latitud: %{latitude}. Longitud: %{longitude}" map_remove_marker: "Eliminar el marcador" index: featured_proposals: Destacadas diff --git a/spec/components/shared/map_location_component_spec.rb b/spec/components/shared/map_location_component_spec.rb index efd71028b..be8b045ba 100644 --- a/spec/components/shared/map_location_component_spec.rb +++ b/spec/components/shared/map_location_component_spec.rb @@ -28,4 +28,48 @@ describe Shared::MapLocationComponent do expect(page).to have_button "Remove map marker" end end + + describe "marker title" do + it "uses the mappable title when there's a mappable with a title" do + map_location = build( + :map_location, + proposal: Proposal.new(title: "Meet me here"), + latitude: "25.25", + longitude: "13.14" + ) + + render_inline Shared::MapLocationComponent.new(map_location) + + expect(page).to have_css "[data-marker-title='Meet me here']" + end + + it "uses the coordinates when there's no mappable" do + map_location = build(:map_location, latitude: "25.25", longitude: "13.14") + + render_inline Shared::MapLocationComponent.new(map_location) + + expect(page).to have_css "[data-marker-title='Latitude: 25.25. Longitude: 13.14']" + end + + it "uses the coordinates when the mappable has an empty title" do + map_location = build( + :map_location, + proposal: Proposal.new(title: ""), + latitude: "25.25", + longitude: "13.14" + ) + + render_inline Shared::MapLocationComponent.new(map_location) + + expect(page).to have_css "[data-marker-title='Latitude: 25.25. Longitude: 13.14']" + end + + it "is not present when the map location isn't available" do + map_location = build(:map_location, latitude: "25.25", longitude: nil) + + render_inline Shared::MapLocationComponent.new(map_location) + + expect(page).not_to have_css "[data-marker-title]" + end + end end diff --git a/spec/system/admin/settings_spec.rb b/spec/system/admin/settings_spec.rb index 68f6c3ba5..5917591e6 100644 --- a/spec/system/admin/settings_spec.rb +++ b/spec/system/admin/settings_spec.rb @@ -60,6 +60,7 @@ describe "Admin settings", :admin do expect(page).to have_field "Latitude", with: "51.48" expect(page).to have_field "Longitude", with: "0.0" + expect(page).to have_css ".map-icon[aria-label='Latitude: 51.48. Longitude: 0.0']" within "#map-form" do find(".map-location").click @@ -68,7 +69,9 @@ describe "Admin settings", :admin do expect(page).to have_content "Map configuration updated successfully" expect(page).to have_field "Latitude" + expect(page).to have_css ".map-icon" expect(page).not_to have_field "Latitude", with: "51.48" + expect(page).not_to have_css ".map-icon[aria-label='Latitude: 51.48. Longitude: 0.0']" end end