Bug 214594

Summary:

Wrong layer order with negative z-index and will-change: transform

Product:

WebKit

Reporter:

Dartess <dartess>

Component:

Compositing

Assignee:

Nobody <webkit-unassigned>

Status:

RESOLVED FIXED

Severity:

Normal

CC:

Hironori.Fujii, rbuis, simon.fraser, webkit-bug-importer, zalan

Priority:

Keywords:

InRadar

Version:

Safari 13

Hardware:

All

OS:

All

Attachments:

Description	Flags
demo	none

Description Dartess 2020-07-21 06:47:58 PDT

Created attachment 404817 [details]
demo

live demo (also in attach): https://codepen.io/dartess/pen/bGEOJwM

when items has negative z-index AND has will-change: transform safari broke z-index order.

Comment 1 Radar WebKit Bug Importer 2020-07-21 18:43:47 PDT

<rdar://problem/65914326>

Comment 2 Simon Fraser (smfr) 2020-07-21 20:55:49 PDT

I can reproduce. I'm a bit surprised we get this wrong.

Comment 3 Simon Fraser (smfr) 2020-07-29 16:22:33 PDT

This happens because when we see a negative z-index child, we make its stacking context layer compositing eagerly:

    for (auto* childLayer : layer.negativeZOrderLayers()) {
        computeCompositingRequirements(&layer, *childLayer, overlapMap, currentState, backingSharingState, anyDescendantHas3DTransform);

        // If we have to make a layer for this child, make one now so we can have a contents layer
        // (since we need to ensure that the -ve z-order child renders underneath our contents).
        if (!willBeComposited && currentState.subtreeIsCompositing) {
            layer.setIndirectCompositingReason(IndirectCompositingReason::BackgroundLayer);
            layerWillComposite();
        }
    }

but this messes up the overlap map, so the second negative z-index child doesn't see the rects from the first one.

Comment 4 Rob Buis 2021-09-01 00:39:11 PDT

Fixing https://bugs.webkit.org/show_bug.cgi?id=217154 also seems to fix this.

Comment 5 Rob Buis 2023-02-08 02:59:43 PST

This seems fixed these days.