Add a snapshot test for list items (rerun-io#8248)

Cargo.lock

@@ -6575,6 +6575,7 @@ dependencies = [
  "egui",
  "egui_commonmark",
  "egui_extras",
+ "egui_kittest",
  "egui_tiles",
  "once_cell",
  "parking_lot",

crates/viewer/re_ui/Cargo.toml

@@ -51,3 +51,7 @@ sublime_fuzzy.workspace = true
 eframe = { workspace = true, default-features = false, features = ["wgpu"] }
 egui_tiles.workspace = true
 rand.workspace = true
+
+
+[dev-dependencies]
+egui_kittest.workspace = true

crates/viewer/re_ui/tests/list_item_tests.rs

@@ -0,0 +1,205 @@
+use egui::Vec2;
+
+use re_ui::{list_item, UiExt as _};
+
+#[test]
+pub fn test_list_items_should_match_snapshot() {
+    let mut boolean = true;
+    let mut text = String::from("hello");
+    let mut color = [255, 255, 0, 255];
+
+    let mut test_code = |ui: &mut egui::Ui| {
+        ui.list_item()
+            .show_hierarchical(ui, list_item::LabelContent::new("Default"));
+
+        ui.list_item()
+            .interactive(false)
+            .show_hierarchical(ui, list_item::LabelContent::new("Not interactive item"));
+
+        ui.list_item()
+            .force_hovered(true)
+            .show_hierarchical(ui, list_item::LabelContent::new("Perma-hovered item"));
+
+        ui.list_item().show_hierarchical_with_children(
+            ui,
+            ui.make_persistent_id("label content features"),
+            true,
+            list_item::LabelContent::new("LabelContent features:"),
+            |ui| {
+                ui.list_item()
+                    .show_hierarchical(ui, list_item::LabelContent::new("LabelContent"));
+
+                ui.list_item().show_hierarchical(
+                    ui,
+                    list_item::LabelContent::new("LabelContent with icon")
+                        .with_icon(&re_ui::icons::SPACE_VIEW_TEXT),
+                );
+
+                ui.list_item().show_hierarchical(
+                    ui,
+                    list_item::LabelContent::new("LabelContent with custom icon code")
+                        .with_icon_fn(|ui, rect, visuals| {
+                            ui.painter().circle(
+                                rect.center(),
+                                rect.width() / 2.0,
+                                visuals.fg_stroke.color,
+                                egui::Stroke::NONE,
+                            );
+                        }),
+                );
+
+                ui.list_item().show_hierarchical(
+                    ui,
+                    list_item::LabelContent::new("Fake radio button").with_icon_fn(
+                        |ui, rect, _visuals| {
+                            let mut ui = ui.new_child(egui::UiBuilder::new().max_rect(rect));
+                            ui.re_radio_value(&mut boolean, true, "");
+                        },
+                    ),
+                );
+
+                ui.list_item().show_hierarchical(
+                    ui,
+                    list_item::LabelContent::new("Fake radio button").with_icon_fn(
+                        |ui, rect, _visuals| {
+                            let mut ui = ui.new_child(egui::UiBuilder::new().max_rect(rect));
+                            ui.re_radio_value(&mut boolean, false, "");
+                        },
+                    ),
+                );
+
+                ui.list_item()
+                    .show_hierarchical(
+                        ui,
+                        list_item::LabelContent::new("LabelContent with custom styling")
+                            .subdued(true)
+                            .italics(true)
+                            .with_icon(&re_ui::icons::SPACE_VIEW_2D),
+                    )
+                    .on_hover_text("The styling applies to the icon.");
+
+                ui.list_item()
+                    .show_hierarchical(
+                        ui,
+                        list_item::LabelContent::new("LabelContent with LabelStyle")
+                            .label_style(re_ui::LabelStyle::Unnamed)
+                            .with_icon(&re_ui::icons::SPACE_VIEW_2D),
+                    )
+                    .on_hover_text("The LabelStyle doesn't apply to the icon.");
+
+                ui.list_item().show_hierarchical(
+                    ui,
+                    list_item::LabelContent::new("LabelContent with buttons").with_buttons(|ui| {
+                        ui.small_icon_button(&re_ui::icons::ADD)
+                            | ui.small_icon_button(&re_ui::icons::REMOVE)
+                    }),
+                );
+
+                ui.list_item().show_hierarchical(
+                    ui,
+                    list_item::LabelContent::new("LabelContent with buttons (always shown)")
+                        .with_buttons(|ui| {
+                            ui.small_icon_button(&re_ui::icons::ADD)
+                                | ui.small_icon_button(&re_ui::icons::REMOVE)
+                        })
+                        .always_show_buttons(true),
+                );
+            },
+        );
+
+        ui.list_item().show_hierarchical_with_children(
+            ui,
+            ui.make_persistent_id("property content features"),
+            true,
+            list_item::PropertyContent::new("PropertyContent features:")
+                .value_text("bunch of properties"),
+            |ui| {
+                // By using an inner scope, we allow the nested properties to not align themselves
+                // to the parent property, which in this particular case looks better.
+                list_item::list_item_scope(ui, "inner_scope", |ui| {
+                    ui.list_item().show_hierarchical(
+                        ui,
+                        list_item::PropertyContent::new("Bool").value_bool(boolean),
+                    );
+
+                    ui.list_item().show_hierarchical(
+                        ui,
+                        list_item::PropertyContent::new("Bool (editable)")
+                            .value_bool_mut(&mut boolean),
+                    );
+
+                    ui.list_item().show_hierarchical(
+                        ui,
+                        list_item::PropertyContent::new("Text").value_text(&text),
+                    );
+
+                    ui.list_item().show_hierarchical(
+                        ui,
+                        list_item::PropertyContent::new("Text (editable)")
+                            .value_text_mut(&mut text),
+                    );
+
+                    ui.list_item().show_hierarchical(
+                        ui,
+                        list_item::PropertyContent::new("Color")
+                            .with_icon(&re_ui::icons::SPACE_VIEW_TEXT)
+                            .action_button(&re_ui::icons::ADD, || {
+                                re_log::warn!("Add button clicked");
+                            })
+                            .value_color(&color),
+                    );
+
+                    ui.list_item().show_hierarchical(
+                        ui,
+                        list_item::PropertyContent::new("Color (editable)")
+                            .with_icon(&re_ui::icons::SPACE_VIEW_TEXT)
+                            .action_button(&re_ui::icons::ADD, || {
+                                re_log::warn!("Add button clicked");
+                            })
+                            .value_color_mut(&mut color),
+                    );
+                });
+            },
+        );
+
+        ui.list_item().show_hierarchical_with_children(
+            ui,
+            ui.make_persistent_id("other features"),
+            true,
+            list_item::LabelContent::new("Other contents:"),
+            |ui| {
+                ui.list_item().show_hierarchical(
+                    ui,
+                    list_item::DebugContent::default()
+                        .label("DebugContent just shows the content area"),
+                );
+
+                ui.list_item().show_hierarchical(
+                    ui,
+                    list_item::CustomContent::new(|ui, context| {
+                        ui.ctx().debug_painter().debug_rect(
+                            context.rect,
+                            egui::Color32::LIGHT_RED,
+                            "CustomContent delegates to a closure",
+                        );
+                    }),
+                )
+            },
+        );
+    };
+
+    let mut harness = egui_kittest::Harness::builder()
+        .with_size(Vec2::new(700.0, 700.0))
+        .build(|ctx| {
+            egui::SidePanel::right("right_panel").show(ctx, |ui| {
+                ui.set_width(650.0);
+                ui.set_max_width(650.0);
+                re_ui::apply_style_and_install_loaders(ui.ctx());
+                list_item::list_item_scope(ui, "list_item_scope", &mut test_code);
+            });
+        });
+
+    harness.run();
+
+    harness.wgpu_snapshot("list_items");
+}