Skip to content

slate-browser.md

Latest commit

 

History

History
91 lines (67 loc) · 2.98 KB

slate-browser.md

File metadata and controls

91 lines (67 loc) · 2.98 KB
Raw

Slate Browser

slate-browser is Slate's browser proof harness. Use it to test editor behavior through Playwright with model, DOM, native selection, focus, screenshots, trace, clipboard, and replayable scenario assertions.

It is test infrastructure, not the product editing API. Application code should build editors with slate, slate-dom, slate-react, and extensions.

Install

npm install -D slate-browser @playwright/test

Use the matching command for pnpm, Yarn, or Bun when your project uses another package manager.

Imports

The package is subpath-only:

  • slate-browser/playwright for Playwright editor harnesses.
  • slate-browser/core for pure proof contracts, release-proof artifacts, classifiers, and selection serialization helpers.
  • slate-browser/browser for DOM selection snapshots and zero-width placeholder inspection in browser-capable test environments.
  • slate-browser/transports for device/browser proof-scope descriptors.

Do not import from slate-browser directly.

First Test

import { expect, test } from '@playwright/test'
import { openExample } from 'slate-browser/playwright'

test('types through the Slate browser path', async ({ page }) => {
  const editor = await openExample(page, 'plaintext', {
    ready: { editor: 'visible' },
  })

  await editor.focus()
  await editor.type('Hello from slate-browser')

  await editor.assert.text('Hello from slate-browser')
  await editor.assert.noDoubleSelectionHighlight()
  expect(await editor.get.selectedText()).toBe('')
})

openExample waits for the mounted editor-ready contract before actions run. Prefer editor.type(...), semantic selection helpers, clipboard helpers, and native event traces over raw Playwright DOM shortcuts when the claim is editor behavior.

Proof Contracts

Slate browser proof should usually assert more than model state:

  • model text or block text;
  • DOM/native selection endpoints when observable;
  • visible selection or no double-highlight;
  • focus ownership;
  • native event trace shape for input, paste, selection, or IME claims;
  • screenshot or JSON artifacts for bugs that need visual review;
  • follow-up typing after navigation, paste, undo, selection, or DOM repair.

Feature contracts group browser behavior families by the owning Slate feature area. Use them to keep example coverage honest without turning one manual route check into a fake global guarantee.

Transport Claims

slate-browser/transports classifies proof scope. A Playwright mobile viewport does not prove raw-device behavior. Appium descriptors close raw-device lanes only when the device gate runs. Proxy browser lanes are useful evidence, but they do not claim native mobile clipboard, human soft-keyboard, glide typing, or voice input.

Commands

bun run test:slate-browser
bun run test:slate-browser:core
bun run test:slate-browser:dom
bun run test:slate-browser:selection

Use focused Playwright specs for behavior routes and generated stress replay for portable editing failures.