diff --git a/cypress/integration/entry-box.spec.ts b/cypress/integration/entry-box.spec.ts
index 4c1e5e43..74429a83 100644
--- a/cypress/integration/entry-box.spec.ts
+++ b/cypress/integration/entry-box.spec.ts
@@ -12,7 +12,7 @@ describe('Entry Box', () => {
cy.visit('/');
cy.get('[data-cy=entry-box-bedpres]').within(() => {
- cy.get(`[data-cy="${bedpresPage}"]`).click();
+ cy.get(`[data-cy="${bedpresPage}"]`).click({ force: true });
cy.url().should('include', bedpresPage);
});
});
@@ -24,7 +24,7 @@ describe('Entry Box', () => {
cy.visit('/');
cy.get('[data-cy=entry-box-event]').within(() => {
- cy.get(`[data-cy="${eventPage}"]`).click();
+ cy.get(`[data-cy="${eventPage}"]`).click({ force: true });
cy.url().should('include', eventPage);
});
});
diff --git a/cypress/integration/happening-registration.spec.ts b/cypress/integration/happening-registration.spec.ts
index bdc0ffad..77d66e2d 100644
--- a/cypress/integration/happening-registration.spec.ts
+++ b/cypress/integration/happening-registration.spec.ts
@@ -4,19 +4,24 @@ import users from '../fixtures/users.json';
import { happenings } from '../fixtures/happening.json';
const checkSubmitRegistration = (degree: string, degreeYear: number) => {
- cy.get('[data-cy=reg-btn]').click();
+ cy.get('[data-cy=reg-btn]').click({ force: true });
+
+ cy.wait(1000);
+
cy.get('[data-cy=reg-form]').should('be.visible');
cy.get('input[name=email]').type(`${degree}${degreeYear}@test.com`);
cy.get('input[name=firstName]').type('Test');
cy.get('input[name=lastName]').type('McTest');
- cy.get('select[name=degree]').select(degree);
+ cy.get('select[name=degree]').select(degree, { force: true });
cy.get('input[name=degreeYear]').check(degreeYear.toString(), { force: true });
cy.get('input[id=terms1]').check({ force: true });
cy.get('input[id=terms2]').check({ force: true });
cy.get('input[id=terms3]').check({ force: true });
- cy.get('button[type=submit]').click();
+ cy.get('[data-cy=reg-submit-btn]').click({ force: true });
+
+ cy.wait(1000);
cy.get('li[class=chakra-toast]').contains('Påmeldingen din er registrert!');
};
@@ -34,7 +39,10 @@ describe('Happening registration', () => {
});
it('Popup form appears correctly', () => {
- cy.get('[data-cy=reg-btn]').click();
+ cy.get('[data-cy=reg-btn]').click({ force: true });
+
+ cy.wait(1000);
+
cy.get('[data-cy=reg-form]').should('be.visible');
cy.get('input[name=email]').should('be.visible');
diff --git a/cypress/integration/nav.spec.ts b/cypress/integration/nav.spec.ts
index 27b2efbf..da9faa56 100644
--- a/cypress/integration/nav.spec.ts
+++ b/cypress/integration/nav.spec.ts
@@ -19,19 +19,19 @@ describe('Nav Menus', () => {
describe('navbar', () => {
it('Should navigate to om-echo page', () => {
- cy.get('[data-cy=nav-item]').contains('Om echo').click();
+ cy.get('[data-cy=nav-item]').contains('Om echo').click({ force: true });
cy.url().should('include', '/om-oss');
});
it('Should navigate to for-bedrifter page', () => {
- cy.get('[data-cy=nav-item]').contains('For Bedrifter').click();
+ cy.get('[data-cy=nav-item]').contains('For Bedrifter').click({ force: true });
cy.url().should('include', '/for-bedrifter');
});
it('Should navigate to for-studenter page', () => {
- cy.get('[data-cy=nav-item]').contains('For Studenter').click();
+ cy.get('[data-cy=nav-item]').contains('For Studenter').click({ force: true });
cy.url().should('include', '/for-studenter');
});
it('Should navigate to home page', () => {
- cy.get('[data-cy=nav-item]').contains('Hjem').click();
+ cy.get('[data-cy=nav-item]').contains('Hjem').click({ force: true });
cy.url().should('eq', 'http://localhost:3000/');
});
});
diff --git a/cypress/integration/registration-deletion.spec.ts b/cypress/integration/registration-deletion.spec.ts
index d43b21b4..0340ca0a 100644
--- a/cypress/integration/registration-deletion.spec.ts
+++ b/cypress/integration/registration-deletion.spec.ts
@@ -19,9 +19,9 @@ describe('Happening registration', () => {
it('Registrations are deleted properly', () => {
cy.get('[data-cy=reg-row]').should('have.length', rows);
cy.get('[data-cy=delete-button]').first().should('be.visible');
- cy.get('[data-cy=delete-button]').first().click();
+ cy.get('[data-cy=delete-button]').first().click({ force: true });
- cy.get('[data-cy=confirm-delete-button]').click();
+ cy.get('[data-cy=confirm-delete-button]').click({ force: true });
});
});
}
diff --git a/package.json b/package.json
index a5c27e34..52d2f3a0 100644
--- a/package.json
+++ b/package.json
@@ -150,7 +150,7 @@
"@testing-library/dom": "8.13.0",
"@testing-library/jest-dom": "5.16.4",
"@testing-library/react": "13.1.1",
- "@testing-library/user-event": "13.5.0",
+ "@testing-library/user-event": "14.1.1",
"@types/jest": "27.4.1",
"@types/node": "14.18.13",
"@types/react": "18.0.5",
diff --git a/src/components/__tests__/header.test.tsx b/src/components/__tests__/header.test.tsx
index a178c055..101a0853 100644
--- a/src/components/__tests__/header.test.tsx
+++ b/src/components/__tests__/header.test.tsx
@@ -1,29 +1,50 @@
import userEvent from '@testing-library/user-event';
import React from 'react';
+import { screen, waitFor } from '@testing-library/react';
import Header from '../header';
import { render } from './testing-utils';
describe('Header', () => {
- test('renders without crashing', () => {
- const { getByTestId } = render();
- expect(getByTestId(/header-standard/i)).toBeInTheDocument();
+ test('renders without crashing', async () => {
+ render();
+ const header = screen.getByTestId(/header-standard/i);
+
+ await waitFor(() => header);
+
+ expect(header).toBeInTheDocument();
});
- test('renders correctly', () => {
- const { getByTestId } = render();
- expect(getByTestId(/header-standard/i)).toBeInTheDocument();
- expect(getByTestId(/header-logo/i)).toBeInTheDocument();
- expect(getByTestId(/navbar-standard/i)).toBeInTheDocument();
- expect(getByTestId(/drawer-button/i)).toBeInTheDocument();
+ test('renders correctly', async () => {
+ render();
+ const header = screen.getByTestId(/header-standard/i);
+ const headerLogo = screen.getByTestId(/header-logo/i);
+ const navbarStandard = screen.getByTestId(/navbar-standard/i);
+ const drawerButton = screen.getByTestId(/drawer-button/i);
+
+ await waitFor(() => header);
+ await waitFor(() => headerLogo);
+ await waitFor(() => navbarStandard);
+ await waitFor(() => drawerButton);
+
+ expect(header).toBeInTheDocument();
+ expect(headerLogo).toBeInTheDocument();
+ expect(navbarStandard).toBeInTheDocument();
+ expect(drawerButton).toBeInTheDocument();
});
- test('drawer button opens a chakra drawer', () => {
- const { getByTestId, getByText } = render();
- const drawerButton = getByTestId(/drawer-button/i);
- userEvent.click(drawerButton);
- // drawer exists in DOM
- expect(getByTestId(/navbar-drawer/i)).toBeInTheDocument();
- // Drawer Header exists
- expect(getByText(/navigasjon/i)).toBeInTheDocument();
+ test('drawer button opens a chakra drawer', async () => {
+ const user = userEvent.setup();
+ render();
+ const drawerButton = screen.getByTestId(/drawer-button/i);
+
+ await waitFor(() => drawerButton);
+ expect(drawerButton).toBeInTheDocument();
+
+ await user.click(drawerButton);
+
+ const navText = screen.getByText(/navigasjon/i);
+ await waitFor(() => navText);
+
+ expect(navText).toBeInTheDocument();
});
});
diff --git a/src/components/registration-form.tsx b/src/components/registration-form.tsx
index 6acce7bf..ede12fd3 100644
--- a/src/components/registration-form.tsx
+++ b/src/components/registration-form.tsx
@@ -246,7 +246,7 @@ const RegistrationForm = ({ happening, regVerifyToken, type, backendUrl }: Props
-