No tienes acceso a esta clase

隆Contin煤a aprendiendo! 脷nete y comienza a potenciar tu carrera

Nuestra primer prueba

4/23
Recursos

Aportes 16

Preguntas 7

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

o inicia sesi贸n.

Por si acaso les da el mismo error que a mi, como primer punto la carpeta integration que se crea cuando levantamos cypress cambio de nombre y ahora se llama e2e, segundo ahi es donde se corren todos nuestros test y por si acaso usas la extension spec por ejemplo: 鈥減rimetTest.spec.js鈥 debes cambiarla a cy(鈥減rimerTest.cy.js鈥), para que encuentre el archivo a ejecutar para el test!

Con la nueva versi贸n de Cypress, la opci贸n de ignoreTestFile que explica el profesor ya no esta disponible, con esta versi贸n se utiliza el comando exclureSpectPattern

const { defineConfig } = require(鈥渃ypress鈥);

module.exports = defineConfig({
e2e: {
setupNodeEvents(on, config) {
// implement node event listeners here
},
excludeSpecPattern:[
"/1-getting-started/*.js",
"
/2-advanced-examples/*.js"
]
},
});

Si quieren cambiar en cypress 10 las dimensiones de la pantalla lo pueden hacer de la siguiente manera https://docs.cypress.io/api/commands/viewport#Default-sizing

Aqui comparto el codigo

const { defineConfig } = require("cypress");

module.exports = defineConfig({

    viewportWidth: 1920,
    viewportHeight: 1080,

  e2e: {
    setupNodeEvents(on, config) {
      // implement node event listeners here
    },
  },
});

El curso est谩 desactualizado Profe鈥 Tuve que hacer varios cambios para ejecutar mi primera prueba:

La sintaxis me qued贸 as铆:

describe ('Primer Prueba', ()=> {
    it ('Navegar a nuestra primer pgina', ()=> {
        cy.visit('https://www.platzi.com')

    })
})

Describe : Es como nuestra suite.

describe() sirve b谩sicamente para agrupar nuestros casos de prueba. Podemos anidar nuestras pruebas en grupos tan profundos como consideremos necesario. describe() toma dos argumentos, el primero es el nombre del grupo de pruebas, y el segundo es una funci贸n callback. Puede haber varias descripciones en el mismo archivo. Tambi茅n se puede declarar una descripci贸n dentro de otra descripci贸n.

it : se utiliza para un caso de prueba individual. it() toma dos argumentos, una cadena (string) que explica lo que la prueba debe hacer, y una funci贸n de devoluci贸n de llamada que contiene nuestra prueba real.

Personalizando nuestras pruebas

Partiendo de lo visto en la clase, seleccionando la prueba E2E de nuestra UI proporcionada por Cypress, lanzamos nuestra primera prueba.

Nota.
De mi parte, estoy ejecutando el modo electron porque no me detect贸 ning煤n browser Cypress.

.
Seleccionando y siguiendo el flujo de creaci贸n, pasamos por la UI para ejecutar nuestra primera prueba.

.
Pasando a ejecutar nuestra primera prueba, tenemos lo siguiente:
.

.

Primeras impresiones

Siendo honestos, considero que tiene un proceso interesante y distinto a lo tradicional, en cuanto al modo de ejecutar. Sin embargo, lo cool es que poseemos la misma estructura de pruebas como Jest que, de por s铆, son compatibles con Cypress 馃

Yo estoy usando Yarn y me instal贸 la versi贸n 10 de cypress. El instructor est谩 usando la 9.5.
Esto se arregla via el archivo package.json:

"cypress": "9.5.0",

Muy desactualizado el curso鈥 a compraraci贸n de la versi贸n que existe actualmente

Para la versi贸n 10, el archivo creado no es .spec.js, sino .cy.js

Nuestra primera prueba y mi primera observaci贸n, Javier deber铆as darle un poco de zoom todo el IDE como hacen los dem谩s instructores.

El curso est谩 bastante desactualizado, deber铆an revisar el contenido.

Les dejo por ac谩 como se seria en cypress 12 para ignoran los archivos de prueba que trae por defecto, deben editar el archivo cypress.config.js

const { defineConfig } = require("cypress");

module.exports = defineConfig({
  e2e: {
    setupNodeEvents(on, config) {
      // implement node event listeners here
    },
  excludeSpecPattern: [
    "cypress/e2e/1-getting-started/",
    "cypress/e2e/2-advanced-examples/"
    ]
  },
});

Es mas facil si utilizamos la misma version de cypress que usa el profesor en este curso

Si quieres instalar la versi贸n en espec铆fico del curso, selecciona al momento de instalar
[email protected]

Siguiendo el v铆deo y la documentaci贸n, tenemos lo siguiente al ejectuar npx cypress open

En las ultimas versiones de cypress la manera de ignorar pruebas ya funciona con ignoreTestFiles, si no que ahora se crea una propiedad component o e2e dependiendo del tipo de prueba que quieras hacer y ya ahi se indica el patron para los specs excluidos:
.

// cypress.config.js

const { defineConfig } = require("cypress");

module.exports = defineConfig({
  component: {
    excludeSpecPattern: [
      "/snapsots/*"
    ],
  },
});

La ignoreTestFilesopci贸n ya no se usa en Cypress 10 y se reemplaz贸 con la excludeSpecPattern para ignorar los TestFile del e2e ante llamada integration podemos usar las siguientes l铆neas en el cypress.config.js

excludeSpecPattern:[
"/1-getting-started/*.js",
"
/2-advanced-examples/*.js"
]
El archivo quedar铆a as铆

const { defineConfig } = require("cypress");

module.exports = defineConfig({
  e2e: {
           setupNodeEvents(on, config) {
      // implement node event listeners here
    },
    excludeSpecPattern:[
      "**/1-getting-started/*.js",
      "**/2-advanced-examples/*.js"
    ]          
  },
});

si estas usando la version 10 de cypress como al script de test que utilizamos para levantar cypress(test: 鈥渃ypress open鈥) , puedes agregarle de una vez la opcion del navegador que quieras usar para la prueba por ejemplo en chrome seria: 鈥渢est鈥: 鈥渃ypress open --browser chrome --e2e鈥(el e2e indica el tipo de prueba a realizar).