Herramientas para trabajar con Svelte profesionalmente
Proyecto del curso y estado del arte de Svelte
Setup inicial con Sapper
Estructura de un proyecto en Sapper
Estructura de rutas con Sapper
Sistema de rutas y rutas dinámicas en Sapper
Layout y estructura principal de nuestro blog
Ruta 404 con animaciones
Rutas principales del blog: about, contact y tags
Construye el Layout y Newsletter del blog
Diseño y maquetación del Header
Diseño y maquetación del Nav
Diseño y maquetación del Sidebar y Footer
Construye un Newsletter para el blog
Estructura de los blogposts
Sección principal del blog y blogposts
Integración de analytics, comentarios y tiempo de lectura en tu blog
Integración con Google Analytics
Calcula el tiempo de lectura de cada blogpost
Muestra un emoji aleatorio en cada blogpost
Manejo de fechas dentro del blog con JavaScript Vainilla
Estructura del blogpost con comentarios
Integración con Disqus para agregar comentarios
Construye tu API usando Ghost CMS
Instalación de Ghost
Configuración de Ghost en Heroku
Ghost Core API
Integra la API de Ghost en tu blog con Svelte
Guardando la información de nuestros blogposts
Terminando la integración
Despliega tu aplicación
Compra de un dominio y manejo del DNS con Cloudflare
Deploy a Netlify
Deploy a Heroku
SEO y optimización de tu sitio web
Metadatos y optimización del SEO
Transforma tu blog en una PWA
RSS
Terminando el RSS
Sitemap
Agrega pruebas de integración con Cypress
Cómo continúa tu camino profesional con Svelte
Siguientes pasos con Svelte
Lectura
Para llevar a cabo pruebas de end-to-end testing necesitamos una herramienta que simule la interacción de los usuarios con el navegador. Afortunadamente, nuestro proyecto de Sapper ya incluye Cypress.
Antes de comenzar a correr las pruebas con Cypress, es necesario instalarlo con todas sus dependencias necesarias.
Nota: Si utilizas un Windows, te recomiendo utilizar WSL (Windows Subsystem for Linux) que te permite tener una instancia de Ubuntu en tu sistema operativo Windows y ejecutar comandos de GNU/Linux.
sudo apt-get install libgtk2.0-0 libgtk-3-0 libgbm-dev libnotify-dev libgconf-2-4 libnss3 libxss1 libasound2 libxtst6 xauth xvfb
Una vez instalado las dependencias necesarias debemos de instalar Cypress en nuestro proyecto:
npm install cypress --save-dev
Ahora ya estamos listos para ejecutar las pruebas por defecto que trae nuestro proyecto:
npm run test
Para agregar más pruebas a nuestro proyecto debemos ubicar la carpeta y el archivo “cypress/integration/spec.js” donde corren las pruebas actuales. Edítalo y agrega tus pruebas.
Las pruebas escritas en Cypress están diseñadas para ser fáciles de leer y comprender. Agreguemos una nueva prueba para verificar que tenemos la sección de newsletter en el home de nuestro sitio. Para eso abrimos el archivo “cypress/integration/spec.js”, comenzamos editando la línea número 6 y agregamos nuestra propia prueba.
it('Check Newsletter section', () => {
cy.contains('h4', 'NEWSLETTER')
});
Ahora corremos nuestras pruebas con el comando:
npm run test
Si quieres aprender más acerca de Cypress y cómo agregar integraciones a tus proyectos para probar su flujo de trabajo, te recomiendo los cursos de End to End Testing con Cypress e Introducción a Selenium con Python que están disponibles con tu suscripción de Platzi.
Aportes 0
Preguntas 0
¿Quieres ver más aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesión.