Commit 0f3b24ca authored by Javier Contreras Tenorio (from Dev Box)'s avatar Javier Contreras Tenorio (from Dev Box) Committed by aborovova@mozilla.com
Browse files

Bug 1966725 [wpt PR 52569] - [gap-decorations] Avoid invalidating col rules... 

Bug 1966725 [wpt PR 52569] - [gap-decorations] Avoid invalidating col rules when GapDecorations is on,

Automatic update from web-platform-tests
[gap-decorations] Avoid invalidating col rules when GapDecorations is on

This CL makes it so we avoid making a call to
`ColumnRuleStyleDidChange()` in `LayoutBlockFlow::StyleDidChange()` so
that we do not invalidate column rules when GapDecorations is enabled,
since with GapDecorations we already invalidate via the `invalidate:
paint` pipeline in `css_properties.json`.

The test added in this CL makes sure we are still invalidating correctly
after this change.

Bug: 357648037
Change-Id: I93f1a453133e658bca88277d8e253075ce2e2cd7
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6532734


Reviewed-by: default avatarAlison Maher <almaher@microsoft.com>
Reviewed-by: default avatarIan Kilpatrick <ikilpatrick@chromium.org>
Commit-Queue: Javier Contreras <javiercon@microsoft.com>
Cr-Commit-Position: refs/heads/main@{#1460754}

--

wpt-commits: 12048307995281f5e6cc9f3bcfb20d7b2877bd48
wpt-pr: 52569

Differential Revision: https://phabricator.services.mozilla.com/D250631
parent 05824e4c

testing/web-platform/tests/css/css-gaps/agnostic/gap-decorations-003-ref.html

0 → 100644
+32 −0
Original line number Diff line number Diff line 
<!DOCTYPE html>

<style>

    body {

        margin: 0px;

    }

    #current {

        columns: 6;

        column-gap: 2px;

        column-rule-style: solid;

        column-rule-width: 2px;

        column-fill: auto;

        height: 20px;

        column-rule-color: hotpink;

        width: 72px;

        height: 20px;

    }

    .items {

        background-color: lightgreen;

        height: 20px

    }

</style>

<body>

    <div id="current">

        <div class="items"></div>

        <div class="items"></div>

        <div class="items"></div>

        <div class="items"></div>

        <div class="items"></div>

        <div class="items"></div>

    </div>

</body>

</html>

testing/web-platform/tests/css/css-gaps/agnostic/gap-decorations-003.html

0 → 100644
+51 −0
Original line number Diff line number Diff line 
<!DOCTYPE html>

<html class="reftest-wait">

<head>

    <title>column-rule-color invalidates and paints correctly on multi-col</title>

    <link rel="match" href="gap-decorations-003-ref.html">

    <link rel="help" href="https://drafts.csswg.org/css-color-4/#resolving-other-colors">

    <link rel="author" href="mailto:javiercon@microsoft.com">

</head>

<style>

    body {

        margin: 0px;

    }

    #current {

        color: firebrick;

        columns: 6;

        column-gap: 2px;

        column-rule-style: solid;

        column-rule-width: 2px;

        column-fill: auto;

        height: 20px;

        column-rule-color: gold;

        width: 72px;

        height: 20px;

    }

    .items {

        background-color: lightgreen;

        height: 20px

    }

</style>

<body>

    <div id="current">

        <div class="items"></div>

        <div class="items"></div>

        <div class="items"></div>

        <div class="items"></div>

        <div class="items"></div>

        <div class="items"></div>

    </div>

</body>

<script>

    // Use double requestAnimationFrame to remove need of setTimeout.

    // Wait for the first frame to ensure that the style is computed.

    requestAnimationFrame(() => {

        // Wait for the second frame to ensure that the style is painted.

        requestAnimationFrame(() => {

            document.getElementById("current").style.columnRuleColor = "hotpink";

            document.documentElement.classList.remove("reftest-wait");

        });

    });

</script>

</html>