diff --git a/crates/obscura-render/src/style.rs b/crates/obscura-render/src/style.rs index 72f112f..f7b841f 100644 --- a/crates/obscura-render/src/style.rs +++ b/crates/obscura-render/src/style.rs @@ -328,7 +328,15 @@ fn apply_value(style: &mut LayoutStyle, name: &str, value: &str) { style.display = crate::Display::Block; style.flow_root = true; } - "contents" => style.display_contents = true, + "contents" => { + // `display:contents` can override an earlier `display:none` + // in the cascade (responsive desktop/mobile wrappers do + // this constantly). It suppresses only this element's box; + // its children remain generated and are flattened into the + // parent formatting context. + style.display = crate::Display::Block; + style.display_contents = true; + } _ => {} } } @@ -3276,6 +3284,13 @@ mod tests { assert!(infinite.animation_iteration_infinite); } + #[test] + fn display_contents_overrides_an_earlier_display_none() { + let style = compute_style("div", Some("display:none; display:contents")); + assert_eq!(style.display, Display::Block); + assert!(style.display_contents); + } + #[test] fn authored_display_replaces_internal_flex_provenance() { let native_cell = compute_style("td", None); diff --git a/render-repros/checks.json b/render-repros/checks.json index 6d8857d..60ea25c 100644 --- a/render-repros/checks.json +++ b/render-repros/checks.json @@ -56,6 +56,10 @@ {"name": "max padding uses actual viewport", "color": "#c2255c", "x": 60, "y": 240, "width": 20, "height": 40}, {"name": "round quantizes nested custom property math", "color": "#2f9e44", "x": 0, "y": 300, "width": 250, "height": 40} ], + "display-contents-cascade": [ + {"name": "display contents overrides hidden responsive wrapper", "color": "#087f5b", "x": 0, "y": 0, "width": 200, "height": 80}, + {"name": "flattened sibling remains in parent flex flow", "color": "#1971c2", "x": 200, "y": 0, "width": 200, "height": 80} + ], "eventtarget-lifecycle": [ {"name": "framework lifecycle EventTarget completes", "color": "#18723a", "x": 0, "y": 0, "width": 420, "height": 120} ], diff --git a/render-repros/display-contents-cascade.html b/render-repros/display-contents-cascade.html new file mode 100644 index 0000000..a447fce --- /dev/null +++ b/render-repros/display-contents-cascade.html @@ -0,0 +1,33 @@ + + + + + Display contents cascade + + + + + +