Add support data for vertical form controls via writing-mode

[chrisdavidmills]

Summary

Chrome has added support for vertical form controls; see https://developer.chrome.com/blog/vertical-form-controls for some more details. Specifically:

• Vertical Selects/buttons released in 119
• Vertical textareas/text-based inputs in 121
• Vertical progress/meter/input type range in 124

Currently the latter is available in a Finch experiment, enabled 50% on Canary only. To make sure it is available on mac on Mac, you can start Canary by passing the feature:
/Applications/"Google Chrome Canary.app"/Contents/MacOS/"Google Chrome Canary" --enable-features=FormControlsVerticalWritingModeDirectionSupport

This is done by setting writing-mode to vertical-lr or vertical-rl

The blog post only talks about <input type="text">, but I also went through every other text-based input type and tested them all.

I also tested them all in Fx and Safari, and found that many of them work in those browsers too. I found it difficult to pinpoint exactly what browser versions include support for those, so:

• I resorted to just saying true for Fx/Saf support in HTML elements
• I filled in arbitrary values for Fx/Saf support in CSS properties, as you're not allowed to put true for CSS ;-)

Any advice on tracking down more specific values for those would be appreciated. I have already reached out to folks at Fx that I know.

Test results and supporting details

Related issues

[github-actions]

This pull request has merge conflicts that must be resolved before it can be merged.

[github-actions]

This pull request has merge conflicts that must be resolved before it can be merged.

[Elchi3]

Thanks for you PR!

I wonder if it is really needed to add vertical_orientation to every element here. I think I'm leaning towards no.
What you use as a note there "Vertical orientation available via the writing-mode property (see Creating vertical controls)." is not really a compatibility note. It describes/documents that you can use the writing-mode property to do a thing. If we would document all the effects any CSS property has on HTML elements, then we would write a lot of notes on HTML element compat data... Also, the direction property apparently also controls some vertical stuff? That one you didn't mention in e.g. progress.json either...

I think on MDN there should be a note from all these elements to writing-mode (maybe in see also) to say that these can be vertical using that CSS property. The reader can then learn about writing-mode and will find the compat data on that page, too.

So, the most important part of this PR is vertical_oriented_form_controls in the writing-modes.json compat data. I made suggestions so that always includes what was already supported in earlier versions but otherwise this entry is exactly what we need here, IMO.

[chrisdavidmills]

Cheers for the review @Elchi3! Yes, I agree with you that it would be better to have this support data just on the CSS pages rather than on the pages for all HTML elements affected. I just wasn't sure of the best way to do that.

So, I've removed all the HTML page data, except for the range input data, with has some extra historical context on it beyond the writing-mode usage.

I've also made a few small updates to the writing-mode data, changing "text inputs" to "textual inputs", as all textual input types are supported, not just input type="text".

OK, now I'll get on and add those "See also" links to all the affected element pages, back over in the content PR!

[Elchi3]

Thanks Chris! Two more nits on the descriptions which I will apply and then merge this.