Fix `display: none` when it is set for the only node in the hierarchy (#377)
* Fix leaf layout taking precedence over display:none
* Add tests for lone display:none node, and display:none as a grid child
f38d369aa90096a226eb55be79cdd8f0c4fc8e82 · by Nico Burns · (3 years ago) · parent f52f1ffaf · browse the tree at this commit
Semantic delta · 5
tests/generated/display_none_only_node.rs
tests/generated/grid_display_none_fixed_size.rs
diff --git a/src/compute/mod.rs b/src/compute/mod.rs
index ba4b2eb3b..50280f474 100644
--- a/src/compute/mod.rs
+++ b/src/compute/mod.rs
@@ -177,8 +177,10 @@ fn compute_node_layout(
}
}
- let computed_size_and_baselines = if tree.is_childless(node) {
- perform_computations::<LeafAlgorithm>(
+ let display_mode = tree.style(node).display;
+ let has_children = !tree.is_childless(node);
+ let computed_size_and_baselines = match (display_mode, has_children) {
+ (Display::None, _) => perform_computations::<HiddenAlgorithm>(
tree,
node,
known_dimensions,
@@ -186,38 +188,35 @@ fn compute_node_layout(
available_space,
run_mode,
sizing_mode,
- )
- } else {
- match tree.style(node).display {
- Display::Flex => perform_computations::<FlexboxAlgorithm>(
- tree,
- node,
- known_dimensions,
- parent_size,
- available_space,
- run_mode,
- sizing_mode,
- ),
- #[cfg(feature = "grid")]
- Display::Grid => perform_computations::<CssGridAlgorithm>(
- tree,
- node,
- known_dimensions,
- parent_size,
- available_space,
- run_mode,
- sizing_mode,
- ),
- Display::None => perform_computations::<HiddenAlgorithm>(
- tree,
- node,
- known_dimensions,
- parent_size,
- available_space,
- run_mode,
- sizing_mode,
- ),
- }
+ ),
+ (Display::Flex, true) => perform_computations::<FlexboxAlgorithm>(
+ tree,
+ node,
+ known_dimensions,
+ parent_size,
+ available_space,
+ run_mode,
+ sizing_mode,
+ ),
+ #[cfg(feature = "grid")]
+ (Display::Grid, true) => perform_computations::<CssGridAlgorithm>(
+ tree,
+ node,
+ known_dimensions,
+ parent_size,
+ available_space,
+ run_mode,
+ sizing_mode,
+ ),
+ (_, false) => perform_computations::<LeafAlgorithm>(
+ tree,
+ node,
+ known_dimensions,
+ parent_size,
+ available_space,
+ run_mode,
+ sizing_mode,
+ ),
};
// Cache result
diff --git a/test_fixtures/display_none_only_node.html b/test_fixtures/display_none_only_node.html
new file mode 100644
index 000000000..fa299cdc8
--- /dev/null
+++ b/test_fixtures/display_none_only_node.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <script src="../scripts/gentest/test_helper.js"></script>
+ <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+ <title>
+ Test description
+ </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; display: none"></div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/test_fixtures/grid_display_none_fixed_size.html b/test_fixtures/grid_display_none_fixed_size.html
new file mode 100644
index 000000000..cad8ebf9d
--- /dev/null
+++ b/test_fixtures/grid_display_none_fixed_size.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <script src="../scripts/gentest/test_helper.js"></script>
+ <link rel="stylesheet" type="text/css" href="../scripts/gentest/test_base_style.css">
+ <title>
+ Test description
+ </title>
+<head/>
+<body>
+
+<div id="test-root" style="width: 100px; height: 100px; display: grid;">
+ <div style="flex-grow: 1;"></div>
+ <div style="width: 20px; height: 20px; display:none;"></div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/tests/generated/display_none_only_node.rs b/tests/generated/display_none_only_node.rs
new file mode 100644
index 000000000..bda323cfa
--- /dev/null
+++ b/tests/generated/display_none_only_node.rs
@@ -0,0 +1,26 @@
+#[test]
+fn display_none_only_node() {
+ use slotmap::Key;
+ #[allow(unused_imports)]
+ use taffy::{layout::Layout, prelude::*};
+ let mut taffy = taffy::Taffy::new();
+ let node = taffy
+ .new_leaf(taffy::style::Style {
+ display: taffy::style::Display::None,
+ size: taffy::geometry::Size {
+ width: taffy::style::Dimension::Points(100f32),
+ height: taffy::style::Dimension::Points(100f32),
+ },
+ ..Default::default()
+ })
+ .unwrap();
+ taffy.compute_layout(node, taffy::geometry::Size::MAX_CONTENT).unwrap();
+ println!("\nComputed tree:");
+ taffy::debug::print_tree(&taffy, node);
+ println!();
+ let Layout { size, location, .. } = taffy.layout(node).unwrap();
+ assert_eq!(size.width, 0f32, "width of node {:?}. Expected {}. Actual {}", node.data(), 0f32, size.width);
+ assert_eq!(size.height, 0f32, "height of node {:?}. Expected {}. Actual {}", node.data(), 0f32, size.height);
+ assert_eq!(location.x, 0f32, "x of node {:?}. Expected {}. Actual {}", node.data(), 0f32, location.x);
+ assert_eq!(location.y, 0f32, "y of node {:?}. Expected {}. Actual {}", node.data(), 0f32, location.y);
+}
diff --git a/tests/generated/grid_display_none_fixed_size.rs b/tests/generated/grid_display_none_fixed_size.rs
new file mode 100644
index 000000000..9dbc620a0
--- /dev/null
+++ b/tests/generated/grid_display_none_fixed_size.rs
@@ -0,0 +1,50 @@
+#[test]
+fn grid_display_none_fixed_size() {
+ use slotmap::Key;
+ #[allow(unused_imports)]
+ use taffy::{layout::Layout, prelude::*};
+ let mut taffy = taffy::Taffy::new();
+ let node0 = taffy.new_leaf(taffy::style::Style { flex_grow: 1f32, ..Default::default() }).unwrap();
+ let node1 = taffy
+ .new_leaf(taffy::style::Style {
+ display: taffy::style::Display::None,
+ size: taffy::geometry::Size {
+ width: taffy::style::Dimension::Points(20f32),
+ height: taffy::style::Dimension::Points(20f32),
+ },
+ ..Default::default()
+ })
+ .unwrap();
+ let node = taffy
+ .new_with_children(
+ taffy::style::Style {
+ display: taffy::style::Display::Grid,
+ size: taffy::geometry::Size {
+ width: taffy::style::Dimension::Points(100f32),
+ height: taffy::style::Dimension::Points(100f32),
+ },
+ ..Default::default()
+ },
+ &[node0, node1],
+ )
+ .unwrap();
+ taffy.compute_layout(node, taffy::geometry::Size::MAX_CONTENT).unwrap();
+ println!("\nComputed tree:");
+ taffy::debug::print_tree(&taffy, node);
+ println!();
+ let Layout { size, location, .. } = taffy.layout(node).unwrap();
+ assert_eq!(size.width, 100f32, "width of node {:?}. Expected {}. Actual {}", node.data(), 100f32, size.width);
+ assert_eq!(size.height, 100f32, "height of node {:?}. Expected {}. Actual {}", node.data(), 100f32, size.height);
+ assert_eq!(location.x, 0f32, "x of node {:?}. Expected {}. Actual {}", node.data(), 0f32, location.x);
+ assert_eq!(location.y, 0f32, "y of node {:?}. Expected {}. Actual {}", node.data(), 0f32, location.y);
+ let Layout { size, location, .. } = taffy.layout(node0).unwrap();
+ assert_eq!(size.width, 100f32, "width of node {:?}. Expected {}. Actual {}", node0.data(), 100f32, size.width);
+ assert_eq!(size.height, 100f32, "height of node {:?}. Expected {}. Actual {}", node0.data(), 100f32, size.height);
+ assert_eq!(location.x, 0f32, "x of node {:?}. Expected {}. Actual {}", node0.data(), 0f32, location.x);
+ assert_eq!(location.y, 0f32, "y of node {:?}. Expected {}. Actual {}", node0.data(), 0f32, location.y);
+ let Layout { size, location, .. } = taffy.layout(node1).unwrap();
+ assert_eq!(size.width, 0f32, "width of node {:?}. Expected {}. Actual {}", node1.data(), 0f32, size.width);
+ assert_eq!(size.height, 0f32, "height of node {:?}. Expected {}. Actual {}", node1.data(), 0f32, size.height);
+ assert_eq!(location.x, 0f32, "x of node {:?}. Expected {}. Actual {}", node1.data(), 0f32, location.x);
+ assert_eq!(location.y, 0f32, "y of node {:?}. Expected {}. Actual {}", node1.data(), 0f32, location.y);
+}
diff --git a/tests/generated/mod.rs b/tests/generated/mod.rs
index a34a6142c..dfe95c1e0 100644
--- a/tests/generated/mod.rs
+++ b/tests/generated/mod.rs
@@ -208,6 +208,7 @@ mod container_with_unsized_child;
mod display_none;
mod display_none_absolute_child;
mod display_none_fixed_size;
+mod display_none_only_node;
mod display_none_with_child;
mod display_none_with_margin;
mod display_none_with_position;
@@ -460,6 +461,8 @@ mod grid_basic_with_overflow;
#[cfg(feature = "grid")]
mod grid_basic_with_padding;
#[cfg(feature = "grid")]
+mod grid_display_none_fixed_size;
+#[cfg(feature = "grid")]
mod grid_fit_content_percent_definite_argument;
#[cfg(feature = "grid")]
mod grid_fit_content_percent_definite_max_content;