Skip to content

test(editorjs): add Playwright e2e suite and propose ARIA semantics c…#187

Open
gohabereg wants to merge 1 commit into
feat/editorjs-bundle-packagefrom
test/editorjs-e2e-and-aria-openspec
Open

test(editorjs): add Playwright e2e suite and propose ARIA semantics c…#187
gohabereg wants to merge 1 commit into
feat/editorjs-bundle-packagefrom
test/editorjs-e2e-and-aria-openspec

Conversation

@gohabereg

Copy link
Copy Markdown
Member

Why

@editorjs/editorjs had no end-to-end coverage exercising a real browser. Writing that coverage also surfaced that @editorjs/ui and the paragraph tool emit zero ARIA roles/names, forcing brittle CSS-class selectors instead of getByRole/getByLabel.

Stacked on #183 — the e2e fixture imports @editorjs/editorjs's src/index.ts, which only exists on feat/editorjs-bundle-package. Base this PR against that branch, not main.

What Changes

  • New Playwright e2e setup for @editorjs/editorjs: playwright.config.ts + a Vite-served fixture (e2e/fixtures/) that mounts the real bundle from src/, no build step required.
  • Three tests (e2e/tests/editor.spec.ts): initial paragraph render, typing into a block, bolding selected text via the inline toolbar.
  • e2e/README.md documents a gotcha: locator.press()/locator.selectText() call element.focus() programmatically and desync Editor.js's native caret tracking — tests must drive input via real click() + page.keyboard.
  • e2e/cypress-test-inventory.md: behavior inventory carried over from the v2 Cypress suite, for future e2e coverage planning.
  • Lint/tsconfig/.gitignore updated for the new e2e/ dir and Playwright artifacts; test:e2e / test:e2e:ui scripts added.
  • New OpenSpec change add-editor-aria-semantics (proposal only, not yet implemented): proposes ARIA roles/names for BlocksUI, block wrappers, the paragraph tool, ToolbarUI, ToolboxUI, and inline toolbar popover items, so tests (and real assistive tech) can eventually use getByRole/getByLabel.

Verification

  • yarn lint:fix clean.
  • yarn test:e2e — 3/3 passing locally against Chromium.

Known gap

test:e2e is not yet wired into CI (.github/workflows/editorjs.yml / package-check.yml only run lint/unit-tests/build, and no workflow in the repo installs Playwright browsers). Left out of this PR intentionally — flagged here as follow-up work.

…hange

Adds a Playwright e2e setup for @editorjs/editorjs (Vite-served fixture
mounting the real bundle from src/, no build step) covering paragraph
rendering, typing, and inline-toolbar bold. Documents a gotcha where
locator.press()/selectText() desync Editor.js's native caret tracking.

Writing these tests surfaced that @editorjs/ui and the paragraph tool
emit no ARIA roles/names anywhere, forcing CSS-class selectors instead
of getByRole/getByLabel. Proposes openspec change
add-editor-aria-semantics to close that gap.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
@github-actions

Copy link
Copy Markdown

Unit Tests

Package Coverage Delta
@editorjs/editorjs 100% 0% ⚪️

Mutation Tests

Package Mutation score Dashboard URL

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant