# io.github.vola-trebla/playwright-spatial-layout-mcp (npm · playwright-spatial-layout-mcp)

MCP server that gives AI agents geometric spatial awareness of web page layouts using Playwright

- Trust score: 70/100 (medium)
- Change this week: +24
- Registry status: active
- Liveness: live
- Owner verified: no
- Last scored: 2026-08-03

## Components

- npm · `playwright-spatial-layout-mcp`: 70/100 (this document), [markdown](https://verifymcp.io/servers/vola-trebla-playwright-spatial-layout-mcp/playwright-spatial-layout-mcp.md), [page](https://verifymcp.io/servers/vola-trebla-playwright-spatial-layout-mcp/playwright-spatial-layout-mcp)

## Channel facts

- Registry: `npm`
- Package: `playwright-spatial-layout-mcp`
- Version: `0.2.0`
- Transport: `stdio`

## Trust breakdown

How this component scores in each security and reliability category. Every signal is checked automatically from public evidence about the published package, including repeated runs of it in an isolated sandbox, and we only credit what we can confirm. Scores are 0–100 per category. Scoring method: https://verifymcp.io/docs/scoring (what has changed: https://verifymcp.io/docs/scoring/changelog)

Scored 2026-08-03.

- **Supply Chain Security**: 87/100
  - No malware found by supply-chain analysis.
  - Only part of the dependency tree could be resolved (97 of 101), so this covers what we could see, not the whole tree.
  - No install/post-install scripts declared.
  - Only part of the dependency tree could be resolved (97 of 101), so this covers what we could see, not the whole tree.
- **Provenance & Transparency**: 45/100
  - Source repository is publicly reachable at the declared URL.
  - Provenance check failed: no build-provenance attestation is published.
  - Clear OSI-approved license (MIT).
  - Actively maintained (last published 76 days ago).
  - Disclosure check failed: no security disclosure policy was found in the source repository.
- **Schema Quality & AI Usability**: 81/100
  - AI-judged instruction clarity (excellent).
  - Tool/resource definitions use about 655 tokens (~109/item across 6 items; 6 tools + 0 resources), lean.
  - Usage-examples check failed: none of the tools include examples.
- **Stability & Change Management**: 23/100
  - Stability observed for 7 of 30 days with no destabilising changes; credit accrues until the full window elapses.
- **Tool Coverage**: 100/100
  - 100% of tools have a non-trivial description (not blank, and not just the tool's name).
  - 100% of tool parameters carry a description.
- **Capabilities**: 100/100
  - Implements a supported MCP spec version (2025-11-25); the latest is 2026-07-28.

## Install

### Claude

```bash
claude mcp add vola-trebla-playwright-spatial-layout-mcp -- npx -y playwright-spatial-layout-mcp
```

### Codex

```bash
codex mcp add vola-trebla-playwright-spatial-layout-mcp -- npx -y playwright-spatial-layout-mcp
```

### opencode

```json
{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "vola-trebla-playwright-spatial-layout-mcp": {
      "type": "local",
      "command": [
        "npx",
        "-y",
        "playwright-spatial-layout-mcp"
      ],
      "enabled": true
    }
  }
}
```

### OpenClaw

```bash
openclaw mcp add vola-trebla-playwright-spatial-layout-mcp --command npx --arg -y --arg playwright-spatial-layout-mcp
```

### Hermes

```yaml
mcp_servers:
  vola-trebla-playwright-spatial-layout-mcp:
    command: "npx"
    args: ["-y", "playwright-spatial-layout-mcp"]
```

### Other

```json
{
  "mcpServers": {
    "vola-trebla-playwright-spatial-layout-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "playwright-spatial-layout-mcp"
      ]
    }
  }
}
```

## Changelog

Every change recorded for this component, newest first. Days that predate change tracking, or that we cannot explain, say so: "we were watching and nothing happened" and "we were not watching" are different claims.

### 2026-08-03 (score 70, +4)

- [functional improvement] Stability: unverified → 0.23

### 2026-08-02 (score 66, +45)

- [security regression] Provenance: unverified → fail
- [security improvement] Install scripts: unverified → pass
- [security improvement] Known CVEs: unverified → partial
- [security improvement] Malware scan: unverified → pass
- [security] Stability: Stability not yet verified: not enough scan history yet (needs a 30-day window).
- [functional regression] Security disclosure: fail → unverified
- [functional regression] Tool coverage: 100 → unverified
- [functional improvement] Schema quality: unverified → excellent
- [functional improvement] License: unverified → pass
- [functional improvement] Dependency health: unverified → partial
- [functional improvement] Maintenance: unverified → pass
- [functional improvement] MCP protocol: unverified → pass
- [functional] First check of Schema quality: unverified
- [functional] Licence: MIT

### 2026-08-01 (score 21, −5)

- [security] Stability: Stability not yet verified: we do not have a sandbox capture of the MCP schema this version of the package serves yet.
- [functional regression] Capabilities: pass → unverified

### 2026-07-31 (score 26, −2)

- [functional] We updated how we score, so this day's move reflects our rubric, not a change to the server

### 2026-07-30 (score 28, −18)

- [security regression] Malware scan: pass → unverified

### 2026-07-27 (score 46)

First indexed and scored.

## MCP tools (6)

### `extract_bounding_boxes` (~96 tokens)

Returns the geometric position, size, z-index, and viewport visibility for one or more DOM elements. Use to answer: where exactly on screen is this element? Is it visible? Is it off-screen?

Input parameters:

- `selectors` (array, required): CSS selectors or Playwright locator strings
- `url` (string, required): URL of the page to analyze
- `viewport` (object): Viewport size (default: 1280×720)

### `detect_visual_occlusion` (~121 tokens)

Checks if one element physically overlaps another by computing the intersection of their bounding boxes. Use to answer: is this button hidden under a sticky header? Does the cookie banner block the CTA?

Input parameters:

- `overlay_selector` (string, required): The element that might be on top (e.g., the sticky header)
- `target_selector` (string, required): The element that might be occluded (e.g., the button)
- `url` (string, required): URL of the page to analyze
- `viewport` (object): Viewport size (default: 1280×720)

### `verify_spatial_relationships` (~107 tokens)

Validates a set of spatial layout rules — e.g. 'nav must be above hero', 'sidebar must be left of content'. Returns pass/fail per rule with a human-readable reason. Use to answer: does the page layout match the design specification?

Input parameters:

- `rules` (array, required): List of spatial rules to validate
- `url` (string, required): URL of the page to analyze
- `viewport` (object): Viewport size (default: 1280×720)

### `compute_viewport_reflow` (~100 tokens)

Measures how element positions and sizes change across multiple viewport sizes. Use to answer: does the layout break on mobile? Which elements shift most when resizing?

Input parameters:

- `selectors` (array, required): CSS selectors to track across viewports
- `url` (string, required): URL of the page to analyze
- `viewports` (array, required): Viewport sizes to compare — e.g. [{width:375,height:812},{width:1280,height:720}]

### `calculate_perceptual_contrast` (~128 tokens)

Measures color contrast between a text element and its background using both WCAG 2.x and APCA (WCAG 3.0 draft) formulas simultaneously. Use to answer: does this text pass accessibility contrast requirements? Is it actually readable even if it technically passes the legacy formula?

Input parameters:

- `background_selector` (string, required): CSS selector for the background element
- `text_selector` (string, required): CSS selector for the text element
- `url` (string, required): URL of the page to analyze
- `viewport` (object): Viewport size (default: 1280×720)

### `verify_stacking_context` (~103 tokens)

Reveals the full CSS stacking context chain for an element — which ancestors create new stacking contexts and why. Use to answer: why is my z-index:9999 element still behind a modal? Does this element create its own stacking context?

Input parameters:

- `selector` (string, required): CSS selector for the element to inspect
- `url` (string, required): URL of the page to analyze
- `viewport` (object): Viewport size (default: 1280×720)

## Diagnostics

Captured diagnostic sections: Provenance, Dependencies. The full working is on the page: https://verifymcp.io/servers/vola-trebla-playwright-spatial-layout-mcp/playwright-spatial-layout-mcp#diagnostics

## Score history

- 2026-08-03: 70
- 2026-08-02: 66
- 2026-08-01: 21
- 2026-07-31: 26
- 2026-07-30: 28
- 2026-07-28: 46
- 2026-07-27: 46

## Links

- npm package: https://www.npmjs.com/package/playwright-spatial-layout-mcp
- Socket report: https://socket.dev/npm/package/playwright-spatial-layout-mcp
- Repository: https://github.com/vola-trebla/playwright-spatial-layout-mcp
- Changelog RSS feed: https://verifymcp.io/servers/vola-trebla-playwright-spatial-layout-mcp/playwright-spatial-layout-mcp/changelog.xml
- Changelog JSON feed: https://verifymcp.io/servers/vola-trebla-playwright-spatial-layout-mcp/playwright-spatial-layout-mcp/changelog.json
- HTML version of this page: https://verifymcp.io/servers/vola-trebla-playwright-spatial-layout-mcp/playwright-spatial-layout-mcp