Emulación de dispositivos

Curso Avanzado de Automatización de Pruebas con Puppeteer

Contenido del curso

Para quién es este curso?

1
¿Para quién es este curso?
04:07 min

Conceptos Avanzados

Creando nuestro propio framework

BDD

CI/CD

23
Configurando Jenkins con nuestras pruebas y creando reportes
16:33 min

Conclusion del curso

24
Sigue aprendiendo
02:07 min

Tomar examen

Cursos Empresas Blog Live Conf Eventos Precios

0:0014:26

Emulación de dispositivos

Curso Avanzado de Automatización de Pruebas con Puppeteer

Clase 2 de 24

Clase 2 / 24

Mario Alexander Vargas Celis

Hace 2 años

Mi codigo

const puppeteer = require("puppeteer")
const { KnownDevices } = require('puppeteer');

describe("Emulando informacion",()=>{
    let browser
    let page

    beforeAll(async()=>{
        browser = await puppeteer.launch({
            headless:false,
            defaultViewport: null, 
            //slowMo: 500
        });

        page = await browser.newPage();
        await page.goto("https://platzi.com", {waitUntil: "networkidle2"});

    },10000);

    afterAll(async ()=>{ 
        await browser.close();
    })

    test("Emulando dispositivos de forma manual", async()=>{
        await page.emulate({
            name: "Mi dispositivo",
            viewport: {
                width:375,
                height: 667,
                deviceScalaFactor:2,
                isMobile: true,
                hasTouch: true,
                isLandscape:false

            },
            userAgent: "Mozilla/5.0 (Linux; Android 10; SAMSUNG SM-J600G) AppleWebKit/537.36 (KHTML, like Gecko) SamsungBrowser/10.1 Chrome/71.0.3578.99 Mobile Safari/537.36",
        });

        await new Promise((resolve) => setTimeout(resolve, 5000));

    },35000);

    test("Emulando sitio de escritorio", async()=>{

        await page.setViewport({
            width:1280,
            height:800
        })
        await new Promise((resolve) => setTimeout(resolve, 5000));

    },35000);

    test("Emulando sitio en una tablet", async()=>{

        const tablet = KnownDevices['iPad Pro'];
        await page.emulate(tablet);

        await new Promise((resolve) => setTimeout(resolve, 5000));

    },35000);

    test("Emulando sitio en una tablet en modo landscape", async()=>{

        const tablet = KnownDevices["iPad landscape"];
        await page.emulate(tablet);

        await new Promise((resolve) => setTimeout(resolve, 5000));

    },35000);

    test("Emulando sitio en un celular", async()=>{

        const iPhone = KnownDevices['iPhone X']
        await page.emulate(iPhone);
        await new Promise((resolve) => setTimeout(resolve, 5000));

    },35000);

});
```const puppeteer = require("puppeteer")const { KnownDevices } = require('puppeteer');
describe("Emulando informacion",()=>{    let browser    let page
    beforeAll(async()=>{        browser = await puppeteer.launch({            headless:false,            defaultViewport: null,             //slowMo: 500        });
        page = await browser.newPage();        await page.goto("https://platzi.com", {waitUntil: "networkidle2"});
    },10000);
    afterAll(async ()=>{         await browser.close();    })
    test("Emulando dispositivos de forma manual", async()=>{        await page.emulate({            name: "Mi dispositivo",            viewport: {                width:375,                height: 667,                deviceScalaFactor:2,                isMobile: true,                hasTouch: true,                isLandscape:false
            },            userAgent: "Mozilla/5.0 (Linux; Android 10; SAMSUNG SM-J600G) AppleWebKit/537.36 (KHTML, like Gecko) SamsungBrowser/10.1 Chrome/71.0.3578.99 Mobile Safari/537.36",        });
        await new Promise((resolve) => setTimeout(resolve, 5000));
    },35000);
    test("Emulando sitio de escritorio", async()=>{
        await page.setViewport({            width:1280,            height:800        })        await new Promise((resolve) => setTimeout(resolve, 5000));
    },35000);
    test("Emulando sitio en una tablet", async()=>{        //const { KnownDevices } = require('puppeteer');        const tablet = KnownDevices\['iPad Pro'];        await page.emulate(tablet);
        await new Promise((resolve) => setTimeout(resolve, 5000));
    },35000);
    test("Emulando sitio en una tablet en modo landscape", async()=>{
        //const { KnownDevices } = require('puppeteer');        const tablet = KnownDevices\["iPad landscape"];        await page.emulate(tablet);
        await new Promise((resolve) => setTimeout(resolve, 5000));
    },35000);
    test("Emulando sitio en un celular", async()=>{
        //const { KnownDevices } = require('puppeteer');        const iPhone = KnownDevices\['iPhone X']        await page.emulate(iPhone);        await new Promise((resolve) => setTimeout(resolve, 5000));
    },35000);
});

Comentarios (20)20 comentarios

Steve Anthony Luzquiños Agama

Hace 4 años

Antonio Hernandez

Luciano Marchese

Hace 5 años

Javier Fuentes Mora

Profesor

Yelenith Natalia Ortiz Guerrero

Juan David Rojas Restrepo

JUAN DAVID ORTIZ CORREA

Alan Riveros

Irving Juárez

CRISTIAN DAVID ARENAS GOMEZ

Jesus Cuadro

Hace 3 años

Julianny Caicedo

Hace 9 meses

Xavier Alberto Castillo varon

Hace un año

Juan Morillo

Jorge Emilio Granados Guzmán

Ronald Riera Sanchez

MANUEL ALEJANDRO CUELLAR GUARIN

Moises Abel Avila Garcia

Manuel Ledezma

Samuel Espinoza Figueroa

Para quién es este curso?

¿Para quién es este curso?

Conceptos Avanzados

Emulación de dispositivos

Modo incógnito del navegador

Creando helpers de utilidad

Capturas de pantalla

Visual Testing

Generando PDFs

Geolocalización

Probando accesibilidad

Puppeteer con Firefox

Medir performance: page load

Medir performance: first contentful paint

Creando nuestro propio framework

Inicializando nuestro framework

Creando la Base Page

Page Object Model

Hacer un E2E

Agregar reporte

BDD

BDD y Gherkin

Configurando codeceptjs con Gherkin y BDD

Creando una Prueba con Gherkin

Creando un Scenario Outline

Generando reporte y agregando imágenes al reporte

CI/CD

Configurando Jenkins con nuestras pruebas y creando reportes

Conclusion del curso

Sigue aprendiendo

Emulación de dispositivos

Progreso del curso

Para quién es este curso?

Conceptos Avanzados

Creando nuestro propio framework

BDD

CI/CD

Conclusion del curso

Recursos

Recursos