1277559 - Tab order issue using flexbox, flex order and absolutely-positioned child of flex

Status: RESOLVED DUPLICATE of bug 812687

(Core :: DOM: UI Events & Focus Handling, defect)

Description

[adam.syrek]

Attachment: test.html

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.11; rv:46.0) Gecko/20100101 Firefox/46.0
Build ID: 20160502172042

Steps to reproduce:

Create a container, set display to flex and position to relative. Place 3 focusable items inside the container, give them orders respectively 1, 2, 3. For second child (order: 2) set position to absolute. 

See attached HTML.


Actual results:

Absolutely positioned element is first in tab order for the container; tab order is 2 -> 1 -> 3.


Expected results:

Absolutely positioned element should be second in tab order; tab order should be 1 -> 2 -> 3. Tab order is correctly maintained in Chrome, IE10 and Edge, problem exists only in FF.

Comment 1

[ovidiu boca[:Ovidiu]]

Hi Adam,

I tested this issue on Mac OS X 10.10 with FF 46.0.1, FF Nightly 49.0a1 and Chrome, all the results are the same, the order is this: 1->3->2. I can't reproduce it. 

Please download the Firefox Nightly from here: https://nightly.mozilla.org/ and retest the problem.
Please test if the issue can be reproduced in the safe mode of Firefox: https://support.mozilla.org/en-US/kb/troubleshoot-firefox-issues-using-safe-mode

Comment 2

[adam.syrek]

(In reply to ovidiu boca[:Ovidiu] from comment #1)
> Hi Adam,
> 
> I tested this issue on Mac OS X 10.10 with FF 46.0.1, FF Nightly 49.0a1 and
> Chrome, all the results are the same, the order is this: 1->3->2. I can't
> reproduce it. 
> 
> Please download the Firefox Nightly from here: https://nightly.mozilla.org/
> and retest the problem.
> Please test if the issue can be reproduced in the safe mode of Firefox:
> https://support.mozilla.org/en-US/kb/troubleshoot-firefox-issues-using-safe-
> mode

Hello,

I'm not sure if I explained myself clearly - I'm talking about tabbing order, like when you go through focusable elements using the "Tab" key, not about how the elements appear visually on screen.

In the file I have attached earlier focus on FF when tabbing through the page goes first on button labelled "Second", then "First", then "Third" whereas it should be "First" -> "Second" -> "Third" for two reasons - firstly that's the element order in DOM and secondly, that's the flex order.

Tried 46.0.1 in safe mode and latest FF Nightly 50.0a1 - same issue.

Comment 3

[ovidiu boca[:Ovidiu]]

Hi Adam,

I tested on Mac OS X 10.10 and I can reproduce it with FF Nightly 50.0a1 and FF 46.0.1. Thanks for clearing it out.

Comment 4

[Andrew Overholt [:overholt]]

dholbert, do you know what we should do here?

Comment 5

[Daniel Holbert [:dholbert]]

This is bug 812687, which I just need to fix. (It's sat for a long time, in part because the spec situation was unclear for a while -- there was a proposal from some IBM accessibility folks to change the spec to match what we were doing -- and in part because I've been focused on other projects.)

Web developers have been asking for this to be fixed via multiple venues, and I should be getting to it soon.