Contenido del curso
Roberto Carlos González Castro
Moises Abel Avila Garcia
Martín González
Moises Abel Avila Garcia
Oscar Iboy
Luis Jhordy Mamani Arias
Roberto Carlos González Castro
Moises Abel Avila Garcia
Luis Campos
Hernan Dario Carvajal Robledo
Moises Abel Avila Garcia
Seria bueno, dejar conceptos claves a lo largo de todos los videos en la zona de recursos para poder guardarlos y tenerlos presente para futuras referencias.
es buena idea
Si alguien mas tuvo problemas con las dependencias pueden usar el flag a al istalar de esta manera:
npm i --save-dev jest-image-snapshot --legacy-peer-deps
gracias
gracias
**Para quien lo quiera, no olviden instalar la librería mencionada **
const puppeteer = require('puppeteer'); const { toMatchImageSnapshot } = require('jest-image-snapshot') expect.extend ({ toMatchImageSnapshot }) describe('Visual test', () => { let browser; let page; beforeAll(async () => { browser = await puppeteer.launch({ headless: false, defaultViewport: null, }); page = await browser.newPage() await page.goto('https://platzi.com', { waitUntil: 'networkidle0' }); }, 10000); afterAll(async () => { await browser.close(); }); test ('Snapshot de toda la pagina', async () =>{ await page.waitForSelector('img') const screenshot = await page.screenshot() expect(screenshot).toMatchImageSnapshot() },350000); })
Aqui un poco mas de informacion sobre el uso de expect.extend: https://jestjs.io/es-ES/docs/expect#expectextendmatchers
gracias
La mejor clase que he visto hasta ahora !
El visual testing ayuda a detectar diferencias inesperadas en la interfaz de usuario, como cambios de estilo o disposición de elementos. Al comparar capturas de pantalla de la UI en diferentes estados o entornos, se asegura que los cambios de código no alteren negativamente la apariencia de la aplicación. Esto es crucial para mantener la consistencia visual y la experiencia del usuario.
exelente curso
