From d7bb6c88d3e4878486fb1f4d1655379896a5d976 Mon Sep 17 00:00:00 2001 From: Gianni Ceccarelli Date: Wed, 20 Mar 2024 02:25:49 +0000 Subject: Cypress typescript (#13591) * convert Cypress tests to TypeScript this work was done by @lunaisnotaboy https://github.com/lunaisnotaboy for their fork https://github.com/cutiekey/cutiekey/pull/7 I just repacked their changes into a minimal set * fix call to `window` in cypress tests this error was spotted thanks to the TypeScript compiler: ``` support/commands.ts:33:12 - error TS2559: Type '(win: any) => void' has no properties in common with type 'Partial'. 33 cy.window(win => { ~~~~~~~~ Found 1 error in support/commands.ts:33 ``` (again, @lunaisnotaboy did the actual work) --- cypress/support/commands.js | 60 --------------------------------------------- cypress/support/commands.ts | 60 +++++++++++++++++++++++++++++++++++++++++++++ cypress/support/e2e.js | 34 ------------------------- cypress/support/e2e.ts | 34 +++++++++++++++++++++++++ cypress/support/index.ts | 19 ++++++++++++++ 5 files changed, 113 insertions(+), 94 deletions(-) delete mode 100644 cypress/support/commands.js create mode 100644 cypress/support/commands.ts delete mode 100644 cypress/support/e2e.js create mode 100644 cypress/support/e2e.ts create mode 100644 cypress/support/index.ts (limited to 'cypress/support') diff --git a/cypress/support/commands.js b/cypress/support/commands.js deleted file mode 100644 index 91a4d7abe6..0000000000 --- a/cypress/support/commands.js +++ /dev/null @@ -1,60 +0,0 @@ -// *********************************************** -// 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) => { ... }) - -Cypress.Commands.add('visitHome', () => { - cy.visit('/'); - cy.get('button', { timeout: 30000 }).should('be.visible'); -}) - -Cypress.Commands.add('resetState', () => { - cy.window(win => { - win.indexedDB.deleteDatabase('keyval-store'); - }); - cy.request('POST', '/api/reset-db', {}).as('reset'); - cy.get('@reset').its('status').should('equal', 204); - cy.reload(true); -}); - -Cypress.Commands.add('registerUser', (username, password, isAdmin = false) => { - const route = isAdmin ? '/api/admin/accounts/create' : '/api/signup'; - - cy.request('POST', route, { - username: username, - password: password, - }).its('body').as(username); -}); - -Cypress.Commands.add('login', (username, password) => { - cy.visitHome(); - - cy.intercept('POST', '/api/signin').as('signin'); - - cy.get('[data-cy-signin]').click(); - cy.get('[data-cy-signin-username] input').type(username); - cy.get('[data-cy-signin-password] input').type(`${password}{enter}`); - - cy.wait('@signin').as('signedIn'); -}); diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts new file mode 100644 index 0000000000..c2d92e1663 --- /dev/null +++ b/cypress/support/commands.ts @@ -0,0 +1,60 @@ +// *********************************************** +// 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) => { ... }) + +Cypress.Commands.add('visitHome', () => { + cy.visit('/'); + cy.get('button', { timeout: 30000 }).should('be.visible'); +}) + +Cypress.Commands.add('resetState', () => { + cy.window().then(win => { + win.indexedDB.deleteDatabase('keyval-store'); + }); + cy.request('POST', '/api/reset-db', {}).as('reset'); + cy.get('@reset').its('status').should('equal', 204); + cy.reload(true); +}); + +Cypress.Commands.add('registerUser', (username, password, isAdmin = false) => { + const route = isAdmin ? '/api/admin/accounts/create' : '/api/signup'; + + cy.request('POST', route, { + username: username, + password: password, + }).its('body').as(username); +}); + +Cypress.Commands.add('login', (username, password) => { + cy.visitHome(); + + cy.intercept('POST', '/api/signin').as('signin'); + + cy.get('[data-cy-signin]').click(); + cy.get('[data-cy-signin-username] input').type(username); + cy.get('[data-cy-signin-password] input').type(`${password}{enter}`); + + cy.wait('@signin').as('signedIn'); +}); diff --git a/cypress/support/e2e.js b/cypress/support/e2e.js deleted file mode 100644 index 827a326d18..0000000000 --- a/cypress/support/e2e.js +++ /dev/null @@ -1,34 +0,0 @@ -// *********************************************************** -// This example support/index.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') - -Cypress.on('uncaught:exception', (err, runnable) => { - if ([ - 'The source image cannot be decoded', - - // Chrome - 'ResizeObserver loop limit exceeded', - - // Firefox - 'ResizeObserver loop completed with undelivered notifications', - ].some(msg => err.message.includes(msg))) { - return false; - } -}); diff --git a/cypress/support/e2e.ts b/cypress/support/e2e.ts new file mode 100644 index 0000000000..827a326d18 --- /dev/null +++ b/cypress/support/e2e.ts @@ -0,0 +1,34 @@ +// *********************************************************** +// This example support/index.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') + +Cypress.on('uncaught:exception', (err, runnable) => { + if ([ + 'The source image cannot be decoded', + + // Chrome + 'ResizeObserver loop limit exceeded', + + // Firefox + 'ResizeObserver loop completed with undelivered notifications', + ].some(msg => err.message.includes(msg))) { + return false; + } +}); diff --git a/cypress/support/index.ts b/cypress/support/index.ts new file mode 100644 index 0000000000..c1bed21979 --- /dev/null +++ b/cypress/support/index.ts @@ -0,0 +1,19 @@ +declare global { + namespace Cypress { + interface Chainable { + login(username: string, password: string): Chainable; + + registerUser( + username: string, + password: string, + isAdmin?: boolean + ): Chainable; + + resetState(): Chainable; + + visitHome(): Chainable; + } + } +} + +export {} -- cgit v1.2.3-freya