diff --git a/cypress/integration/homepage.spec.ts b/cypress/integration/homepage.spec.ts index ddde260bc7..7685c2c108 100644 --- a/cypress/integration/homepage.spec.ts +++ b/cypress/integration/homepage.spec.ts @@ -16,8 +16,8 @@ describe('Homepage', () => { it('should have a working search box', () => { const queryString = 'test'; - cy.get('ds-search-form input[name="query"]').type(queryString); - cy.get('ds-search-form button.search-button').click(); + cy.get('[data-e2e="search-box"]').type(queryString); + cy.get('[data-e2e="search-button"]').click(); cy.url().should('include', '/search'); cy.url().should('include', 'query=' + encodeURI(queryString)); }); diff --git a/cypress/integration/login-modal.spec.ts b/cypress/integration/login-modal.spec.ts index a71101e591..82b322c4a9 100644 --- a/cypress/integration/login-modal.spec.ts +++ b/cypress/integration/login-modal.spec.ts @@ -2,14 +2,18 @@ import { TEST_ADMIN_PASSWORD, TEST_ADMIN_USER, TEST_ENTITY_PUBLICATION } from 'c const page = { openLoginMenu() { - // Click the closed "Log In" dropdown menu (to open Login menu) - cy.get('ds-auth-nav-menu.navbar-collapsed').click(); + // Click the "Log In" dropdown menu in header + cy.get('ds-themed-navbar [data-e2e="login-menu"]').click(); + }, + openUserMenu() { + // Once logged in, click the User menu in header + cy.get('ds-themed-navbar [data-e2e="user-menu"]').click(); }, submitLoginAndPasswordByPressingEnter(email, password) { // In opened Login modal, fill out email & password, then click Enter - cy.get('ds-themed-navbar ds-log-in-password input[type = "email"]').type(email); - cy.get('ds-themed-navbar ds-log-in-password input[type = "password"]').type(password); - cy.get('ds-themed-navbar ds-log-in-password input[type = "password"]').type('{enter}'); + cy.get('ds-themed-navbar [data-e2e="email"]').type(email); + cy.get('ds-themed-navbar [data-e2e="password"]').type(password); + cy.get('ds-themed-navbar [data-e2e="password"]').type('{enter}'); } }; @@ -24,8 +28,8 @@ describe('Login Modal', () => { cy.login(TEST_ADMIN_USER, TEST_ADMIN_PASSWORD); cy.get('ds-log-in').should('not.exist'); - // Open login menu again, verify user menu & logout button now available - page.openLoginMenu(); + // Open user menu, verify user menu & logout button now available + page.openUserMenu(); cy.get('ds-user-menu').should('be.visible'); cy.get('ds-log-out').should('be.visible'); }); @@ -41,8 +45,8 @@ describe('Login Modal', () => { page.submitLoginAndPasswordByPressingEnter(TEST_ADMIN_USER, TEST_ADMIN_PASSWORD); cy.get('.form-login').should('not.exist'); - // Open login menu again, verify user menu & logout button now available - page.openLoginMenu(); + // Open user menu, verify user menu & logout button now available + page.openUserMenu(); cy.get('ds-user-menu').should('be.visible'); cy.get('ds-log-out').should('be.visible'); }); @@ -51,23 +55,15 @@ describe('Login Modal', () => { const ENTITYPAGE = '/entities/publication/' + TEST_ENTITY_PUBLICATION; cy.visit(ENTITYPAGE); - // Login menu should exist - cy.get('ds-log-in').should('exist'); - // Login, and the tag should no longer exist cy.login(TEST_ADMIN_USER, TEST_ADMIN_PASSWORD); cy.get('ds-log-in').should('not.exist'); // Verify we are still on the same page cy.url().should('include', ENTITYPAGE); - - // Open login menu again, verify user menu & logout button now available - page.openLoginMenu(); - cy.get('ds-user-menu').should('be.visible'); - cy.get('ds-log-out').should('be.visible'); }); - it('logout should work', () => { + it('should support logout', () => { cy.visit('/'); cy.get('ds-log-in').should('exist'); @@ -85,4 +81,32 @@ describe('Login Modal', () => { cy.get('ds-log-in').should('exist'); cy.get('ds-log-out').should('not.exist'); }); + + it('should allow new user registration', () => { + cy.visit('/'); + + page.openLoginMenu(); + + // Registration link should be visible + cy.get('ds-themed-navbar [data-e2e="register"]').should('be.visible'); + + // Click registration link & you should go to registration page + cy.get('ds-themed-navbar [data-e2e="register"]').click(); + cy.location('pathname').should('eq', '/register'); + cy.get('ds-register-email').should('exist'); + }); + + it('should allow forgot password', () => { + cy.visit('/'); + + page.openLoginMenu(); + + // Forgot password link should be visible + cy.get('ds-themed-navbar [data-e2e="forgot"]').should('be.visible'); + + // Click link & you should go to Forgot Password page + cy.get('ds-themed-navbar [data-e2e="forgot"]').click(); + cy.location('pathname').should('eq', '/forgot'); + cy.get('ds-forgot-email').should('exist'); + }); }); diff --git a/cypress/integration/search-navbar.spec.ts b/cypress/integration/search-navbar.spec.ts index 19a3d56ed4..53e713412e 100644 --- a/cypress/integration/search-navbar.spec.ts +++ b/cypress/integration/search-navbar.spec.ts @@ -1,15 +1,15 @@ const page = { fillOutQueryInNavBar(query) { // Click the magnifying glass - cy.get('.navbar-container #search-navbar-container form a').click(); + cy.get('ds-themed-navbar [data-e2e="header-search-icon"]').click(); // Fill out a query in input that appears - cy.get('.navbar-container #search-navbar-container form input[name = "query"]').type(query); + cy.get('ds-themed-navbar [data-e2e="header-search-box"]').type(query); }, submitQueryByPressingEnter() { - cy.get('.navbar-container #search-navbar-container form input[name = "query"]').type('{enter}'); + cy.get('ds-themed-navbar [data-e2e="header-search-box"]').type('{enter}'); }, submitQueryByPressingIcon() { - cy.get('.navbar-container #search-navbar-container form .submit-icon').click(); + cy.get('ds-themed-navbar [data-e2e="header-search-icon"]').click(); } }; @@ -19,30 +19,45 @@ describe('Search from Navigation Bar', () => { it('should go to search page with correct query if submitted (from home)', () => { cy.visit('/'); + // This is the GET command that will actually run the search + cy.intercept('GET', '/server/api/discover/search/objects*').as('search-results'); + // Run the search page.fillOutQueryInNavBar(query); page.submitQueryByPressingEnter(); // New URL should include query param cy.url().should('include', 'query=' + query); + // Wait for search results to come back from the above GET command + cy.wait('@search-results'); // At least one search result should be displayed cy.get('ds-item-search-result-list-element').should('be.visible'); }); it('should go to search page with correct query if submitted (from search)', () => { cy.visit('/search'); + // This is the GET command that will actually run the search + cy.intercept('GET', '/server/api/discover/search/objects*').as('search-results'); + // Run the search page.fillOutQueryInNavBar(query); page.submitQueryByPressingEnter(); // New URL should include query param cy.url().should('include', 'query=' + query); + // Wait for search results to come back from the above GET command + cy.wait('@search-results'); // At least one search result should be displayed cy.get('ds-item-search-result-list-element').should('be.visible'); }); it('should allow user to also submit query by clicking icon', () => { cy.visit('/'); + // This is the GET command that will actually run the search + cy.intercept('GET', '/server/api/discover/search/objects*').as('search-results'); + // Run the search page.fillOutQueryInNavBar(query); page.submitQueryByPressingIcon(); // New URL should include query param cy.url().should('include', 'query=' + query); + // Wait for search results to come back from the above GET command + cy.wait('@search-results'); // At least one search result should be displayed cy.get('ds-item-search-result-list-element').should('be.visible'); }); diff --git a/cypress/integration/search-page.spec.ts b/cypress/integration/search-page.spec.ts index 859c765d2e..0765884952 100644 --- a/cypress/integration/search-page.spec.ts +++ b/cypress/integration/search-page.spec.ts @@ -2,21 +2,18 @@ import { Options } from 'cypress-axe'; import { testA11y } from 'cypress/support/utils'; describe('Search Page', () => { - // unique ID of the search form (for selecting specific elements below) - const SEARCHFORM_ID = '#search-form'; - it('should contain query value when navigating to page with query parameter', () => { const queryString = 'test query'; cy.visit('/search?query=' + queryString); - cy.get(SEARCHFORM_ID + ' input[name="query"]').should('have.value', queryString); + cy.get('[data-e2e="search-box"]').should('have.value', queryString); }); it('should redirect to the correct url when query was set and submit button was triggered', () => { const queryString = 'Another interesting query string'; cy.visit('/search'); // Type query in searchbox & click search button - cy.get(SEARCHFORM_ID + ' input[name="query"]').type(queryString); - cy.get(SEARCHFORM_ID + ' button.search-button').click(); + cy.get('[data-e2e="search-box"]').type(queryString); + cy.get('[data-e2e="search-button"]').click(); cy.url().should('include', 'query=' + encodeURI(queryString)); }); @@ -51,9 +48,8 @@ describe('Search Page', () => { it('should pass accessibility tests in Grid view', () => { cy.visit('/search'); - // Click to display grid view - // TODO: These buttons should likely have an easier way to uniquely select - cy.get('#search-sidebar-content > ds-view-mode-switch > .btn-group > [href="/search?view=grid"] > .fas').click(); + // Click button in sidebar to display grid view + cy.get('ds-search-sidebar [data-e2e="grid-view"]').click(); // tag must be loaded cy.get('ds-search-page').should('exist'); diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts index b1994299fb..67e604d2e7 100644 --- a/cypress/support/commands.ts +++ b/cypress/support/commands.ts @@ -19,13 +19,13 @@ declare namespace Cypress { */ function login(email: string, password: string): void { // Click the closed "Log In" dropdown menu (to open Login menu) - cy.get('ds-auth-nav-menu.navbar-collapsed').click(); + cy.get('ds-themed-navbar [data-e2e="login-menu"]').click(); // Enter email - cy.get('ds-themed-navbar ds-log-in-password input[type = "email"]').type(email); + cy.get('ds-themed-navbar [data-e2e="email"]').type(email); // Enter password - cy.get('ds-themed-navbar ds-log-in-password input[type = "password"]').type(password); + cy.get('ds-themed-navbar [data-e2e="password"]').type(password); // Click login button - cy.get('ds-themed-navbar ds-log-in-password button[type = "submit"]').click(); + cy.get('ds-themed-navbar [data-e2e="login-button"]').click(); } // Add as a Cypress command (i.e. assign to 'cy.login') Cypress.Commands.add('login', login); @@ -37,11 +37,11 @@ Cypress.Commands.add('login', login); */ function logout(): void { // Click the closed User dropdown menu (to open user menu in header) - cy.get('ds-auth-nav-menu.navbar-collapsed').click(); + cy.get('ds-themed-navbar [data-e2e="user-menu"]').click(); // This is the POST command that will actually log us out cy.intercept('POST', '/server/api/authn/logout').as('logout'); // Click logout button - cy.get('ds-themed-navbar ds-log-out button').click(); + cy.get('ds-themed-navbar [data-e2e="logout-button"]').click(); // Wait until above POST command responds before continuing cy.wait('@logout'); } diff --git a/src/app/search-navbar/search-navbar.component.html b/src/app/search-navbar/search-navbar.component.html index 693c7daef8..05b3d13b1b 100644 --- a/src/app/search-navbar/search-navbar.component.html +++ b/src/app/search-navbar/search-navbar.component.html @@ -3,8 +3,8 @@
- + class="d-inline-block bg-transparent position-absolute form-control dropdown-menu-right p-1" data-e2e="header-search-box"> +
diff --git a/src/app/shared/auth-nav-menu/auth-nav-menu.component.html b/src/app/shared/auth-nav-menu/auth-nav-menu.component.html index 80fdeda394..3f06f9f42c 100644 --- a/src/app/shared/auth-nav-menu/auth-nav-menu.component.html +++ b/src/app/shared/auth-nav-menu/auth-nav-menu.component.html @@ -1,7 +1,7 @@