Show corresponding window/widget/view in UIElement tree when clicking on a UI element.

components/ui_devtools/views/ui_devtools_dom_agent.cc

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 #include "components/ui_devtools/views/ui_devtools_dom_agent.h"
 
 #include "components/ui_devtools/devtools_server.h"
+#include "components/ui_devtools/views/ui_devtools_overlay_agent.h"
 #include "components/ui_devtools/views/ui_element.h"
 #include "components/ui_devtools/views/view_element.h"
 #include "components/ui_devtools/views/widget_element.h"
 #include "components/ui_devtools/views/window_element.h"
 #include "third_party/skia/include/core/SkColor.h"
 #include "ui/aura/client/screen_position_client.h"
 #include "ui/aura/env.h"
 #include "ui/aura/window.h"
 #include "ui/aura/window_tree_host.h"
 #include "ui/display/display.h"
 #include "ui/display/screen.h"
 #include "ui/views/background.h"
 #include "ui/views/border.h"
+#include "ui/views/pointer_watcher.h"
 #include "ui/views/view.h"
 #include "ui/views/widget/widget.h"
 #include "ui/wm/core/window_util.h"
 
 namespace ui_devtools {
 namespace {
 
 using namespace ui_devtools::protocol;
 // TODO(mhashmi): Make ids reusable
 
@@ skipping 76 matching lines @@
                                         .setNodeId(root->node_id())
                                         .setNodeName(root->GetTypeName())
                                         .setNodeType(kDomElementNodeType)
                                         .setAttributes(GetAttributes(root))
                                         .build();
   node->setChildNodeCount(static_cast<int>(children->length()));
   node->setChildren(std::move(children));
   return node;
 }
 
+void FindElement(UIElement* root,
+                 const int x,
+                 const int y,

[sadrul, 2017/07/13 20:17:20]

Take a const gfx::Point& as the location input.

[thanhph, 2017/07/14 16:59:46]

Done.

+                 int* min_bounds,
+                 int* element_id) {
+  LOG(ERROR) << "FindElement root->node_id(): " << root->node_id();
+  gfx::Rect bounds;
+  for (auto* child : root->children()) {
+    child->GetBounds(&bounds);
+    if (bounds.x() <= x && bounds.y() <= y && bounds.right() >= x &&
+        bounds.bottom() >= y &&

[sadrul, 2017/07/13 20:17:20]

Use gfx::Rect::Contains(gfx::Point)

[thanhph, 2017/07/14 16:59:46]

Done.

+        (*min_bounds) > bounds.width() + bounds.height()) {
+      *element_id = child->node_id();
+      *min_bounds = bounds.width() + bounds.height();

[sadrul, 2017/07/13 20:17:20]

I don't understand why you need |min_bounds| here.

[thanhph, 2017/07/14 16:59:46]

Acknowledged. We just select the deepest element in pre-order during DFS. I
renamed the function to FindTighterBoundUIElement().

+      LOG(ERROR) << "*min_bounds: " << *min_bounds;
+      LOG(ERROR) << "*element_id: " << *element_id;
+    }
+    FindElement(child, x, y, min_bounds, element_id);
+  }
+}
+
 }  // namespace
 
-UIDevToolsDOMAgent::UIDevToolsDOMAgent() : is_building_tree_(false) {
+UIDevToolsDOMAgent::UIDevToolsDOMAgent(UIDevToolsOverlayAgent* overlay_agent)
+    : overlay_agent_(overlay_agent), is_building_tree_(false) {
   aura::Env::GetInstance()->AddObserver(this);
 }
 
 UIDevToolsDOMAgent::~UIDevToolsDOMAgent() {
   aura::Env::GetInstance()->RemoveObserver(this);
   Reset();
 }
 
 ui_devtools::protocol::Response UIDevToolsDOMAgent::disable() {
   Reset();
   return ui_devtools::protocol::Response::OK();
 }
 
 ui_devtools::protocol::Response UIDevToolsDOMAgent::getDocument(
     std::unique_ptr<ui_devtools::protocol::DOM::Node>* out_root) {
   *out_root = BuildInitialTree();
   return ui_devtools::protocol::Response::OK();
 }
 
 ui_devtools::protocol::Response UIDevToolsDOMAgent::highlightNode(
     std::unique_ptr<ui_devtools::protocol::DOM::HighlightConfig>
         highlight_config,
     ui_devtools::protocol::Maybe<int> node_id) {
   return HighlightNode(std::move(highlight_config), node_id.fromJust());
 }
 
+ui_devtools::protocol::Response UIDevToolsDOMAgent::setInspectMode(
+    ui_devtools::protocol::Maybe<String> mode,
+    std::unique_ptr<ui_devtools::protocol::DOM::HighlightConfig>
+        highlight_config,
+    ui_devtools::protocol::Maybe<int> node_id) {
+  LOG(ERROR) << __PRETTY_FUNCTION__;
+  if (mode.fromJust().compare("searchForUAShadowDOM") == 0)
+    aura::Env::GetInstance()->PrependPreTargetHandler(this);
+  else if (mode.fromJust().compare("none") == 0)
+    aura::Env::GetInstance()->RemovePreTargetHandler(this);
+
+  return ui_devtools::protocol::Response::OK();
+}
+
 ui_devtools::protocol::Response UIDevToolsDOMAgent::hideHighlight() {
   if (widget_for_highlighting_ && widget_for_highlighting_->IsVisible())
     widget_for_highlighting_->Hide();
   return ui_devtools::protocol::Response::OK();
 }
 
 void UIDevToolsDOMAgent::OnUIElementAdded(UIElement* parent, UIElement* child) {
   // When parent is null, only need to update |node_id_to_ui_element_|.
   if (!parent) {
     node_id_to_ui_element_[child->node_id()] = child;
@@ skipping 35 matching lines @@
 void UIDevToolsDOMAgent::OnUIElementBoundsChanged(UIElement* ui_element) {
   for (auto& observer : observers_)
     observer.OnNodeBoundsChanged(ui_element->node_id());
 }
 
 bool UIDevToolsDOMAgent::IsHighlightingWindow(aura::Window* window) {
   return widget_for_highlighting_ &&
          GetWidgetFromWindow(window) == widget_for_highlighting_.get();
 }
 
+void UIDevToolsDOMAgent::OnMouseEvent(ui::MouseEvent* event) {
+  if (!window_element_root_)
+    return;
+
+  if (event->type() == ui::ET_MOUSE_PRESSED) {
+    // TODO(thanhph): needs to disable the highlighting inspection arrow.
+    frontend()->setInspectMode(Maybe<ui_devtools::String>("none"));
+    overlay_agent_->setInspectMode(
+        "none", protocol::Maybe<protocol::Overlay::HighlightConfig>());
+    aura::Env::GetInstance()->RemovePreTargetHandler(this);
+    return;
+  }
+  if (event->type() != ui::ET_MOUSEWHEEL)
+    return;
+
+  // maxmium of width + height of a screen.
+  int min_bounds = 1000000;
+
+  // Node id of the element whose bounds contain the mouse pointer location.
+  int element_id = 1;
+  FindElement(window_element_root_.get(), event->location().x(),

[sadrul, 2017/07/13 20:17:20]

event->location() is in the coordinate space of |event->target()| window, not
the root window. So using |window_element_root_.get()| here is wrong. You should
either:

 1. Send event->root_location() to FindElement(). or,
 2. Find the UIElement corresponding to event->target(), and send that (with
event->location()) to FindElement().

2 is the better option. So let's try that first.

[thanhph, 2017/07/14 16:59:46]

I picked the 1st approach.

+              event->location().y(), &min_bounds, &element_id);
+  LOG(ERROR) << "Find - event->location().x():" << event->location().x()
+             << "event->location().y(): " << event->location().y();
+  gfx::Rect bounds1;
+  node_id_to_ui_element_[element_id]->GetBounds(&bounds1);
+  LOG(ERROR) << "bounds1 node_id_to_ui_element_[element_id]: " << bounds1.x()
+             << " - " << bounds1.y() << " - " << bounds1.right() << " - "
+             << bounds1.bottom();
+  frontend()->nodeHighlightRequested(element_id);
+}
+
 void UIDevToolsDOMAgent::AddObserver(UIDevToolsDOMAgentObserver* observer) {
   observers_.AddObserver(observer);
 }
 
 void UIDevToolsDOMAgent::RemoveObserver(UIDevToolsDOMAgentObserver* observer) {
   observers_.RemoveObserver(observer);
 }
 
 UIElement* UIDevToolsDOMAgent::GetElementFromNodeId(int node_id) {
   return node_id_to_ui_element_[node_id];
@@ skipping 184 matching lines @@
       RGBAToSkColor(highlight_config->getContentColor(nullptr));
   UpdateHighlight(window_and_bounds, content_color, border_color);
 
   if (!widget_for_highlighting_->IsVisible())
     widget_for_highlighting_->Show();
 
   return ui_devtools::protocol::Response::OK();
 }
 
 }  // namespace ui_devtools