[webkit-changes] [WebKit/WebKit] 82ef68: Trim collapsed margins at block-start and block-en...

[Sammy Gill]

  Branch: refs/heads/main
  Home:   https://github.com/WebKit/WebKit
  Commit: 82ef68207e2f4b6c16b642e5df3a2e79d0e62355
      https://github.com/WebKit/WebKit/commit/82ef68207e2f4b6c16b642e5df3a2e79d0e62355
  Author: Sammy Gill <sammy.gill at apple.com>
  Date:   2023-02-01 (Wed, 01 Feb 2023)

  Changed paths:
    A LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-end-collapsed-margins-expected.html
    A LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-end-collapsed-margins.html
    A LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-end-self-collapsing-item-has-larger-block-end-expected.html
    A LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-end-self-collapsing-item-has-larger-block-end.html
    A LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-end-self-collapsing-item-has-larger-block-start-expected.html
    A LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-end-self-collapsing-item-has-larger-block-start.html
    A LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-start-collapsed-margins-expected.html
    A LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-start-collapsed-margins.html
    A LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-start-self-collapsing-item-has-larger-block-end-expected.html
    A LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-start-self-collapsing-item-has-larger-block-end.html
    A LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-start-self-collapsing-item-larger-block-start-expected.html
    A LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-start-self-collapsing-item-larger-block-start.html
    M Source/WebCore/rendering/RenderBlockFlow.cpp

  Log Message:
  -----------
  Trim collapsed margins at block-start and block-end when specified by margin-trim
https://bugs.webkit.org/show_bug.cgi?id=249781
rdar://103640784

Reviewed by Alan Baradlay.

When collapsed margins at propagated to the block-start or block-end of
a block container and the appropriate margin-trim values are specified,
those margins should also be trimmed.

This can be done by keeping track of whether we are at the block start
or block end of the box as specified by the MarginInfo structure. If
we are currently at the block start of the container, then we should
trim the before margin of the child. If the child is self collapsing,
we should also trim its after margin.

By the time we are in setCollapsedBottomMargin, we are at the block
end of the block container. That means we should be able to trim the
values inside of MarginInfo if margin-trim: block/block-end is
specified.

Here is an example to demonstrate this logic:

container {
    display: block;
    margin-trim: block;
    margin-block-start: 10px;
}
item {
    display: block;
    margin-block-start: 40px;
    width: 50px;
    height: 50px;
    background-color: green;
}
.collapsed {
    margin-block-start: 0px;
    height: 0px;
}
<item style="margin-block-start: 0px;"></item>
<container>
    <item class="collapsed"></item>
    <item></item>
</container>

- The container will begin layout of its block children and will iterate
over them. Each iteration will take in and update a MarginInfo structure
that is used to handle any sort of collapsing. Initially this structure
will just hold the margin information for the container itself.

- RenderBlockFlow::layoutBlockChild will call RenderBlockFlow::collapseMargins
with the child as an argument, and that method will call
RenderBlockFlow::collapseMarginsWithChildInfo to perform the actual
collapsing.

- Since we are at the before side of the block, which is a part of the
MarginInfo state, and block-start trimming is specified, we will then
trim the block-start margin of the child. We will also trim the block-end
margin of the child since it is self-collapsing.

- Once we are done with this item and we are back in RenderBlockFlow::layoutBlockChild
we will check to see if we need to update the MarginInfo state that keeps
track of us being at the before side of the block container. Since
1.) We were at the before side of the block container
2.) The child we just laid out is self collapsing
We will not update our MarginInfo state and we will continue to be at the
before side of the block. This means that this trimming logic will continue
on with the next item in the container. If the first item was not
self collapsing, however, then we would update our MarginInfo state so
that we are no longer at the before side and we would not trim the
block-start margins of the future children.

- After we layout and trim the margins of the second item,
RenderBlockFlow::layoutBlockChildren will call handleAfterSideOfBlock
with the MarginInfo structure that has been modified this whole time.
This should contain any margins that have collapsed through to the
after side of the block.

- Once in RenderBlockFlow::setCollapsedBottomMargin, we will check to
see if block-end margin trimming has been specified. If it has, then
we will use 0 (trimmed) for the margin from MarginInfo that is supposed
to collapse with the container's margin.

* LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-end-collapsed-margins-expected.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-end-collapsed-margins.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-end-self-collapsing-item-has-larger-block-end-expected.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-end-self-collapsing-item-has-larger-block-end.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-end-self-collapsing-item-has-larger-block-start-expected.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-end-self-collapsing-item-has-larger-block-start.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-start-collapsed-margins-expected.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-start-collapsed-margins.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-start-self-collapsing-item-has-larger-block-end-expected.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-start-self-collapsing-item-has-larger-block-end.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-start-self-collapsing-item-larger-block-start-expected.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/css/css-box/margin-trim/block-container-block-start-self-collapsing-item-larger-block-start.html: Added.
* Source/WebCore/rendering/RenderBlockFlow.cpp:
(WebCore::RenderBlockFlow::collapseMarginsWithChildInfo):
(WebCore::RenderBlockFlow::setCollapsedBottomMargin):

Canonical link: https://commits.webkit.org/259734@main