navbar tests

This commit is contained in:
Owen Rees
2023-06-16 15:15:17 +02:00
parent 7450bc82e3
commit e2d99d8f5a
12 changed files with 184 additions and 97 deletions
+18 -15
View File
@@ -1,27 +1,30 @@
import React from 'react';
import React from "react";
import ThemeSwitcher from "../../components/ThemeSwitcher";
import Home from "@/app/page";
import useDarkMode from '@/hooks/useDarkMode';
import '../../app/globals.css';
import "@/css/theme-toggle.css";
describe('ThemeSwitcher component', () => {
it('should toggle between light and dark mode', () => {
describe("ThemeSwitcher component", () => {
it("should toggle between light and dark mode", () => {
cy.mount(<Home />);
cy.mount(<ThemeSwitcher />);
cy.wait(100);
// checking that the toggle is there and light mode is active
cy.get('.toggle').should('exist');
cy.get('.toggle').should(($toggle) => {
const backgroundImage = $toggle.css('background-image');
expect(backgroundImage).to.include('linear-gradient(rgb(0, 255, 255), rgb(135, 206, 235)');
cy.get(".toggle").should("exist");
cy.get(".toggle").should(($toggle) => {
const backgroundImage = $toggle.css("background-image");
expect(backgroundImage).to.include(
"linear-gradient(rgb(0, 255, 255), rgb(135, 206, 235)"
);
});
// checking that the toggle is clickable and dark mode is active
cy.get('.toggle').click();
cy.get('.toggle-dark').should('exist');
cy.get('.toggle-dark').should(($toggle) => {
const backgroundImage = $toggle.css('background-image');
expect(backgroundImage).to.include('linear-gradient(rgb(25, 25, 112), rgb(102, 51, 153)');
cy.get(".toggle").click();
cy.get(".toggle-dark").should("exist");
cy.get(".toggle-dark").should(($toggle) => {
const backgroundImage = $toggle.css("background-image");
expect(backgroundImage).to.include(
"linear-gradient(rgb(25, 25, 112), rgb(102, 51, 153)"
);
});
});
});
});