mirror of
https://github.com/pbakaus/impeccable.git
synced 2026-09-22 02:56:52 +03:00
Fix stripe height inference for definite-height boxes
Do not infer a full-height absolute stripe from opposing insets when height is definite. Cover px, rem, percent and calc corner tiles, and pin existing anchor/button exemptions. Full Rust workspace, rebuilt-engine Bun/Node suite and build pass; static and real Chrome agree on the repro. AI-assisted by Codex under pbakaus's instructions.
This commit is contained in:
@@ -502,8 +502,11 @@ pub fn check_element_stripe_child(el: &StaticElement<'_>, style: &StyleValues) -
|
||||
// The cascade already expands inset; a winning `auto` longhand
|
||||
// must not be overwritten by the earlier shorthand.
|
||||
let inset = ["top", "right", "bottom", "left"].map(|prop| sv(style, prop));
|
||||
let height_stretches =
|
||||
height_raw == "100%" || (static_edge_hugs(&inset[0]) && static_edge_hugs(&inset[2]));
|
||||
// Opposing insets stretch only an auto-height box. With a definite
|
||||
// height CSS drops the bottom constraint instead of stretching it.
|
||||
let height_stretches = height_raw == "100%"
|
||||
|| ((height_raw.is_empty() || height_raw == "auto")
|
||||
&& static_edge_hugs(&inset[0]) && static_edge_hugs(&inset[2]));
|
||||
if !height_stretches {
|
||||
return Vec::new();
|
||||
}
|
||||
|
||||
@@ -64,6 +64,26 @@ fn absolute_top_bottom_flags() {
|
||||
assert!(hits[0].contains("stripe child (left)"));
|
||||
}
|
||||
|
||||
#[test]
|
||||
fn absolute_definite_height_does_not_stretch_between_insets() {
|
||||
for height in ["4px", "1rem", "25%", "calc(2px + 2px)"] {
|
||||
let html = format!(r#"<html><body><div style="position:relative;width:320px;height:100px">
|
||||
<span style="position:absolute;left:0;top:0;bottom:0;width:4px;height:{height};background:#3b82f6"></span>
|
||||
</div></body></html>"#);
|
||||
assert!(side_tab_snippets(&html).is_empty(), "definite height {height} is not stretched");
|
||||
}
|
||||
}
|
||||
|
||||
#[test]
|
||||
fn interactive_host_stripes_keep_the_border_rule_exemptions() {
|
||||
for tag in ["a", "button"] {
|
||||
let html = format!(r#"<html><body><{tag} style="position:relative;display:block;width:320px;height:100px">
|
||||
<span style="position:absolute;left:0;top:0;bottom:0;width:4px;background:#3b82f6"></span>
|
||||
</{tag}></body></html>"#);
|
||||
assert!(side_tab_snippets(&html).is_empty(), "{tag} is an exempt control");
|
||||
}
|
||||
}
|
||||
|
||||
#[test]
|
||||
fn flex_column_does_not_flag() {
|
||||
let html = r#"<!DOCTYPE html><html><head><style>
|
||||
|
||||
Reference in New Issue
Block a user