[Webkit-unassigned] [Bug 244627] New: [Quirk] REGRESSION (r286874): Disable resolution media feature on Expedia.com

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=244627

            Bug ID: 244627
           Summary: [Quirk] REGRESSION (r286874): Disable resolution media
                    feature on Expedia.com
           Product: WebKit
           Version: WebKit Nightly Build
          Hardware: Unspecified
                OS: Unspecified
            Status: NEW
          Keywords: InRadar
          Severity: Normal
          Priority: P2
         Component: CSS
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: gsnedders at apple.com
                CC: webkit-bug-importer at group.apple.com

rdar://98750324

Steps To Reproduce:
1. Navigate to https://www.expedia.com/
2. Select the check-in date, observe the drop-down menu expands the page, doesn’t fit into the window layout, got cropped at the far right.

Also to note, because I couldn’t repro this initially: this is very sensitive to the width of the window to repro.

This is what no longer matches:

@media not all and (min-resolution: 0.001dpcm) {
    @supports (-webkit-appearance: none) and(stroke-color: transparent) {
        .uitk-menu-mounted .uitk-menu-container.uitk-menu-container-autoposition {
            animation-fill-mode: none, forwards;
            transform:translateX(var(--menu-offset-translate-x))
        }
    }
}

So this is near identical to every other case of detecting Safari via non-support of min-resolution.

The JS that sets --menu-offset-translate-x does so when the following animation doesn’t do the right thing:

@keyframes menu-grow-left{
    from{
        transform:translate(-50%, -50%) scale(0, 0)
    }
    to{
        transform:translate(var(--menu-grow-x), 0) scale(1, 1)
    }
}

And we’re ending up with a computed value of "matrix(1, 0, 0, 1, 0, 0), which shouldn’t be happening (well, unless --menu-grow-x is 0). It seems that at least _some_ of the problem here is the use of percentages within translate, looking at what WPT transform animation tests we fail, but it still seems like we end up at the wrong endpoint even just replacing the from translate.

So we have two potential fixes: add a quirk to disable the standard resolution media feature for Expedia, or we fix that animation. That animation is apparently bug 201736, not supporting var in @keyframes. So quirking it off it is.

We already quirk'd resolution of on hotels.com in bug 239980, which is another Expedia Group property, and the date picker looks pretty similar (both visually and in code). Other Expedia Group properties affected by this: https://www.wotif.com, https://www.carrentals.com, https://www.cheaptickets.com, https://www.ebookers.com, https://www.orbitz.com, https://www.travelocity.com. Note that some of these have a variety of localized domains (we currently quirk www.hotels.com, but not uk.hotels.com, yet alone www.hoteles.com).

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20220831/ce56341b/attachment.htm>