Focus outline on map and query target indicator / cross-hairs

[prushforth]

@Malvoz I was looking at our mapml-viewer today while tabbing, and I noticed that there is no focus outline on the map when focused. Should we fix this?

Also, I set it up so that when you hit the spacebar with the map focused, you issue a query against the center of the map, if there is a query layer in effect. I was thinking we might reasonably add a cross-hair or some visible indicator of the query location before the query gets issued. The cross-hair would only show up when the map is focused, perhaps.

Any advice you have about making that facility more accessible would be appreciated.

[Malvoz]

I noticed that there is no focus outline on the map when focused.

Showing an outline on .leaflet-container on focus would be ideal, but Leaflet tends to do strange things with focus management in general, it produces an inconsistent or "flashing" outline when operating the zoom controls with a mouse pointer:

leaflet-container-focus-outline.mp4

A second problem is that some content inside the map such as the attribution container and the map graphics are overlapping the outline.

Should we fix this?

If we can, yes. It is still a failure of SC 2.4.7 Focus Visible even though we've fixed outlines for all the other focusable components.

Edit: One could argue that the issues described above shouldn't dissaude us from displaying a visible focus indicator. Should we just enable it?

[Malvoz]

Also, I set it up so that when you hit the spacebar with the map focused, you issue a query against the center of the map, if there is a query layer in effect. I was thinking we might reasonably add a cross-hair or some visible indicator of the query location before the query gets issued. The cross-hair would only show up when the map is focused, perhaps.

Any advice you have about making that facility more accessible would be appreciated.

Would such a query return any information to the user?

What does the visual indicator represent? The coordinates of the location? The Leaflet.MapCenterCoord plugin does something similar where it exposes the coordinates to the user. Maybe the coordinates could/should be announced when space is pressed? The visual display of the coordinates could be optional (opt-in/opt-out).

Another consideration is if it should have a control (whether default control and/or available from the context menu).

[ahmadayubi]

Could focus-within be used?

[Malvoz]

@ahmadayubi focus is still triggered the same way, producing the same behavior as :focus unfortunately. I also tested the relatively new :focus-visible which can be used to only show outlines when the user is using a keyboard, but it seems the UA heuristics determine a focus outline should be drawn anyway, supposedly due to programmatic focus.

[ahmadayubi]

Ah okay, I recently added the ability to focus vector features so I was thinking focus-within could be used to outline the map while the feature was focused as additional feedback to let the user know they are tabbing through the elements within the map.

[Malvoz]

Why isn't outline set to the vector feature directly in that case? That way the user would know which feature as focus. Is it because features outside the map view can be focused?

[ahmadayubi]

No the feature is outlined but it might be helpful to have both the feature focused outlined and the map outlined at the same time. Similar to how google maps outlines the entire map when you are navigating with keyboard and tabs.

[prushforth]

One could argue that the issues described above shouldn't dissuade us from displaying a visible focus indicator. Should we just enable it?

I think so. I asked Ahmad to put the cross-hair on when the map is focused. We can deal with the focus outline as a separate issue, since we may have to figure out how to make it work better than is currently possible, it seems.

Would such a query return any information to the user?

It depends on how the service is set up. In principle, I think the experience with server-generated responses should be indistinguishable from client interaction with features in most respects. For example, I've set up GeoServer to respond with a (single) <feature> element for such queries. I've limited the scope of querying to the top-most queryable at this time, so that the result isn't too confusing (I find this functionality to be potentially confusing in general, but pretty standard GIS / Web map behavior, FWIW).

What does the visual indicator represent? The coordinates of the location?

It represents the center of the map, but more specifically it represents the location that will be used in the query when you touch the spacebar. When you use a mouse or touch screen, you can control where you touch on the map, and thus where the query lands; when using the keyboard to control the map you don't have a general way to point, except to center the map on the location which you want to interact with. By rendering the center of the map as a cross-hair, you can have an idea of where you're going to query.

Maybe the coordinates could/should be announced when space is pressed?

I don't think it's worth reading out the coordinates because they are fairly meaningless to people.

The visual display of the coordinates could be optional (opt-in/opt-out).

OTOH, it might be worthwhile ensuring that the debug menu coordinates display shows the coordinates of the center of the map when the map is focused (i.e. when the cross-hair is displayed).

Another consideration is if it should have a control (whether default control and/or available from the context menu).

Maybe. I think the cross-hairs are enough to signify when a query layer is available, but as you say there's no other visual indication when the map isn't focused. It might be worthwhile having a minimal visual cue that's present when there's either a query available or features available for focus??