From b724fb487f44065ed3941d47693a84e576237c0d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Krystian=20Sowin=CC=81ski?= <88927709+plumcoding@users.noreply.github.com> Date: Sat, 24 Feb 2024 14:19:10 +0100 Subject: [PATCH] Projekt: Testy E2E --- README.md | 1 + docs/09-testy-e2e/README.md | 29 +++++++++++++++++++++++++++ dummy-e2e/cypress.config.js | 10 +++++++++ dummy-e2e/cypress/e2e/account.cy.ts | 6 ++++++ dummy-e2e/cypress/e2e/sign-in.cy.ts | 14 +++++++++++++ dummy-e2e/cypress/support/commands.ts | 25 +++++++++++++++++++++++ dummy-e2e/cypress/support/e2e.ts | 20 ++++++++++++++++++ dummy-e2e/package.json | 12 +++++++++++ dummy-e2e/tsconfig.json | 16 +++++++++++++++ 9 files changed, 133 insertions(+) create mode 100644 docs/09-testy-e2e/README.md create mode 100644 dummy-e2e/cypress.config.js create mode 100644 dummy-e2e/cypress/e2e/account.cy.ts create mode 100644 dummy-e2e/cypress/e2e/sign-in.cy.ts create mode 100644 dummy-e2e/cypress/support/commands.ts create mode 100644 dummy-e2e/cypress/support/e2e.ts create mode 100644 dummy-e2e/package.json create mode 100644 dummy-e2e/tsconfig.json diff --git a/README.md b/README.md index e7c9a03..ac7fbdf 100644 --- a/README.md +++ b/README.md @@ -9,3 +9,4 @@ - [x] [Globalny stan aplikacji - Context API](docs/06-context/README.md) - [x] [TypeScript](docs/07-typescript/README.md) - [ ] [Testy jednostkowe](./docs/08-testy-jednostkowe/README.md) +- [ ] [Testy E2E](./docs/09-testy-e2e/README.md) diff --git a/docs/09-testy-e2e/README.md b/docs/09-testy-e2e/README.md new file mode 100644 index 0000000..41014e0 --- /dev/null +++ b/docs/09-testy-e2e/README.md @@ -0,0 +1,29 @@ +# Projekt: Testy E2E + +Na potrzeby przeprowadzenia testów w katalogu [`dummy`](../../dummy) stworzona została przykładowa aplikacja, a w +katalogu [`dummy-e2e`](../../dummy-e2e) projekt testów E2E. + +Przed przystąpieniem do zadań koniecznie zainstaluj zależności w obu projektach, a następnie uruchom aplikację _Dummy_ ( +jest wymagana do przeprowadzenia testów). + +Wszelkie ścieżki podane poniżej są relatywne dla katalogu wspomnianego projektu - [`dummy-e2e`](../../dummy-e2e). + +--- + +Aplikację _Dummy_ uruchom z poziomu katalogu [`dummy`](../../dummy) poleceniem `npm run dev`. + +Konsolę Cypress możesz otworzyć z poziomu katalogu [`dummy-e2e`](../../dummy-e2e) poleceniem `npm run open`. + +Testy E2E możesz też uruchomić z poziomu katalogu [`dummy-e2e`](../../dummy-e2e) poleceniem `npm run e2e`. + +--- + +## Strona logowania + +W pliku [`cypress/e2e/sign-in.cy.ts`](../../dummy-e2e/cypress/e2e/sign-in.cy.ts) napisz testy funkcjonalne strony +logowania. + +## Profil użytkownika + +W pliku [`cypress/e2e/account.cy.ts`](../../dummy-e2e/cypress/e2e/account.cy.ts) napisz testy funkcjonalne strony +profilu użytkownika. diff --git a/dummy-e2e/cypress.config.js b/dummy-e2e/cypress.config.js new file mode 100644 index 0000000..2116200 --- /dev/null +++ b/dummy-e2e/cypress.config.js @@ -0,0 +1,10 @@ +const {defineConfig} = require("cypress"); + +module.exports = defineConfig({ + e2e: { + baseUrl: 'http://localhost:5173', + setupNodeEvents(on, config) { + // implement node event listeners here + }, + }, +}); diff --git a/dummy-e2e/cypress/e2e/account.cy.ts b/dummy-e2e/cypress/e2e/account.cy.ts new file mode 100644 index 0000000..3b90db1 --- /dev/null +++ b/dummy-e2e/cypress/e2e/account.cy.ts @@ -0,0 +1,6 @@ +describe('account page', () => { + it('should contain greeting', () => { + }) + it('should log user out', () => { + }) +}) diff --git a/dummy-e2e/cypress/e2e/sign-in.cy.ts b/dummy-e2e/cypress/e2e/sign-in.cy.ts new file mode 100644 index 0000000..fc1ade1 --- /dev/null +++ b/dummy-e2e/cypress/e2e/sign-in.cy.ts @@ -0,0 +1,14 @@ +describe('sign-in page', () => { + it('should be opened by default', () => { + cy.visit('/') + }) + it('should show invalid email error', () => { + cy.visit('/sign-in') + }) + it('should show invalid password error', () => { + cy.visit('/sign-in') + }) + it('should navigate to /account', () => { + cy.visit('/sign-in') + }) +}) diff --git a/dummy-e2e/cypress/support/commands.ts b/dummy-e2e/cypress/support/commands.ts new file mode 100644 index 0000000..66ea16e --- /dev/null +++ b/dummy-e2e/cypress/support/commands.ts @@ -0,0 +1,25 @@ +// *********************************************** +// This example commands.js 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) => { ... }) \ No newline at end of file diff --git a/dummy-e2e/cypress/support/e2e.ts b/dummy-e2e/cypress/support/e2e.ts new file mode 100644 index 0000000..0e7290a --- /dev/null +++ b/dummy-e2e/cypress/support/e2e.ts @@ -0,0 +1,20 @@ +// *********************************************************** +// This example support/e2e.js 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') \ No newline at end of file diff --git a/dummy-e2e/package.json b/dummy-e2e/package.json new file mode 100644 index 0000000..58386a9 --- /dev/null +++ b/dummy-e2e/package.json @@ -0,0 +1,12 @@ +{ + "name": "dummy-e2e", + "version": "1.0.0", + "scripts": { + "open": "cypress open", + "e2e": "cypress run" + }, + "devDependencies": { + "cypress": "^13.6.6", + "typescript": "^5.3.3" + } +} diff --git a/dummy-e2e/tsconfig.json b/dummy-e2e/tsconfig.json new file mode 100644 index 0000000..5d61b7b --- /dev/null +++ b/dummy-e2e/tsconfig.json @@ -0,0 +1,16 @@ +{ + "compilerOptions": { + "target": "es2022", + "lib": [ + "es2022", + "dom" + ], + "types": [ + "cypress", + "node" + ] + }, + "include": [ + "**/*.ts" + ] +}