Add support for CSS reading-flow

[dizhang168]

The CSSWG resolved to add the new CSS property reading-flow: (w3c/csswg-drafts#7387, spec). Chrome has been working on a prototype for how to change the sequential focus navigation order within a container that has reading-flow.
This PR specs the new CSS property reading-flow per proposal described at #10407.

• At least two implementers are interested (and none opposed):
  • Chrome
  • Gecko: CSS reading-flow mozilla/standards-positions#1056
  • WebKit: CSS reading-flow WebKit/standards-positions#378
• Tests are written and can be reviewed and commented upon at:
  • wpt/focus-navigation/reading-flow/tentative
• Implementation bugs are filed:
  • Chromium: https://issues.chromium.org/issues/40932006
  • Gecko: TBA
  • WebKit: TBA
• MDN issue is filed: …
• The top of this comment includes a clear commit message to use.

(See WHATWG Working Mode: Changes for more details.)

---

/index.html ( diff )
/infrastructure.html ( diff )
/interaction.html ( diff )

[domfarolino]

By the way, in the OP you have "At least two implementers are interested (and none opposed):" checked, but neither of the two linked standards positions have been resolved yet, so I'd uncheck that unless you you have other cross-browser support to point to.

[dizhang168]

Thanks for the first pass!

By the way, in the OP you have "At least two implementers are interested (and none opposed):" checked, but neither of the two linked standards positions have been resolved yet, so I'd uncheck that unless you you have other cross-browser support to point to.

Thanks for the call out. There has been conversation in meetings and implementers from non-chromium browsers are interested and none opposed. But I will wait for their comments on the official position issues before checking the checkbox.

[dizhang168]

Status update: I have addressed all the formatting comments. @domfarolino and other reviewers proposed more suggestions and changes at TPAC 2024. I will go back to working on the proposal before making more changes to this spec PR.

[annevk]

Thank you for writing this! It looks quite clear. One thing I'm missing from the surrounding discussion we had are the examples. I thought those would be added to the specification in some fashion.

[fantasai]

The HTML spec shouldn't be written in a way that depends on specific CSS properties, because these can change--we shouldn't need to change the HTML spec to change how CSS calculates the reading order.

HTML should use a generic concept of a "rendering-defined sibling reading order" or something like that, which both specs can refer to. Then CSS can say how that order is calculated, and HTML can say how it interacts with HTML features and algorithms.

There have been multiple different proposals for how CSS calculates reading order, only some of which depend on values of reading-flow. For example, we have discussed a property on the items (reading-order), a property on the container (reading-flow), a variety of different types of values for each, and the possibility of even changing behavior for effects like dense packing to perform layout-based reordering by default (no specific property). All of this is out of scope for the HTML spec, and shouldn't be locked down into it as if it were the defining spec for these features.

[dizhang168]

Thanks for the feedback. I will update this spec to remove any specific CSS properties and instead refer to CSS Display 4 for rendering-defined sibling reading order and reading flow container.

Next, I will refactor this PR accordingly to have only the reading flow order in the context of a focus navigation scope and illustrate the steps with a detailed example.

[dizhang168]

I have updated the PR with a thorough example for the reading flow order algorithm without referring directly to any 'reading-flow' property. Would appreciate your review, thanks.
@domfarolino @annevk @emilio

Note: I am working with @rachelandrew to update the definitions in css-display-4.