1949113 - eu.patagonia.com - Hamburger menu is blank

Status: VERIFIED FIXED

(Web Compatibility :: Site Reports, defect, P2)

Description

[Calin Tanase]

Environment:
Operating system: Android 15
Firefox version: Firefox Mobile [phone]

Steps to reproduce:

1. Go to https://eu.patagonia.com/ie/en/home
2. Dismiss the pop-ups and cookie banner.
3. Tap on the hamburger menu located on the left side of the page.

Expected Behavior:
The elements in the hamburger menu are visible.

Actual Behavior:
The hamburger menu is blank.

Notes:

• Reproduces regardless of the status of ETP
• Reproduces in firefox-nightly, and firefox-release
• Does not reproduce in chrome

Created from https://github.com/webcompat/web-bugs/issues/148404

Comment 1

[Calin Tanase]

Attachment: FF vs Chrome.png

Comment 2

[Jeff Muizelaar [:jrmuizel]]

Looks like it reproduces in RDM

Comment 3

[Jeff Muizelaar [:jrmuizel]]

Attachment: Standalone test case

Comment 4

[Jeff Muizelaar [:jrmuizel]]

This page uses -webkit-fill-available. Enabling layout.css.webkit-fill-available.enabled fixes the problem.

Comment 5

[Daniel Holbert [:dholbert]]

(In reply to Jeff Muizelaar [:jrmuizel] from comment #4)

This page uses -webkit-fill-available. Enabling layout.css.webkit-fill-available.enabled fixes the problem.

Specifically, it uses height: -webkit-fill-available. Here's their relevant CSS rule:

.navigation-primary__expanded-primary-menus-wrapper, .navigation-primary__expanded-submenu-wrapper {
	box-sizing: content-box;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-overflow-scrolling: touch;
	width: 100%;
	height: -webkit-fill-available;
	transition: opacity .4s cubic-bezier(.38,.41,.27,1),transform .4s cubic-bezier(.38,.41,.27,1);
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	overflow: auto;
}

https://eu.patagonia.com/on/demandware.static/Sites-patagonia-eu-Site/-/en_IE/v1757607317671/css/global-modern.css

Comment 6

[Daniel Holbert [:dholbert]]

This should be fixed by the patch that I've landed in bug 1988938. I'll plan to retest in tomorrow's Nightly, and I'll close after confirming that it's fixed.

--> Removing dependency on bug 1872755 (which remains open and tracks broader support that's not needed here).

Comment 7

[Daniel Holbert [:dholbert]]

Confirmed that this was FIXED by bug 1988938, in latest Nightly 2025-09-18 on Android. Hamburger menu comes up just fine now.

(If I toggle layout.css.webkit-fill-available.enabled to false (restoring old behavior), I do still see the bug though, as-expected.)
--> closing as FIXED by bug 1988938

Comment 8

[Calin Tanase]

Verified, works as expected with the RC build.

Tested with:

• Browser / Version: Fenix 144.0-candidate build 1
• Operating System: Google Pixel 5 (Android 14)