compare_element_alignment
Compare alignment and dimensions of two web elements. Checks edge and center alignment, width, and height, showing pass/fail and pixel differences for debugging layout issues.
Instructions
COMPARE TWO ELEMENTS: Get comprehensive alignment and dimension comparison in one call. Shows edge alignment (top, left, right, bottom), center alignment (horizontal, vertical), and dimensions (width, height). Perfect for debugging 'are these headers aligned?' or 'do these panels match?'. Returns all alignment info with ✓/✗ symbols and pixel differences. For parent-child centering, use inspect_dom() instead (automatically shows if children are centered in parent). More efficient than evaluate() with manual getBoundingClientRect() calculations.
Tool call template
Replace each placeholder with a value matching the input schema. Only required parameters are included; add optional parameters as needed.
{
"id": 1,
"jsonrpc": "2.0",
"method": "tools/call",
"params": {
"arguments": {
"selector1": "<selector1>",
"selector2": "<selector2>"
},
"name": "compare_element_alignment"
}
}Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| selector1 | Yes | CSS selector, text selector, or testid shorthand for the first element (e.g., 'testid:main-header', '#header') | |
| selector2 | Yes | CSS selector, text selector, or testid shorthand for the second element (e.g., 'testid:chat-header', '#secondary-header') |