Update Chromium data for CSS visibility: collapse

[joswhite]

Summary

As described in #24185, Chrome compatibility data for visibility: collapse; needs to be updated. Previously, it did not work properly for several table elements, now it does.

Note: we should consider also updating this for other browsers, including Edge, which will need a note that in Edge 79-91 it exhibited the same issues as Chrome 79-91.

Test results and supporting details

See #24185. I tested on BrowserStack in Chrome versions 61, 62, 90, 91, 92, 95, and 104.

Chromium issue tracker - Status is "Fixed" - see comment 66 on May 21, 2021.

[github-actions]

Tip: Review these changes grouped by change (recommended for most PRs), or grouped by feature (for large PRs).

[caugner]

Thank you, this goes in the right direction.

1. I added two review comments below.
2. To update the Opera and Opera Android data:
   • Opera 49 corresponds to Chrome 62.
   • Opera 78 corresponds to Chrome 92
   • Opera Android 46 corresponds to Chrome 63 (and Chrome 62 was skipped)
   • Opera Android 65 corresponds to Chrome 92.

PS: Ideally, we should extract a subfeature table_elements (see this comment), and consider browsers treating visibility: collapse like hidden as partial_implementation (adding a separate support statement if they used to do this, but meanwhile fully support), but we can keep the scope of this PR small by updating/improving the notes, as long as we're consistent across browsers.

Edit: Another subfeature for ruby_annotations pointing to this spec would make sense.

[joswhite]

   * Opera Android 64 corresponds to Chrome 63 (and Chrome 62 was skipped)

Awesome thanks! I think you mean Opera Android 46 corresponds to Chrome 63 correct?

[joswhite]

I'm trying to figure out how to word this so we properly convey what is and what is not supported. From the MDN page, I see:

Based on this information, we know visibility: collapse; is expected to be the same as hidden, except for flex items, ruby annotations, and table elements. How does something like this sound, for describing Chrome's support?

"Before Chrome 62, `visibility: collapse` has the same effect as `hidden`, leaving a blank gap.",
"Before Chrome 92, `visibility: collapse` supports `<tr>`,`<thead>`, `<tbody>`, and `<tfoot>` elements, but for
`<col>` and `<colgroup>` elements, flex items, and ruby annotations, it has the same effect as `hidden`, leaving
a blank gap.",
"Since Chrome 92, `visibility: collapse` also supports `<col>` and `<colgroup>` elements."

[caugner]

@joswhite Thank you. For now, could we keep the notes verbose to avoid ambiguity?

"Before Chrome 62, `visibility: collapse` has the same effect as `hidden` for all elements, leaving a blank gap.",
"Before Chrome 92, `visibility: collapse` supports `<tr>`,`<thead>`, `<tbody>`, and `<tfoot>` elements. For
`<col>` and `<colgroup>` elements, flex items, and ruby annotations, it has the same effect as `hidden`, leaving
a blank gap.",
"Since Chrome 92, `visibility: collapse` supports `<tr>`,`<thead>`, `<tbody>`, `<tfoot>`, `<col>` and `<colgroup>` elements. For flex items, and ruby annotations, it has the same effect as `hidden`, leaving a blank gap."

That last note may not be 100% accurate (regarding flex items), but I think it will be easier to fix that way.

PS: As for Ruby annotations, I just tested this example from the CSS Ruby Annotation spec in Chrome 135, and visibility: collapse and visibility: hidden have the same effect.

Ruby example

1. Go to https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/ruby#try_it

2. Copy in the following HTML and CSS:

   <ruby><rb>昆</rb><rb>虫</rb><rb>記</rb><rt>こん</rt><rt class=easy>ちゅう</rt><rt>き</rt></ruby>

   ruby {
     font-size: 2em;
   }
   .easy {
     visibility: collapse;
     /* visibility: hidden; */
   }

[joswhite]

Sounds good! I've updated the notes for Edge, Chrome, Opera, and Opera Android. Does this look good?

[github-actions]

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

[joswhite]

I just updated the PR to clarify that visibility: collapse has no effect on <col> and <colgroup> elements before Chrome 92 (and corresponding versions of like browsers). I've responded to all the feedback as well. @caugner can you take another look?

[caugner]

Thank you, LGTM! 🎉

[joswhite]

Great thanks!!