Closed Bug 1699800 Opened 4 months ago Closed 4 months ago

non-native form fields' focus-outlines are in overflow area (and get clipped if the widget is right at the edge of an iframe or overflow:hidden element).

Categories

(Core :: Widget, defect, P3)

defect

Tracking

()

RESOLVED WONTFIX
Tracking Status
firefox-esr78 --- disabled
firefox86 --- disabled
firefox87 --- disabled
firefox88 --- disabled
firefox89 --- affected

People

(Reporter: dholbert, Unassigned)

References

Details

(Whiteboard: [not-a-fission-bug])

Attachments

(4 files)

Attached file testcase 1

STR:

  1. Ensure you have widget.non-native-theme.enabled set to true in about:config.
  2. View attached testcase, which is just:
data:text/html,<!DOCTYPE html><div style="overflow:hidden; height: 100px"><input autofocus>
  1. If the input field isn't already focused (it should be), then click it to focus it.

ACTUAL RESULTS: There's a focus ring around the textfield, which is entirely clipped on the top and the left. So you just see a backwards-L-shaped "halo" around the field (with an outline on the right side and bottom side).

EXPECTED RESULTS: Consistent-looking appearance of focus styling.

I actually ran into this on MDN, which runs into this with an iframe rather than an overflow:hidden div. The page I encountered it there was https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation , with the "ZIP"/"Country" example about halfway down the page. If you focus the "ZIP" formfield, you'll run into this issue.

(This might be a dupe -- I feel like I've seen this issue discussed somewhere -- but I couldn't immediately find an existing bug, so I went ahead and filed.)

Attached image Safari screenshot.

That's how outlines work, isn't it? We could make the outline smaller, but other than that this is wontfix I fear.

(Or maybe paint the outline 1px more into the field / button / etc)

Right, this is how outlines work... It's a question of how we want to use outlines for these widgets, really.

Thanks for the Safari screenshot - I hadn't realized they had widgets whose focus indicators were similarly susceptible to clipping. Maybe that means this will be reasonably web-compatible and this is wontfix, then.

Severity: -- → S3
Priority: -- → P3

(In reply to Daniel Holbert [:dholbert] from comment #6)

Thanks for the Safari screenshot - I hadn't realized they had widgets whose focus indicators were similarly susceptible to clipping. Maybe that means this will be reasonably web-compatible and this is wontfix, then.

Adding [not-a-fission-bug] whiteboard tag because this bug doesn't need to block Fission MVP.

TBD whether this bug should be fixed or wontfixed.

Whiteboard: [not-a-fission-bug]

I think this is Wontfix, but let me know if you disagree. Maybe the example in mdn deserves a fix?

Status: NEW → RESOLVED
Closed: 4 months ago
Resolution: --- → WONTFIX

Yeah, that's fine. I don't immediately know how to edit demo-content on MDN, but it's not severe enough for me to worry too much about it.

You need to log in before you can comment on or make changes to this bug.