# Compare two DOMRects for size and position match

Compare x, y, width and height exactly.

Canonical: https://1loc.dev/dom/compare-two-dom-rects-for-size-and-position-match/
Version: 1.0.0
Runtime: JavaScript · Node.js 22 / modern browsers
Verification: Local fixtures; no external services
Updated: 2026-10-28

## Implementation

```javascript
function sameRect({ a, b }) { return ['x', 'y', 'width', 'height'].every(key => a[key] === b[key]); }
```

## Input

```json
{
  "a": {
    "x": 0,
    "y": 0,
    "width": 100,
    "height": 200
  },
  "b": {
    "x": 0,
    "y": 0,
    "width": 100,
    "height": 200
  }
}
```

## Expected output

```json
true
```

## Edge case

Input:
```json
{
  "a": {
    "x": 0,
    "y": 0,
    "width": 100,
    "height": 200
  },
  "b": {
    "x": 0,
    "y": 0.5,
    "width": 100,
    "height": 200
  }
}
```
Output:
```json
false
```

## Limits

- Exact comparison. Layout coordinates are often fractional, as the edge case shows; compare rendered positions with a tolerance such as Math.abs(a - b) < 0.5.
- The original compared top and left, which plain objects lack.

The lab validates types and size before calling this function. Add equivalent validation at your own trust boundary.

## Source and license

Original: https://github.com/phuocng/1loc/blob/14b481cf60dff1620ab1bb99a43b1f68068cdd9b/contents/compare-two-dom-rects-for-size-and-position-match.mdx
Author: Nguyen Huu Phuoc and original contributors
Contributors: See original repository history
Source commit: 14b481cf60dff1620ab1bb99a43b1f68068cdd9b
Copyright (c) 2020 phuoc-ng
License: MIT — https://1loc.dev/licenses/
Maintainer: Oveyon
Modifications: Compares x and y instead of top and left so plain JSON rects work; runs in the lab. Original MDX retained as inert source evidence.
