Closed Bug 1686606 Opened 7 months ago Closed 7 months ago

The new non-native widget theme doesn't have any padding between blinking cursor & border, in a textfield / textarea

Categories

(Core :: Widget, defect)

defect

Tracking

()

RESOLVED FIXED
86 Branch
Fission Milestone M7
Tracking Status
firefox86 --- fixed

People

(Reporter: dholbert, Assigned: emilio)

References

Details

Attachments

(4 files, 1 obsolete file)

STR:

  1. Run Firefox with about:config widget.disable-native-theme-for-content set to true.
  2. View attached testcase (just a textarea and a textfield)
  3. Focus either of the form controls in the testcase.

ACTUAL RESULTS:
The blinking cursor is flush with (or maybe even overlaps?) the top and bottom border of the text field. This makes it look a bit misaligned / overflowing.

EXPECTED RESULTS:
There should be a little bit of blank padding-area between the blinking cursor and the border, to visually separate them.

Attached file testcase 1

ni=spohl to weigh in on this (e.g. maybe my expectations don't match our design-spec on this, not sure)

Note: these elements seem to have 1px of padding on the top and bottom and 4px of padding on the sides (via a UA stylesheet). If I instead restyle them to use 2px of padding on the top and bottom, then that essentially fixes this; it gives enough visual separation between the cursor and the border.

Flags: needinfo?(spohl.mozilla.bugs)
Summary: The new non-native theme doesn't have any padding between blinking cursor & border, in a textfield / textarea → The new non-native widget theme doesn't have any padding between blinking cursor & border, in a textfield / textarea

(tangent: while playing around with padding, I noticed another issue & filed it as bug 1686613)

Fission Milestone: --- → M8

Tracking non-native theming bugs for Fission Beta milestone (M7).

Fission Milestone: M8 → M7
Assignee: nobody → spohl.mozilla.bugs
Status: NEW → ASSIGNED
Flags: needinfo?(spohl.mozilla.bugs)

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

ni=spohl to weigh in on this (e.g. maybe my expectations don't match our design-spec on this, not sure)

It is true that this doesn't match our design-spec, but we should adjust this when necessary. This bug certainly warrants another look. I have posted a patch that increases the top and bottom padding to 2px as suggested.

Outline should by default start outside of the border area, not inside.

Then we can use negative outline offsets to cover the border if we want
to.

Attachment #9198191 - Attachment is obsolete: true
Pushed by ealvarez@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/b0a2058c17a8
Fix outline painting in the non-native theme. r=spohl,mstange
Assignee: spohl.mozilla.bugs → emilio
Status: ASSIGNED → RESOLVED
Closed: 7 months ago
Resolution: --- → FIXED
Target Milestone: --- → 86 Branch

Hmm, it looks like this is fixed for <input> (yay!) but not for <textarea> -- the cursor is still flush with the top of the textarea for me, in the attached testcase (it looks like the screenshot in comment 3).

I'll file a followup for that.

Flags: needinfo?(emilio)

(ni? just as an FYI, in case the fix was expected to catch textarea as well.)

Blocks: 1688325

(er, transfering needinfo to new bug. Sorry for spam.)

Flags: needinfo?(emilio)
You need to log in before you can comment on or make changes to this bug.