mirror of
https://github.com/lexmount/moli.git
synced 2026-10-30 16:07:24 +00:00
fix(layout): preserve wrapped flex distribution across overflow modes
Adopt the separate Taffy distribution fallback correction. Remove the scroll-only branch, preserve flex-start versus safe center behavior in every writing mode, and add a browser regression that checks child positions for visible and scroll overflow.
Validation: cargo fmt --all; cargo clippy --workspace --all-targets --all-features -- -D warnings; cargo nextest run --no-fail-fast (20287 passed, 18 skipped). The combined working tree passed these checks before this logical split. Frozen Release and focused browser/WPT validation also passed; final full WPT is running.
Original-commit: 4d5786f1a1
This commit is contained in:
Generated
+1
-1
@@ -5650,7 +5650,7 @@ dependencies = [
|
||||
[[package]]
|
||||
name = "taffy"
|
||||
version = "0.15.0"
|
||||
source = "git+https://github.com/ldm0/taffy?rev=9c9b9257de73437781df7facbd0aa7beac6abe3f#9c9b9257de73437781df7facbd0aa7beac6abe3f"
|
||||
source = "git+https://github.com/ldm0/taffy?rev=0a337871fa44db7d48571b06668f92737eefa8c2#0a337871fa44db7d48571b06668f92737eefa8c2"
|
||||
dependencies = [
|
||||
"serde",
|
||||
"slotmap",
|
||||
|
||||
+2
-2
@@ -117,10 +117,10 @@ stylo_dom = { git = "https://github.com/lexmount/stylo", rev = "973988b9c592a802
|
||||
stylo_static_prefs = { git = "https://github.com/lexmount/stylo", rev = "973988b9c592a802eefdc5abe6072dd9ba221385" }
|
||||
stylo_traits = { git = "https://github.com/lexmount/stylo", rev = "973988b9c592a802eefdc5abe6072dd9ba221385" }
|
||||
svgtypes = { git = "https://github.com/lexmount/svgtypes", branch = "moli" }
|
||||
taffy = { git = "https://github.com/ldm0/taffy", rev = "9c9b9257de73437781df7facbd0aa7beac6abe3f" }
|
||||
taffy = { git = "https://github.com/ldm0/taffy", rev = "0a337871fa44db7d48571b06668f92737eefa8c2" }
|
||||
|
||||
[patch."https://github.com/DioxusLabs/taffy"]
|
||||
taffy = { git = "https://github.com/ldm0/taffy", rev = "9c9b9257de73437781df7facbd0aa7beac6abe3f" }
|
||||
taffy = { git = "https://github.com/ldm0/taffy", rev = "0a337871fa44db7d48571b06668f92737eefa8c2" }
|
||||
|
||||
[workspace.lints.clippy]
|
||||
disallowed_methods = "deny"
|
||||
|
||||
@@ -261,3 +261,43 @@ fn wrapped_vertical_flex_keeps_padding_in_its_scroll_extent() -> Result<()> {
|
||||
}
|
||||
Ok(())
|
||||
}
|
||||
|
||||
#[test]
|
||||
fn wrapped_flex_distribution_keeps_child_positions_for_visible_and_scroll_overflow() -> Result<()> {
|
||||
let mut body = String::from("<!doctype html><body>");
|
||||
for (mode, direction, flow) in [
|
||||
("horizontal-tb", "ltr", "row"),
|
||||
("vertical-rl", "rtl", "column"),
|
||||
] {
|
||||
for overflow in ["visible", "scroll"] {
|
||||
for align in ["stretch", "space-between", "space-around", "space-evenly"] {
|
||||
body.push_str(&format!("<div id='flex-{mode}-{overflow}-{align}' data-flex-probe style='display:flex;writing-mode:{mode};direction:{direction};flex-flow:{flow} wrap-reverse;width:100px;height:100px;overflow:{overflow};border:3px solid;padding:10px;gap:10px;align-items:start;align-content:{align};margin-top:300px'>"));
|
||||
for _ in 0..3 {
|
||||
body.push_str("<div style='min-width:110px;min-height:110px'></div>");
|
||||
}
|
||||
body.push_str("</div>");
|
||||
}
|
||||
}
|
||||
}
|
||||
let expression = r#"JSON.stringify(Object.fromEntries([...document.querySelectorAll('[data-flex-probe]')].map(e => {const top=e.getBoundingClientRect().top;return [e.id,Object.fromEntries([...e.children].map((child,i)=>['y'+i,child.getBoundingClientRect().top-top]))]})))"#;
|
||||
let value = run_layout(&body, expression, false)?;
|
||||
for mode in ["horizontal-tb", "vertical-rl"] {
|
||||
for overflow in ["visible", "scroll"] {
|
||||
for align in ["stretch", "space-between", "space-around", "space-evenly"] {
|
||||
// Fixed Chromium control values distinguish flex-start fallback from
|
||||
// safe center, including the opposite cross flow of vertical RTL.
|
||||
let expected = match (mode, align) {
|
||||
("horizontal-tb", "stretch" | "space-between") => [3.0, -117.0, -237.0],
|
||||
("horizontal-tb", _) => [253.0, 133.0, 13.0],
|
||||
(_, "stretch" | "space-between") => [13.0, 133.0, 253.0],
|
||||
_ => [-237.0, -117.0, 3.0],
|
||||
};
|
||||
let id = format!("flex-{mode}-{overflow}-{align}");
|
||||
for (index, y) in expected.into_iter().enumerate() {
|
||||
assert_dimension(&value, &id, &format!("y{index}"), y);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Ok(())
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user