Keyboard

The Keyboard module in Spartify offers streamlined support for keyboard interactions. But because Playwright and Cypress handle keyboard events differently, we’ll direct users to specialized sections depending on their chosen tool.

Detecting Your Tooling

Proposed redirect logic (in your guide):

if (framework === 'playwright') {
  redirect('https://playwright.dev/docs/api/class-keyboard');
} else (framework === 'cypress') {
  redirect('https://docs.cypress.io/api/commands/type');
  redirect('https://docs.cypress.io/api/cypress-api/keyboard-api');
}

Keyboard with Playwright

Path:

https://playwright.dev/docs/api/class-keyboard

Essential points:

Page.keyboard API — use .press(), .type(), .down(), and .up() for granular control

await page.keyboard.type('Hello World');
await page.keyboard.press('Shift+KeyA');

Modifier & platform handling, e.g. using ControlOrMeta or platform-based keys

await page.keyboard.press('ControlOrMeta+A');

Delay options, like { delay: 100 }, to mimic human typing

Why redirect? Playwright’s API is distinct, enabling complex workflows like multiple tabs, simultaneous key holds, or platform-specific modifiers .

Keyboard with Cypress

Path:

https://docs.cypress.io/api/commands/type

https://docs.cypress.io/api/cypress-api/keyboard-api

Key details to cover::

Use .type() to simulate key presses or text entry

cy.get('input').type('{enter}');
cy.get('textarea').type('Hello{enter}');
cy.focused().click();

Troubleshooting tips:

Ensure the element is focus()ed;

Remove .tab() chaining—it yields the previous subject

Note that Cypress handles browser integration and auto-waits differently than Playwright, so best practices diverge.

Common Fallback / Overview Section

If neither Playwright nor Cypress is detected:

Explain general usage of the Spartify Keyboard adapter, or mention your internal cross-framework APIs.

Reference standards like KeyboardEvent from the DOM (e.g., to explain keydown vs keypress vs keyup).