Closed Bug 1885742 Opened 2 years ago Closed 2 years ago

object focus ring only in firefox, cannot be disabled while keeping internal svg anchor tabstops

Categories

(Core :: SVG, defect)

Firefox 123
Desktop
Windows 11
defect

Tracking

()

RESOLVED DUPLICATE of bug 1483828

People

(Reporter: eyalgruss, Unassigned)

Details

Attachments

(2 files)

i have an <object> element with external svg. the svg contains <a> elements.
in firefox as opposed to chromium the object gets a focus ring when tabbing by default.
when i try to remove this by setting tabindex="-1" on the object, the internal <a> lose their default tabstops.
see here: https://oulipoh.com/resen/seasons

Can't you use https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible to set the outline to something that doesn't display?

Flags: needinfo?(eyalgruss)

i guess that would be a worse ux, as you still get the tab stop, but without any indication where the focus is

Flags: needinfo?(eyalgruss)

I'm really unclear as to what the problem you're reporting is then. Can you create a really really simple testcase please?

i am reporting the issue that you cannot both disable the object focus ring and have the internal anchors as tab stops. the url given shows the focus ring. if you add tabindex="-1" on the object you will lose the anchor tab stops.

Summary: object focus ring only in firefix, cannot be disabled while keeping internal svg anchor tabstops → object focus ring only in firefox, cannot be disabled while keeping internal svg anchor tabstops

I explained how to disable the object focus ring and you said that wasn't what you wanted. Hence I don't know what you want.

What would help (I think) is a much simpler i.e. minimal testcase (say 10 lines for the SVG and another 10 for the host HTML file), together with steps to demonstrate the issue i.e. press tab <z> times and see <x>, I want to see <y> instead.

sure!
demo: https://eyalgruss.com/share/bug1885742.html

code:

bug1885742.html

<!DOCTYPE html>
<html lang="en">
  <body>
    <h2>A tab-able object with tab-able anchors:</h2>
    <object data="bug1885742.svg"></object>
    
    <h2>A non-tab-able object with non-tab-able anchors:</h2>
    <object tabindex="-1" data="bug1885742.svg"></object>
  </body>
</html>

bug1885742.svg

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 100">
  <a href="#"><text x="10" y="30">try to tab to me!</text></a>
</svg>

I can reproduce in builds from a month or so ago, but not in current Nightly -- current Nightly matches Chrome and never draws a focus outline around the object.

mozregression suggests this was fixed by bug 1483828.

Status: NEW → RESOLVED
Closed: 2 years ago
Duplicate of bug: 1483828
Resolution: --- → DUPLICATE
Attachment #9391639 - Attachment description: reporter's testcase → svg resource used in reporter's testcase
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: