Implement `visibility: hidden` in Layout 2020

[SimonSapin]

Relevant spec: https://drafts.csswg.org/css2/visufx.html#propdef-visibility

Relevant code: https://github.com/servo/servo/blob/master/components/layout_2020/display_list/mod.rs

Changes needed: when generating display items for a BoxFragment or TextFragment, check the value visibility property in its style or parent_style field respectively:

use style::properties::ComputedValues;
use style::properties::longhands::visibility::computed_value::T as Visibility;

fn display_items_are_visible(style: &ComputedValues) -> bool {
    let visible = match style.get_inherited_box().visibility {
        Visibility::Visible => true,
        Visibility::Hidden => false,

        // `visibility: collapse` is disabled at compile time
        // in `components/style/properties/longhands/inherited_box.mako.rs`
        // at the moment, so the variant doesn’t exist.
        // When it is enabled, this code should treat it like `hidden`
        // Visibility::Collapse => false,
    }
}

For non-visible fragments, skip emitting display items for backgrounds, borders, or text. Don’t inhibit rendering of descendant fragments: CSS inheritance already propagates the property to descendant elements, and they can override it to be visible again.

See https://github.com/servo/servo/wiki/Layout-2020#using for building with Layout 2020 enabled, to check that your changes compile.

[highfive]

Hi! If you have any questions regarding this issue, feel free to make a comment here, or ask it in the #servo channel in Matrix.

If you intend to work on this issue, then add @highfive: assign me to your comment, and I'll assign this to you. 😄

[SimonSapin]

        // `visibility: collapse` is disabled at compile time
        // in `components/style/properties/longhands/inherited_box.mako.rs`
        // at the moment, so the variant doesn’t exist.

In fact it should be enabled (and treated as hidden) even if we don’t implement flex item collapsing or table cell collapsing yet. So, additional steps needed:

In components/style/properties/longhands/inherited_box.mako.rs find the definition of the visibility property, remove its servo_2020_pref line, remove its extra_gecko_values line, and add collapse to its list of keyword values (the second argument to helpers.single_keyword, currently "visible hidden",).

---

… and, new tests will likely pass, so expected results will need to be updated. See https://github.com/servo/servo/wiki/Layout-2020#web-platform-tests for running web-platform-tests locally, but this may take a long time as there are very many tests. It may be easier to submit a pull request and do a "try" run on CI servers.

[MDeiml]

@highfive: assign me
I'd like to try this. Seems achievable.

[highfive]

Hey @MDeiml! Thanks for your interest in working on this issue. It's now assigned to you!