diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts new file mode 100644 index 00000000..d526f674 --- /dev/null +++ b/cypress/support/commands.ts @@ -0,0 +1,45 @@ +/// + +declare global { + // eslint-disable-next-line @typescript-eslint/no-namespace + namespace Cypress { + interface Chainable { + /** + * Clear the search input + * @example cy.clearSearch() + */ + clearSearch(): Chainable + + /** + * Search for a term and wait for search suggestions to appear + * @param query - The search term to type + * @example cy.searchFor('berlin') + */ + searchFor(query: string): Chainable + + /** + * Wait for the map and search components to be ready + * @example cy.waitForMapReady() + */ + waitForMapReady(): Chainable + } + } +} + +Cypress.Commands.add('clearSearch', () => { + cy.get('[data-cy="search-input"]').clear() +}) + +Cypress.Commands.add('searchFor', (query: string) => { + cy.get('[data-cy="search-input"]').clear() + cy.get('[data-cy="search-input"]').type(query) + cy.get('[data-cy="search-suggestions"]', { timeout: 10000 }).should('be.visible') +}) + +Cypress.Commands.add('waitForMapReady', () => { + cy.get('[data-cy="search-input"]', { timeout: 10000 }).should('be.visible') + cy.get('.leaflet-container', { timeout: 10000 }).should('be.visible') + cy.get('.leaflet-marker-icon', { timeout: 15000 }).should('have.length.at.least', 1) +}) + +export {} diff --git a/cypress/support/e2e.ts b/cypress/support/e2e.ts index 3adacf0b..22a73383 100644 --- a/cypress/support/e2e.ts +++ b/cypress/support/e2e.ts @@ -1,19 +1,10 @@ /// - - -// Import commands.ts using ES2015 syntax: -// import './commands' - -// Alternatively you can use CommonJS syntax: -// require('./commands') +import './commands' // This file 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. - // Global exception handler Cypress.on('uncaught:exception', (err) => { console.log('Uncaught exception:', err.message)