Fix right click handler for tabs (#4130)

Also, some fun test helpers

Co-Authored-By: Mikayla <mikayla@zed.dev>

You can now use .debug_selector() to make it possible for tests to find
a given element,
and .debug_bounds() to find the coordinates of where it was painted.


Release Notes:

- (Added|Fixed|Improved) ...
([#<public_issue_number_if_exists>](https://github.com/zed-industries/community/issues/<public_issue_number_if_exists>)).

crates/ui/src/components/button/button_like.rs

@@ -293,7 +293,7 @@ impl ButtonSize {
 /// This is also used to build the prebuilt buttons.
 #[derive(IntoElement)]
 pub struct ButtonLike {
-    base: Div,
+    pub base: Div,
     id: ElementId,
     pub(super) style: ButtonStyle,
     pub(super) disabled: bool,

crates/ui/src/components/button/icon_button.rs

@@ -24,14 +24,16 @@ pub struct IconButton {
 
 impl IconButton {
     pub fn new(id: impl Into<ElementId>, icon: IconName) -> Self {
-        Self {
+        let mut this = Self {
             base: ButtonLike::new(id),
             shape: IconButtonShape::Wide,
             icon,
             icon_size: IconSize::default(),
             icon_color: Color::Default,
             selected_icon: None,
-        }
+        };
+        this.base.base = this.base.base.debug_selector(|| format!("ICON-{:?}", icon));
+        this
     }
 
     pub fn shape(mut self, shape: IconButtonShape) -> Self {

crates/ui/src/components/context_menu.rs

@@ -303,6 +303,7 @@ impl Render for ContextMenu {
                                         .w_full()
                                         .justify_between()
                                         .child(label_element)
+                                        .debug_selector(|| format!("MENU_ITEM-{}", label))
                                         .children(action.as_ref().and_then(|action| {
                                             KeyBinding::for_action(&**action, cx)
                                                 .map(|binding| div().ml_1().child(binding))

crates/ui/src/components/right_click_menu.rs

@@ -1,9 +1,9 @@
 use std::{cell::RefCell, rc::Rc};
 
 use gpui::{
-    overlay, AnchorCorner, AnyElement, Bounds, DismissEvent, DispatchPhase, Element, ElementId,
-    IntoElement, LayoutId, ManagedView, MouseButton, MouseDownEvent, ParentElement, Pixels, Point,
-    View, VisualContext, WindowContext,
+    overlay, AnchorCorner, AnyElement, BorrowWindow, Bounds, DismissEvent, DispatchPhase, Element,
+    ElementId, InteractiveBounds, IntoElement, LayoutId, ManagedView, MouseButton, MouseDownEvent,
+    ParentElement, Pixels, Point, View, VisualContext, WindowContext,
 };
 
 pub struct RightClickMenu<M: ManagedView> {
@@ -136,10 +136,14 @@ impl<M: ManagedView> Element for RightClickMenu<M> {
         let child_layout_id = element_state.child_layout_id.clone();
         let child_bounds = cx.layout_bounds(child_layout_id.unwrap());
 
+        let interactive_bounds = InteractiveBounds {
+            bounds: bounds.intersect(&cx.content_mask().bounds),
+            stacking_order: cx.stacking_order().clone(),
+        };
         cx.on_mouse_event(move |event: &MouseDownEvent, phase, cx| {
             if phase == DispatchPhase::Bubble
                 && event.button == MouseButton::Right
-                && bounds.contains(&event.position)
+                && interactive_bounds.visibly_contains(&event.position, cx)
             {
                 cx.stop_propagation();
                 cx.prevent_default();

crates/ui/src/components/tab.rs

@@ -37,8 +37,11 @@ pub struct Tab {
 
 impl Tab {
     pub fn new(id: impl Into<ElementId>) -> Self {
+        let id = id.into();
         Self {
-            div: div().id(id),
+            div: div()
+                .id(id.clone())
+                .debug_selector(|| format!("TAB-{}", id)),
             selected: false,
             position: TabPosition::First,
             close_side: TabCloseSide::End,