A tool to "Select an element in the page to inspect it"

Is your feature request related to a problem? Please describe.

Select an element in the page to inspect it could arguably be the most used Chrome Dev Tools "tool".

This allows the (human) programmer to focus on just that part of the DOM he is interested in. On the other hand, most tools we put in the hands of AI agents today always give back the full DOM. The AI is then forced to first filter out all the irrelevant parts leading to the context window filling up extremely fast, and the agent loop slowing down a lot.

Describe the solution you'd like

If this MCP server could implement something like Select an element in the page to inspect it, we can give the AI agents the same efficient method of inspecting the DOM.

I would imagine the AI can send an annotated screenshot as input; with a suitably coloured bounding box to indicate the region of the page the AI hopes to inspect.

Describe alternatives you've considered

Alternative solutions include a tool that allows the AI to specify a CSS selector, and the tool will return the DOM rooted at the corresponding element (instead of the whole page). But this does mean the selector be identified somehow first, which may not be easy. Working with a screenshot and placing a bounding box on the region of interest could be markedly more easy in certain cases.

Additional context

The Select an element in the page to inspect it tool in Chrome Dev Tools:

Start by reviewing the repository’s existing DOM inspection tools and screenshot inputs. Define how an annotated screenshot or bounding box maps to a page region, then verify that the resulting tool returns only the selected element’s DOM rather than the full page.