diff --git a/__mocks__/styleMock.js b/__mocks__/styleMock.js new file mode 100644 index 0000000..d988e23 --- /dev/null +++ b/__mocks__/styleMock.js @@ -0,0 +1,3 @@ +// __mocks__/styleMock.js + +module.exports = {}; diff --git a/package.json b/package.json index 3436cac..f37b526 100644 --- a/package.json +++ b/package.json @@ -26,7 +26,10 @@ "/src/**/*.jsx", "!/src/**/*.test.jsx" ], - "coverageProvider": "babel" + "coverageProvider": "babel", + "moduleNameMapper": { + "\\.(css|less)$": "/__mocks__/styleMock.js" + } }, "private": "true", "license": "ISC", diff --git a/src/App.css b/src/App.css index 13b5060..45a5dde 100644 --- a/src/App.css +++ b/src/App.css @@ -9,6 +9,6 @@ } body { - background-color: rgb(240, 240, 240); + background-color: rgb(250, 245, 242); color: rgb(50, 50, 50); } diff --git a/src/components/UnauthenticatedApp.css b/src/components/UnauthenticatedApp.css new file mode 100644 index 0000000..fbd7864 --- /dev/null +++ b/src/components/UnauthenticatedApp.css @@ -0,0 +1,15 @@ +.UnauthenticatedApp button { + padding: 10px 15px; + border: 0px; + margin: 10px; + background-color: rgb(70, 90, 200); + color: rgb(255, 255, 255); +} + +.UnauthenticatedApp .chooseLogin { +} + +.UnauthenticatedApp .chooseRegister { + background-color: rgb(200, 200, 200); + color: rgb(50, 50, 50); +} diff --git a/src/components/UnauthenticatedApp.jsx b/src/components/UnauthenticatedApp.jsx index 5018af8..886904b 100644 --- a/src/components/UnauthenticatedApp.jsx +++ b/src/components/UnauthenticatedApp.jsx @@ -2,6 +2,7 @@ import React, { useState } from "react"; import { useAuth } from "../context/AuthContext"; import Login from "./Login"; import Register from "./Register"; +import "./UnauthenticatedApp.css"; function UnauthenticatedApp() { const { login, register } = useAuth(); @@ -19,14 +20,14 @@ function UnauthenticatedApp() { diff --git a/src/components/UnauthenticatedApp.test.jsx b/src/components/UnauthenticatedApp.test.jsx index 6f6a8bf..afbc3c0 100644 --- a/src/components/UnauthenticatedApp.test.jsx +++ b/src/components/UnauthenticatedApp.test.jsx @@ -2,7 +2,7 @@ import React from "react"; import { render } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import UnauthenticatedApp from "./UnauthenticatedApp"; -import '@testing-library/jest-dom/extend-expect'; +import "@testing-library/jest-dom/extend-expect"; import { AuthContext } from "../context/AuthContext"; test("Login inputs", () => { @@ -20,9 +20,10 @@ test("Login inputs", () => { const chooseRegisterButton = app.getByRole("button", { name: /Register/i }); userEvent.click(chooseLoginButton); - expect(app.getByRole('heading')).toHaveTextContent('Please Log In') + expect(app.getByRole("heading")).toHaveTextContent("Please Log In"); userEvent.click(chooseRegisterButton); - expect(app.getByRole('heading')).toHaveTextContent('Enter your data to register.') - + expect(app.getByRole("heading")).toHaveTextContent( + "Enter your data to register." + ); }); diff --git a/src/components/__snapshots__/UnauthenticatedApp-snapshot.test.jsx.snap b/src/components/__snapshots__/UnauthenticatedApp-snapshot.test.jsx.snap index 246cc86..4e21fb4 100644 --- a/src/components/__snapshots__/UnauthenticatedApp-snapshot.test.jsx.snap +++ b/src/components/__snapshots__/UnauthenticatedApp-snapshot.test.jsx.snap @@ -8,14 +8,14 @@ exports[`UnauthenticatedApp Snapshot 1`] = ` className="loginRegisterButtonsWrapper" >