Pruebas E2E modernas con Playwright
Pruebe su aplicación de Electron de principio a fin con Playwright, el sucesor moderno de Spectron, automatizando ventanas reales y comprobando el comportamiento de la interfaz.
Pruebas E2E modernas con Playwright es una lección gratuita de Electron Desktop App Development en CoddyKit. Esta es la lección 4 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Electron Desktop App Development, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Electron Desktop App Development incluye 4 lecciones en total.
Partes de esta lección aún no han sido traducidas y se muestran en inglés.
Why Playwright for Electron
Spectron is deprecated. Playwright has first-class Electron support and drives your real app like a user would.
Installing Playwright
Add Playwright as a dev dependency. Its test runner and Electron launcher come bundled.
npm install --save-dev @playwright/testLaunching the App
Use _electron.launch to start your packaged or source app under test control.
const { _electron: electron } = require('playwright');
const app = await electron.launch({ args: ['.'] });Getting the First Window
firstWindow() returns the renderer page so you can interact with the DOM.
const window = await app.firstWindow();
await window.waitForLoadState('domcontentloaded');Locating Elements
Use resilient locators based on roles and labels rather than brittle CSS selectors.
function selectorFor(role, name) {
return 'role=' + role + '[name="' + name + '"]';
}
console.log(selectorFor('button', 'Save'));Interacting With the UI
Click, type, and assert just like a user.
await window.fill('#title', 'My Note');
await window.click('text=Save');Assertions
Use expect with auto-waiting matchers so flaky timing issues disappear.
await expect(window.locator('.toast')).toHaveText('Saved');Evaluating in the Main Process
Playwright can run code in the main process via app.evaluate, letting you assert on app state.
const isPackaged = await app.evaluate(({ app }) => app.isPackaged);Taking Screenshots
Capture screenshots on failure to debug visually. Playwright does this automatically when configured.
await window.screenshot({ path: 'failure.png' });Closing Cleanly
Always close the app after each test to avoid leaked processes.
await app.close();Running in CI
Run E2E tests headlessly in CI on every push. Use a virtual display on Linux runners when needed.
Quick Check
Test your Playwright knowledge.
Recap
You learned modern E2E testing with Playwright: launching the app, grabbing windows, using resilient locators, asserting with auto-waiting matchers, evaluating main-process state, and running in CI.
Preguntas frecuentes
¿La lección «Pruebas E2E modernas con Playwright» es gratis?
Sí — el texto completo de «Pruebas E2E modernas con Playwright» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Electron Desktop App Development, actualiza a CoddyKit PRO. El curso de Electron Desktop App Development incluye 4 lecciones en total.
¿Qué aprenderé en «Pruebas E2E modernas con Playwright»?
Pruebe su aplicación de Electron de principio a fin con Playwright, el sucesor moderno de Spectron, automatizando ventanas reales y comprobando el comportamiento de la interfaz. Practicas Electron Desktop App Development con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar Electron Desktop App Development?
No se requiere experiencia previa. Electron Desktop App Development en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 4 de 4.
¿Cuánto tiempo toma la lección «Pruebas E2E modernas con Playwright»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de Electron Desktop App Development?
Sí. Cada lección de Electron Desktop App Development incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- Depuración de los procesos principal y de renderizado
- Pruebas unitarias con Spectron
- Flujos de pruebas de extremo a extremo
- Pruebas E2E modernas con Playwright