From 0f55c09513494276a56540d43f8e2ce5dbb85c2a Mon Sep 17 00:00:00 2001 From: BreizhHardware Date: Tue, 15 Oct 2024 11:27:25 +0200 Subject: [PATCH] Add cypress for e2e testing --- cypress.config.ts | 13 ---------- cypress/e2e/base.cy.ts | 12 +++++++++ cypress/fixtures/example.json | 5 ---- cypress/integration/app_spec.js | 18 ------------- cypress/support/commands.ts | 37 -------------------------- cypress/support/component-index.html | 12 --------- cypress/support/component.ts | 39 ---------------------------- cypress/support/e2e.ts | 30 --------------------- 8 files changed, 12 insertions(+), 154 deletions(-) delete mode 100644 cypress.config.ts create mode 100644 cypress/e2e/base.cy.ts delete mode 100644 cypress/fixtures/example.json delete mode 100644 cypress/integration/app_spec.js delete mode 100644 cypress/support/commands.ts delete mode 100644 cypress/support/component-index.html delete mode 100644 cypress/support/component.ts delete mode 100644 cypress/support/e2e.ts diff --git a/cypress.config.ts b/cypress.config.ts deleted file mode 100644 index c93b4d8..0000000 --- a/cypress.config.ts +++ /dev/null @@ -1,13 +0,0 @@ -import { defineConfig } from 'cypress'; -import { addMatchImageSnapshotPlugin } from '@simonsmith/cypress-image-snapshot/plugin'; - -export default defineConfig({ - e2e: { - setupNodeEvents(on, config) { - // implement node event listeners here - addMatchImageSnapshotPlugin(on); - }, - specPattern: 'cypress/integration/**/*.js', - baseUrl: 'http://localhost:8080', - }, -}); diff --git a/cypress/e2e/base.cy.ts b/cypress/e2e/base.cy.ts new file mode 100644 index 0000000..ca881f9 --- /dev/null +++ b/cypress/e2e/base.cy.ts @@ -0,0 +1,12 @@ +describe('Class and Component Presence Test', () => { + it('Checks if specific classes and components are present', () => { + // Visite la page d'accueil + cy.visit('/'); + + // Vérifie si un élément avec la classe 'my-class' est présent + cy.get('.page').should('exist'); + + // Vérifie si un composant avec le texte 'My Component' est présent + cy.contains('Modelec').should('exist'); + }); +}); diff --git a/cypress/fixtures/example.json b/cypress/fixtures/example.json deleted file mode 100644 index 02e4254..0000000 --- a/cypress/fixtures/example.json +++ /dev/null @@ -1,5 +0,0 @@ -{ - "name": "Using fixtures to represent data", - "email": "hello@cypress.io", - "body": "Fixtures are a great way to mock data for responses to routes" -} diff --git a/cypress/integration/app_spec.js b/cypress/integration/app_spec.js deleted file mode 100644 index cdeaacf..0000000 --- a/cypress/integration/app_spec.js +++ /dev/null @@ -1,18 +0,0 @@ -// cypress/integration/app_spec.js -describe('App Component', () => { - beforeEach(() => { - cy.visit('/'); - }); - - it('renders the app and checks if CSS is loaded', () => { - cy.get('[data-testid="root"]', { timeout: 10000 }).should('exist'); - cy.get('[data-testid="root"]').should('have.class', 'min-h-screen py-10 bg-gray-100 dark:bg-gray-900 m-0'); - }); - - it('should match the previous screenshot', () => { - cy.get('[data-testid="root"]').matchImageSnapshot({ - failureThreshold: 0.01, // tolérance de 1% - failureThresholdType: 'percent', // type de tolérance (peut être 'pixel' ou 'percent') - }); - }); -}); \ No newline at end of file diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts deleted file mode 100644 index 698b01a..0000000 --- a/cypress/support/commands.ts +++ /dev/null @@ -1,37 +0,0 @@ -/// -// *********************************************** -// This example commands.ts shows you how to -// create various custom commands and overwrite -// existing commands. -// -// For more comprehensive examples of custom -// commands please read more here: -// https://on.cypress.io/custom-commands -// *********************************************** -// -// -// -- This is a parent command -- -// Cypress.Commands.add('login', (email, password) => { ... }) -// -// -// -- This is a child command -- -// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... }) -// -// -// -- This is a dual command -- -// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... }) -// -// -// -- This will overwrite an existing command -- -// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... }) -// -// declare global { -// namespace Cypress { -// interface Chainable { -// login(email: string, password: string): Chainable -// drag(subject: string, options?: Partial): Chainable -// dismiss(subject: string, options?: Partial): Chainable -// visit(originalFn: CommandOriginalFn, url: string, options: Partial): Chainable -// } -// } -// } \ No newline at end of file diff --git a/cypress/support/component-index.html b/cypress/support/component-index.html deleted file mode 100644 index ac6e79f..0000000 --- a/cypress/support/component-index.html +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - Components App - - -
- - \ No newline at end of file diff --git a/cypress/support/component.ts b/cypress/support/component.ts deleted file mode 100644 index 37f59ed..0000000 --- a/cypress/support/component.ts +++ /dev/null @@ -1,39 +0,0 @@ -// *********************************************************** -// This example support/component.ts is processed and -// loaded automatically before your test files. -// -// This is a great place to put global configuration and -// behavior that modifies Cypress. -// -// You can change the location of this file or turn off -// automatically serving support files with the -// 'supportFile' configuration option. -// -// You can read more here: -// https://on.cypress.io/configuration -// *********************************************************** - -// Import commands.js using ES2015 syntax: -import './commands' - -// Alternatively you can use CommonJS syntax: -// require('./commands') - -import { mount } from 'cypress/react18' - -// Augment the Cypress namespace to include type definitions for -// your custom command. -// Alternatively, can be defined in cypress/support/component.d.ts -// with a at the top of your spec. -declare global { - namespace Cypress { - interface Chainable { - mount: typeof mount - } - } -} - -Cypress.Commands.add('mount', mount) - -// Example use: -// cy.mount() \ No newline at end of file diff --git a/cypress/support/e2e.ts b/cypress/support/e2e.ts deleted file mode 100644 index 7dbb3ab..0000000 --- a/cypress/support/e2e.ts +++ /dev/null @@ -1,30 +0,0 @@ -// *********************************************************** -// This example support/e2e.ts is processed and -// loaded automatically before your test files. -// -// This is a great place to put global configuration and -// behavior that modifies Cypress. -// -// You can change the location of this file or turn off -// automatically serving support files with the -// 'supportFile' configuration option. -// -// You can read more here: -// https://on.cypress.io/configuration -// *********************************************************** - -// Import commands.js using ES2015 syntax: -import './commands' - -// Alternatively you can use CommonJS syntax: -// require('./commands') - -import {addMatchImageSnapshotCommand} from '@simonsmith/cypress-image-snapshot/command' - -addMatchImageSnapshotCommand() - -// can also add any default options to be used -// by all instances of `matchImageSnapshot` -addMatchImageSnapshotCommand({ - failureThreshold: 0.2, -}) \ No newline at end of file