tawasuyu

tawasuyu/taffy

A high performance rust-powered UI layout library

Rust 717HTML 669Markdown 12TOML 62372 Definitions

⎇ main tests/hand_written/relayout.rs Rust · 423 lines · 15.2 KB History Who touched what raw

Use SCREAMING_SNAKE_CASE for alignment constants (#961) 9c58cc5d5 · Nico Burns ·

1use taffy::prelude::*;
2use taffy_test_helpers::new_test_tree;
3
4#[test]
5fn relayout() {
6    let mut taffy = new_test_tree();
7    let node1 = taffy
8        .new_leaf(taffy::style::Style {
9            size: taffy::geometry::Size { width: length(8.0), height: length(80.0) },
10            ..Default::default()
11        })
12        .unwrap();
13    let node0 = taffy
14        .new_with_children(
15            taffy::style::Style {
16                align_self: Some(taffy::prelude::AlignSelf::CENTER),
17                size: taffy::geometry::Size { width: Dimension::AUTO, height: Dimension::AUTO },
18                // size: taffy::geometry::Size { width: Dimension::Percent(1.0), height: Dimension::Percent(1.0) },
19                ..Default::default()
20            },
21            &[node1],
22        )
23        .unwrap();
24    let node = taffy
25        .new_with_children(
26            taffy::style::Style {
27                size: taffy::geometry::Size {
28                    width: Dimension::from_percent(1f32),
29                    height: Dimension::from_percent(1f32),
30                },
31                ..Default::default()
32            },
33            &[node0],
34        )
35        .unwrap();
36    taffy
37        .compute_layout(
38            node,
39            taffy::geometry::Size { width: AvailableSpace::Definite(100f32), height: AvailableSpace::Definite(100f32) },
40        )
41        .unwrap();
42    let initial = taffy.layout(node).unwrap().location;
43    let initial0 = taffy.layout(node0).unwrap().location;
44    let initial1 = taffy.layout(node1).unwrap().location;
45    for _ in 1..10 {
46        taffy
47            .compute_layout(
48                node,
49                taffy::geometry::Size {
50                    width: AvailableSpace::Definite(100f32),
51                    height: AvailableSpace::Definite(100f32),
52                },
53            )
54            .unwrap();
55        assert_eq!(taffy.layout(node).unwrap().location, initial);
56        assert_eq!(taffy.layout(node0).unwrap().location, initial0);
57        assert_eq!(taffy.layout(node1).unwrap().location, initial1);
58    }
59}
60
61#[test]
62fn toggle_root_display_none() {
63    let hidden_style = Style {
64        display: Display::None,
65        size: Size { width: length(100.0), height: length(100.0) },
66        ..Default::default()
67    };
68
69    let flex_style = Style {
70        display: Display::Flex,
71        size: Size { width: length(100.0), height: length(100.0) },
72        ..Default::default()
73    };
74
75    // Setup
76    let mut taffy = new_test_tree();
77    let node = taffy.new_leaf(hidden_style.clone()).unwrap();
78
79    // Layout 1 (None)
80    taffy.compute_layout(node, Size::MAX_CONTENT).unwrap();
81    let layout = taffy.layout(node).unwrap();
82    assert_eq!(layout.location.x, 0.0);
83    assert_eq!(layout.location.y, 0.0);
84    assert_eq!(layout.size.width, 0.0);
85    assert_eq!(layout.size.height, 0.0);
86
87    // Layout 2 (Flex)
88    taffy.set_style(node, flex_style).unwrap();
89    taffy.compute_layout(node, Size::MAX_CONTENT).unwrap();
90    let layout = taffy.layout(node).unwrap();
91    assert_eq!(layout.location.x, 0.0);
92    assert_eq!(layout.location.y, 0.0);
93    assert_eq!(layout.size.width, 100.0);
94    assert_eq!(layout.size.height, 100.0);
95
96    // Layout 3 (None)
97    taffy.set_style(node, hidden_style).unwrap();
98    taffy.compute_layout(node, Size::MAX_CONTENT).unwrap();
99    let layout = taffy.layout(node).unwrap();
100    assert_eq!(layout.location.x, 0.0);
101    assert_eq!(layout.location.y, 0.0);
102    assert_eq!(layout.size.width, 0.0);
103    assert_eq!(layout.size.height, 0.0);
104}
105
106#[test]
107fn toggle_root_display_none_with_children() {
108    use taffy::prelude::*;
109
110    let mut taffy = new_test_tree();
111
112    let child = taffy
113        .new_leaf(Style { size: Size { width: length(800.0), height: length(100.0) }, ..Default::default() })
114        .unwrap();
115
116    let parent = taffy
117        .new_with_children(
118            Style { size: Size { width: length(800.0), height: length(100.0) }, ..Default::default() },
119            &[child],
120        )
121        .unwrap();
122
123    let root = taffy.new_with_children(Style::default(), &[parent]).unwrap();
124    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
125    assert_eq!(taffy.layout(child).unwrap().size.width, 800.0);
126    assert_eq!(taffy.layout(child).unwrap().size.height, 100.0);
127
128    taffy.set_style(root, Style { display: Display::None, ..Default::default() }).unwrap();
129    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
130    assert_eq!(taffy.layout(child).unwrap().size.width, 0.0);
131    assert_eq!(taffy.layout(child).unwrap().size.height, 0.0);
132
133    taffy.set_style(root, Style::default()).unwrap();
134    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
135    assert_eq!(taffy.layout(parent).unwrap().size.width, 800.0);
136    assert_eq!(taffy.layout(parent).unwrap().size.height, 100.0);
137    assert_eq!(taffy.layout(child).unwrap().size.width, 800.0);
138    assert_eq!(taffy.layout(child).unwrap().size.height, 100.0);
139}
140
141#[test]
142fn toggle_flex_child_display_none() {
143    let hidden_style = Style {
144        display: Display::None,
145        size: Size { width: length(100.0), height: length(100.0) },
146        ..Default::default()
147    };
148
149    let flex_style = Style {
150        display: Display::Flex,
151        size: Size { width: length(100.0), height: length(100.0) },
152        ..Default::default()
153    };
154
155    // Setup
156    let mut taffy = new_test_tree();
157    let node = taffy.new_leaf(hidden_style.clone()).unwrap();
158    let root = taffy.new_with_children(flex_style.clone(), &[node]).unwrap();
159
160    // Layout 1 (None)
161    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
162    let layout = taffy.layout(node).unwrap();
163    assert_eq!(layout.location.x, 0.0);
164    assert_eq!(layout.location.y, 0.0);
165    assert_eq!(layout.size.width, 0.0);
166    assert_eq!(layout.size.height, 0.0);
167
168    // Layout 2 (Flex)
169    taffy.set_style(node, flex_style).unwrap();
170    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
171    let layout = taffy.layout(node).unwrap();
172    assert_eq!(layout.location.x, 0.0);
173    assert_eq!(layout.location.y, 0.0);
174    assert_eq!(layout.size.width, 100.0);
175    assert_eq!(layout.size.height, 100.0);
176
177    // Layout 3 (None)
178    taffy.set_style(node, hidden_style).unwrap();
179    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
180    let layout = taffy.layout(node).unwrap();
181    assert_eq!(layout.location.x, 0.0);
182    assert_eq!(layout.location.y, 0.0);
183    assert_eq!(layout.size.width, 0.0);
184    assert_eq!(layout.size.height, 0.0);
185}
186
187#[test]
188fn toggle_flex_container_display_none() {
189    let hidden_style = Style {
190        display: Display::None,
191        size: Size { width: length(100.0), height: length(100.0) },
192        ..Default::default()
193    };
194
195    let flex_style = Style {
196        display: Display::Flex,
197        size: Size { width: length(100.0), height: length(100.0) },
198        ..Default::default()
199    };
200
201    // Setup
202    let mut taffy = new_test_tree();
203    let node = taffy.new_leaf(hidden_style.clone()).unwrap();
204    let root = taffy.new_with_children(hidden_style.clone(), &[node]).unwrap();
205
206    // Layout 1 (None)
207    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
208    let layout = taffy.layout(root).unwrap();
209    assert_eq!(layout.location.x, 0.0);
210    assert_eq!(layout.location.y, 0.0);
211    assert_eq!(layout.size.width, 0.0);
212    assert_eq!(layout.size.height, 0.0);
213
214    // Layout 2 (Flex)
215    taffy.set_style(root, flex_style).unwrap();
216    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
217    let layout = taffy.layout(root).unwrap();
218    assert_eq!(layout.location.x, 0.0);
219    assert_eq!(layout.location.y, 0.0);
220    assert_eq!(layout.size.width, 100.0);
221    assert_eq!(layout.size.height, 100.0);
222
223    // Layout 3 (None)
224    taffy.set_style(root, hidden_style).unwrap();
225    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
226    let layout = taffy.layout(root).unwrap();
227    assert_eq!(layout.location.x, 0.0);
228    assert_eq!(layout.location.y, 0.0);
229    assert_eq!(layout.size.width, 0.0);
230    assert_eq!(layout.size.height, 0.0);
231}
232
233#[test]
234fn toggle_grid_child_display_none() {
235    let hidden_style = Style {
236        display: Display::None,
237        size: Size { width: length(100.0), height: length(100.0) },
238        ..Default::default()
239    };
240
241    let grid_style = Style {
242        display: Display::Grid,
243        size: Size { width: length(100.0), height: length(100.0) },
244        ..Default::default()
245    };
246
247    // Setup
248    let mut taffy = new_test_tree();
249    let node = taffy.new_leaf(hidden_style.clone()).unwrap();
250    let root = taffy.new_with_children(grid_style.clone(), &[node]).unwrap();
251
252    // Layout 1 (None)
253    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
254    let layout = taffy.layout(node).unwrap();
255    assert_eq!(layout.location.x, 0.0);
256    assert_eq!(layout.location.y, 0.0);
257    assert_eq!(layout.size.width, 0.0);
258    assert_eq!(layout.size.height, 0.0);
259
260    // Layout 2 (Flex)
261    taffy.set_style(node, grid_style).unwrap();
262    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
263    let layout = taffy.layout(node).unwrap();
264    assert_eq!(layout.location.x, 0.0);
265    assert_eq!(layout.location.y, 0.0);
266    assert_eq!(layout.size.width, 100.0);
267    assert_eq!(layout.size.height, 100.0);
268
269    // Layout 3 (None)
270    taffy.set_style(node, hidden_style).unwrap();
271    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
272    let layout = taffy.layout(node).unwrap();
273    assert_eq!(layout.location.x, 0.0);
274    assert_eq!(layout.location.y, 0.0);
275    assert_eq!(layout.size.width, 0.0);
276    assert_eq!(layout.size.height, 0.0);
277}
278
279#[test]
280fn toggle_grid_container_display_none() {
281    let hidden_style = Style {
282        display: Display::None,
283        size: Size { width: length(100.0), height: length(100.0) },
284        ..Default::default()
285    };
286
287    let grid_style = Style {
288        display: Display::Grid,
289        size: Size { width: length(100.0), height: length(100.0) },
290        ..Default::default()
291    };
292
293    // Setup
294    let mut taffy = new_test_tree();
295    let node = taffy.new_leaf(hidden_style.clone()).unwrap();
296    let root = taffy.new_with_children(hidden_style.clone(), &[node]).unwrap();
297
298    // Layout 1 (None)
299    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
300    let layout = taffy.layout(root).unwrap();
301    assert_eq!(layout.location.x, 0.0);
302    assert_eq!(layout.location.y, 0.0);
303    assert_eq!(layout.size.width, 0.0);
304    assert_eq!(layout.size.height, 0.0);
305
306    // Layout 2 (Flex)
307    taffy.set_style(root, grid_style).unwrap();
308    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
309    let layout = taffy.layout(root).unwrap();
310    assert_eq!(layout.location.x, 0.0);
311    assert_eq!(layout.location.y, 0.0);
312    assert_eq!(layout.size.width, 100.0);
313    assert_eq!(layout.size.height, 100.0);
314
315    // Layout 3 (None)
316    taffy.set_style(root, hidden_style).unwrap();
317    taffy.compute_layout(root, Size::MAX_CONTENT).unwrap();
318    let layout = taffy.layout(root).unwrap();
319    assert_eq!(layout.location.x, 0.0);
320    assert_eq!(layout.location.y, 0.0);
321    assert_eq!(layout.size.width, 0.0);
322    assert_eq!(layout.size.height, 0.0);
323}
324
325#[test]
326fn relayout_is_stable_with_rounding() {
327    let mut taffy = new_test_tree();
328    taffy.enable_rounding();
329
330    // <div style="width: 1920px; height: 1080px">
331    //     <div style="width: 100%; left: 1.5px">
332    //         <div style="width: 150px; justify-content: end">
333    //             <div style="min-width: 300px" />
334    //         </div>
335    //     </div>
336    // </div>
337
338    let inner =
339        taffy.new_leaf(Style { min_size: Size { width: length(300.), height: auto() }, ..Default::default() }).unwrap();
340    let wrapper = taffy
341        .new_with_children(
342            Style {
343                size: Size { width: length(150.), height: auto() },
344                justify_content: Some(JustifyContent::END),
345                ..Default::default()
346            },
347            &[inner],
348        )
349        .unwrap();
350    let outer = taffy
351        .new_with_children(
352            Style {
353                size: Size { width: percent(1.), height: auto() },
354                inset: Rect { left: length(1.5), right: auto(), top: auto(), bottom: auto() },
355                ..Default::default()
356            },
357            &[wrapper],
358        )
359        .unwrap();
360    let root = taffy
361        .new_with_children(
362            Style { size: Size { width: length(1920.), height: length(1080.) }, ..Default::default() },
363            &[outer],
364        )
365        .unwrap();
366
367    // Compute and assert initial layout.
368
369    taffy.compute_layout(root, Size::MAX_CONTENT).ok();
370    taffy.print_tree(root);
371
372    let initial_root_layout = taffy.layout(root).unwrap().clone();
373    assert_eq!(initial_root_layout.location.x, 0.0);
374    assert_eq!(initial_root_layout.location.y, 0.0);
375    assert_eq!(initial_root_layout.size.width, 1920.0);
376    assert_eq!(initial_root_layout.size.height, 1080.0);
377
378    let initial_outer_layout = taffy.layout(outer).unwrap().clone();
379    assert_eq!(initial_outer_layout.location.x, 2.0);
380    assert_eq!(initial_outer_layout.location.y, 0.0);
381    assert_eq!(initial_outer_layout.size.width, 1920.0);
382    assert_eq!(initial_outer_layout.size.height, 1080.0);
383
384    let initial_wrapper_layout = taffy.layout(wrapper).unwrap().clone();
385    assert_eq!(initial_wrapper_layout.location.x, 0.0);
386    assert_eq!(initial_wrapper_layout.location.y, 0.0);
387    assert_eq!(initial_wrapper_layout.size.width, 150.0);
388    assert_eq!(initial_wrapper_layout.size.height, 1080.0);
389
390    let initial_inner_layout = taffy.layout(inner).unwrap().clone();
391    assert_eq!(initial_inner_layout.location.x, -150.0);
392    assert_eq!(initial_inner_layout.location.y, 0.0);
393    assert_eq!(initial_inner_layout.size.width, 300.0);
394    assert_eq!(initial_inner_layout.size.height, 1080.0);
395
396    // Recompute and assert that new layout marks initial layout each time
397    for _ in 0..5 {
398        taffy.mark_dirty(root).ok();
399        taffy.compute_layout(root, Size::MAX_CONTENT).ok();
400        taffy.print_tree(root);
401
402        let root_layout = taffy.layout(root).unwrap();
403        assert_eq!(initial_root_layout.location.x, root_layout.location.x);
404        assert_eq!(initial_root_layout.location.y, root_layout.location.y);
405        assert_eq!(initial_root_layout.size.width, root_layout.size.width);
406        assert_eq!(initial_root_layout.size.height, root_layout.size.height);
407        let outer_layout = taffy.layout(outer).unwrap();
408        assert_eq!(initial_outer_layout.location.x, outer_layout.location.x);
409        assert_eq!(initial_outer_layout.location.y, outer_layout.location.y);
410        assert_eq!(initial_outer_layout.size.width, outer_layout.size.width);
411        assert_eq!(initial_outer_layout.size.height, outer_layout.size.height);
412        let wrapper_layout = taffy.layout(wrapper).unwrap();
413        assert_eq!(initial_wrapper_layout.location.x, wrapper_layout.location.x);
414        assert_eq!(initial_wrapper_layout.location.x, wrapper_layout.location.y);
415        assert_eq!(initial_wrapper_layout.size.width, wrapper_layout.size.width);
416        assert_eq!(initial_wrapper_layout.size.height, wrapper_layout.size.height);
417        let inner_layout = taffy.layout(inner).unwrap();
418        assert_eq!(initial_inner_layout.location.x, inner_layout.location.x);
419        assert_eq!(initial_inner_layout.location.y, inner_layout.location.y);
420        assert_eq!(initial_inner_layout.size.width, inner_layout.size.width);
421        assert_eq!(initial_inner_layout.size.height, inner_layout.size.height);
422    }
423}