1452646 - while clicking and navigating back, an outline is drawn

Status: NEW

(Core :: Web Painting, defect, P3)

Description

[Karl Dubost💡 :karlcow]

This is a spin-off of https://webcompat.com/issues/11540

1. Go to http://www.mcdonaldsindia.net/
2. Click on North & East India
3. Click back (firefox navigation bar)

Expected:
Same initial design

Actual:
A white outline appears on the left side.


https://webcompat.com/uploads/2017/10/6a3df9e8-ea65-4653-8a3e-0fbe1a8d3d30.jpg

Comment 1

[Cameron McCormack (:heycam)]

Attachment: focus ring with off screen children

I didn't check but this is probably due to an element within an <a> that is positioned off screen, as is often done for text that should be exposed to AT users but not to sighted users.

See how this test shows a large outline encompassing the <span class=offscreen> in Firefox, while in Chrome this doesn't contribute to the size of the outline.

Comment 2

[Cameron McCormack (:heycam)]

(In reply to Cameron McCormack (:heycam) from comment #1)
> I didn't check but this is probably due to an element within an <a> that is
> positioned off screen, as is often done for text that should be exposed to
> AT users but not to sighted users.

That is essentially the issue here, though the page is achieving the effect by putting text-indent:-10000px on the <a>, so that its text content is not visible.

Comment 3

[Firefox Bug Husbandry Bot]

Migrating Webcompat whiteboard priorities to project flags. See bug 1547409.

Comment 4

[Firefox Bug Husbandry Bot]

See bug 1547409. Migrating whiteboard priority tags to program flags.