Bug 236710 - [content-visibility] Add support for css content-visibility: hidden
Summary: [content-visibility] Add support for css content-visibility: hidden
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: WebKit Local Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Rob Buis
URL:
Keywords: InRadar
Depends on: 245775 245776
Blocks: 236238
  Show dependency treegraph
 
Reported: 2022-02-16 09:23 PST by cathiechen
Modified: 2022-12-16 02:05 PST (History)
16 users (show)

See Also:


Attachments
Initial patch (38.42 KB, patch)
2022-02-28 09:38 PST, Rob Buis
no flags Details | Formatted Diff | Diff
Improved patch (39.19 KB, patch)
2022-03-01 06:29 PST, Rob Buis
no flags Details | Formatted Diff | Diff
Better ChangeLog. (39.90 KB, patch)
2022-03-02 06:43 PST, Rob Buis
no flags Details | Formatted Diff | Diff
Fix some more test expectations (41.39 KB, patch)
2022-03-02 08:54 PST, Rob Buis
no flags Details | Formatted Diff | Diff
Build fix (41.42 KB, patch)
2022-03-10 01:54 PST, Rob Buis
no flags Details | Formatted Diff | Diff
Improve top layers (41.96 KB, patch)
2022-03-16 04:06 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Improve top layer support (43.00 KB, patch)
2022-03-24 08:55 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Rebase and adjust containsLayout etc. (51.73 KB, patch)
2022-03-30 07:50 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Rebase (51.41 KB, patch)
2022-04-20 07:40 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Drop layoutPositionedObject change (51.52 KB, patch)
2022-04-22 02:31 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Rebase (51.60 KB, patch)
2022-04-27 03:04 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Rebase (51.05 KB, patch)
2022-05-05 01:49 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Fix r293943 regression (59.80 KB, patch)
2022-05-11 05:58 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Fix ChangeLog and Tim's comment (60.76 KB, patch)
2022-05-11 08:12 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Remove ChangeLogs (58.89 KB, patch)
2022-05-18 02:07 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
New approach to top layers (59.20 KB, patch)
2022-05-18 07:19 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Fix content-visibility-with-top-layer-003.tentative.html (59.53 KB, patch)
2022-05-19 09:20 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Adapt to https://bugs.webkit.org/show_bug.cgi?id=240906 (49.84 KB, patch)
2022-05-26 04:03 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Rebase (49.92 KB, patch)
2022-06-08 01:32 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (45.47 KB, patch)
2022-08-12 03:24 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (49.80 KB, patch)
2022-08-25 04:31 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (51.47 KB, patch)
2022-08-30 06:24 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (50.88 KB, patch)
2022-08-31 02:04 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (50.33 KB, patch)
2022-08-31 03:23 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (50.67 KB, patch)
2022-09-02 07:28 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (51.39 KB, patch)
2022-09-28 01:59 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (40.39 KB, patch)
2022-09-28 03:29 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (45.13 KB, patch)
2022-09-28 06:17 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (43.17 KB, patch)
2022-09-28 07:14 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (42.80 KB, patch)
2022-09-28 13:24 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (43.70 KB, patch)
2022-11-01 03:53 PDT, Rob Buis
no flags Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Comment 1 Radar WebKit Bug Importer 2022-02-23 09:24:31 PST
<rdar://problem/89360301>
Comment 2 Rob Buis 2022-02-28 09:38:10 PST
Created attachment 453398 [details]
Initial patch

Initial patch
Comment 3 Rob Buis 2022-03-01 06:29:29 PST
Created attachment 453495 [details]
Improved patch

This patch keeps track of c-v state even when there is no renderer created (display: none).
Comment 4 Rob Buis 2022-03-02 06:43:30 PST
Created attachment 453602 [details]
Better ChangeLog.

Better ChangeLog.
Comment 5 Rob Buis 2022-03-02 08:54:07 PST
Created attachment 453619 [details]
Fix some more test expectations

Fix some more test expectations
Comment 6 Rob Buis 2022-03-10 01:54:36 PST
Created attachment 454326 [details]
Build fix
Comment 7 Rob Buis 2022-03-16 04:06:28 PDT
Created attachment 454820 [details]
Improve top layers

Improve top layers
Comment 8 Rob Buis 2022-03-21 07:18:41 PDT
For some of the top level layer issues we probably need resolution here first:
https://github.com/w3c/csswg-drafts/issues/7163
Comment 9 Rob Buis 2022-03-24 08:55:31 PDT
Created attachment 455644 [details]
Improve top layer support

Improve top layer support
Comment 10 Emilio Cobos Álvarez (:emilio) 2022-03-24 11:41:00 PDT
Comment on attachment 455644 [details]
Improve top layer support

View in context: https://bugs.webkit.org/attachment.cgi?id=455644&action=review

> Source/WebCore/dom/Element.cpp:4806
> +        child.updateContentVisibilityData(shouldSkip, contentVisibility);

How do you update children on new DOM mutations? Also, shouldn't this use the composed / flattened tree?
Comment 11 Rob Buis 2022-03-30 01:51:41 PDT
Comment on attachment 455644 [details]
Improve top layer support

View in context: https://bugs.webkit.org/attachment.cgi?id=455644&action=review

>> Source/WebCore/dom/Element.cpp:4806
>> +        child.updateContentVisibilityData(shouldSkip, contentVisibility);
> 
> How do you update children on new DOM mutations? Also, shouldn't this use the composed / flattened tree?

What kind of new DOM mutations do you mean? I did some local tests (create whole c-v tree dynamically, just add a text node or element to the c-v subtree) and things seem to work with c-v: hidden. It is possible the state will not be updated (immediately) in such cases, but the painting will stop at a higher level so it should not cause rendering issues.

Having said that, feel free to share some tricky test scenarios :) I am sure more WPT tests here are welcome.
Comment 12 Rob Buis 2022-03-30 07:50:30 PDT
Created attachment 456123 [details]
Rebase and adjust containsLayout etc.

Rebase and adjust containsLayout etc.
Comment 13 Rob Buis 2022-04-20 07:40:17 PDT
Created attachment 457988 [details]
Rebase

Rebase.
Comment 14 Rob Buis 2022-04-22 02:31:38 PDT
Created attachment 458124 [details]
Drop layoutPositionedObject change

Drop layoutPositionedObject change
Comment 15 Rob Buis 2022-04-27 03:04:40 PDT
Created attachment 458435 [details]
Rebase

Rebase
Comment 16 Rob Buis 2022-05-05 01:49:54 PDT
Created attachment 458860 [details]
Rebase

Rebase
Comment 17 cathiechen 2022-05-09 08:49:59 PDT
Comment on attachment 458860 [details]
Rebase

View in context: https://bugs.webkit.org/attachment.cgi?id=458860&action=review

> Source/WebCore/dom/Element.cpp:3583
> +        return false;

It looks like we can remove this one, for `!isFocusableStyle(style)` already be true if `isSkippedContent() == ture`.
Comment 18 cathiechen 2022-05-10 01:58:58 PDT
Comment on attachment 458860 [details]
Rebase

View in context: https://bugs.webkit.org/attachment.cgi?id=458860&action=review

> Source/WebCore/dom/Element.cpp:4780
> +        shouldSkip |= parent->isSkippedContent();

Looks like we can move this out of the function, and call `updateContentVisibilityData(parent->isSkippedContent(), newContentVisibility)` instead of `updateContentVisibilityData(false, newContentVisibility)` in `Element::updateContentVisibility`
Comment 19 Tim Nguyen (:ntim) 2022-05-10 03:41:22 PDT
Comment on attachment 458860 [details]
Rebase

View in context: https://bugs.webkit.org/attachment.cgi?id=458860&action=review

> LayoutTests/imported/w3c/web-platform-tests/css/css-contain/content-visibility/content-visibility-with-top-layer-003.tentative.html:14
> +.hidden { ontent-visibility: hidden }

What is this change about?

> Source/WebCore/dom/Element.cpp:3405
> +    if (isSkippedContent())
> +        return;

This is kinda surprising to me, what bit of the spec says this?

> Source/WebCore/dom/Element.cpp:4820
> +void Element::updateDescendantTopLayerElements(ContentVisibility newContentVisibility)
> +{
> +    auto topLayers = document().topLayerElements();
> +    for (auto topLayerElement : topLayers) {
> +        for (auto* ancestor = topLayerElement.ptr(); ancestor; ancestor = ancestor->parentElementInComposedTree()) {
> +            if (ancestor == this) {
> +                if (newContentVisibility ==  ContentVisibility::Visible) {
> +                    if (!topLayerElement->isInTopLayer())
> +                        topLayerElement->addToTopLayer();
> +                } else if (newContentVisibility ==  ContentVisibility::Hidden) {
> +                    if (topLayerElement->isInTopLayer())
> +                        topLayerElement->removeFromTopLayer();
> +                }
> +                break;
> +            }
> +        }
> +    }
> +}

Not sure I'm understanding how this works? Is this trying to add/remove layers based on the node flag? 

I'm confused why the DOM side of the top layer logic should be touched here. Isn't this a layout feature?
Comment 20 Rob Buis 2022-05-10 04:04:59 PDT
Comment on attachment 458860 [details]
Rebase

View in context: https://bugs.webkit.org/attachment.cgi?id=458860&action=review

>> LayoutTests/imported/w3c/web-platform-tests/css/css-contain/content-visibility/content-visibility-with-top-layer-003.tentative.html:14
>> +.hidden { ontent-visibility: hidden }
> 
> What is this change about?

I wanted to try something local at the time, but clearly this change is unwanted indeed. Thanks for pointing that one out! Note that the patch is not up for review for a reason though :)

>> Source/WebCore/dom/Element.cpp:3405
>> +        return;
> 
> This is kinda surprising to me, what bit of the spec says this?

I think this is https://drafts.csswg.org/css-contain/#content-visibility 4.3.11.

>> Source/WebCore/dom/Element.cpp:4820
>> +}
> 
> Not sure I'm understanding how this works? Is this trying to add/remove layers based on the node flag? 
> 
> I'm confused why the DOM side of the top layer logic should be touched here. Isn't this a layout feature?

I am back to work on this tomorrow, will have a look then, this code is from quite some time ago.
Comment 21 Tim Nguyen (:ntim) 2022-05-10 12:25:14 PDT
(In reply to Rob Buis from comment #20)
> >> Source/WebCore/dom/Element.cpp:3405
> >> +        return;
> > 
> > This is kinda surprising to me, what bit of the spec says this?
> 
> I think this is https://drafts.csswg.org/css-contain/#content-visibility
> 4.3.11.
> 
> >> Source/WebCore/dom/Element.cpp:4820
> >> +}
> > 
> > Not sure I'm understanding how this works? Is this trying to add/remove layers based on the node flag? 
> > 
> > I'm confused why the DOM side of the top layer logic should be touched here. Isn't this a layout feature?
> 
> I am back to work on this tomorrow, will have a look then, this code is from
> quite some time ago.

Looking at step 4.3.11, we shouldn't touch the DOM side of things at all for the top layer. Doing this will cause the top layer z-order to change (e.g. when stacking multiple dialogs). I think you probably want more fine-grained code targeted towards the renderer/layers parts.
Comment 22 Rob Buis 2022-05-11 05:57:29 PDT
Comment on attachment 458860 [details]
Rebase

View in context: https://bugs.webkit.org/attachment.cgi?id=458860&action=review

>> Source/WebCore/dom/Element.cpp:3583
>> +        return false;
> 
> It looks like we can remove this one, for `!isFocusableStyle(style)` already be true if `isSkippedContent() == ture`.

Correct, will remove.
Comment 23 Rob Buis 2022-05-11 05:58:20 PDT
Created attachment 459160 [details]
Fix r293943 regression

Fix r293943 regression.
Comment 24 Rob Buis 2022-05-11 08:12:25 PDT
Created attachment 459167 [details]
Fix ChangeLog and Tim's comment
Comment 25 Rob Buis 2022-05-11 08:13:00 PDT
Comment on attachment 458860 [details]
Rebase

View in context: https://bugs.webkit.org/attachment.cgi?id=458860&action=review

>>> LayoutTests/imported/w3c/web-platform-tests/css/css-contain/content-visibility/content-visibility-with-top-layer-003.tentative.html:14
>>> +.hidden { ontent-visibility: hidden }
>> 
>> What is this change about?
> 
> I wanted to try something local at the time, but clearly this change is unwanted indeed. Thanks for pointing that one out! Note that the patch is not up for review for a reason though :)

I now removed the change, unfortunately we do not pass this test yet.
Comment 26 Rob Buis 2022-05-18 02:07:35 PDT
Created attachment 459532 [details]
Remove ChangeLogs

Remove ChangeLogs.
Comment 27 Rob Buis 2022-05-18 07:19:07 PDT
Created attachment 459541 [details]
New approach to top layers

New approach to top layers.
Comment 28 Rob Buis 2022-05-19 09:20:16 PDT
Created attachment 459592 [details]
Fix content-visibility-with-top-layer-003.tentative.html
Comment 29 Rob Buis 2022-05-26 04:03:07 PDT
Created attachment 459780 [details]
Adapt to https://bugs.webkit.org/show_bug.cgi?id=240906
Comment 30 Rob Buis 2022-06-08 01:32:30 PDT
Created attachment 460086 [details]
Rebase
Comment 31 Rob Buis 2022-08-12 03:24:13 PDT
Created attachment 461558 [details]
Patch
Comment 32 Rob Buis 2022-08-25 04:31:55 PDT
Created attachment 461856 [details]
Patch
Comment 33 Rob Buis 2022-08-30 06:24:44 PDT
Created attachment 462007 [details]
Patch
Comment 34 Rob Buis 2022-08-31 02:04:06 PDT
Created attachment 462026 [details]
Patch
Comment 35 Rob Buis 2022-08-31 03:23:57 PDT
Created attachment 462027 [details]
Patch
Comment 36 Rob Buis 2022-09-02 07:28:00 PDT
Created attachment 462095 [details]
Patch
Comment 37 Rob Buis 2022-09-28 01:59:13 PDT
Created attachment 462676 [details]
Patch
Comment 38 Rob Buis 2022-09-28 03:29:10 PDT
Created attachment 462677 [details]
Patch
Comment 39 Rob Buis 2022-09-28 06:17:13 PDT
Created attachment 462681 [details]
Patch
Comment 40 Rob Buis 2022-09-28 07:14:37 PDT
Created attachment 462683 [details]
Patch
Comment 41 Rob Buis 2022-09-28 13:24:44 PDT
Created attachment 462691 [details]
Patch
Comment 42 cathiechen 2022-10-03 11:56:17 PDT
Pull request: https://github.com/WebKit/WebKit/pull/4936
Comment 43 Rob Buis 2022-11-01 03:53:33 PDT
Created attachment 463339 [details]
Patch
Comment 44 EWS 2022-11-01 07:42:34 PDT
Committed 256186@main (34f748c71e8d): <https://commits.webkit.org/256186@main>

All reviewed patches have been landed. Closing bug and clearing flags on attachment 463339 [details].