From aa61b2fb76df1416f03dceb42ad6c598e6d4fe65 Mon Sep 17 00:00:00 2001
From: Bastian Meissner <meissner.bastian@gmail.com>
Date: Mon, 14 Jun 2021 21:10:28 +0200
Subject: [PATCH] add icon and theme tests

---
 codecov.yml                                   |  7 +--
 src/components/icon.tsx                       | 15 +++----
 src/lib/theme.tsx                             |  2 +-
 .../__snapshots__/icon.spec.tsx.snap          |  2 +
 src/test/components/icon.spec.tsx             |  5 +++
 src/test/lib/theme.spec.tsx                   | 44 +++++++++++++++++++
 6 files changed, 61 insertions(+), 14 deletions(-)
 create mode 100644 src/test/lib/theme.spec.tsx

diff --git a/codecov.yml b/codecov.yml
index 261b78c..d4acc21 100644
--- a/codecov.yml
+++ b/codecov.yml
@@ -9,8 +9,5 @@ coverage:
 flags:
   dashboard:
     paths:
-      - src/
-      - data/
-
-ignore:
-  - node_modules
+      - src/components/
+      - src/lib/
diff --git a/src/components/icon.tsx b/src/components/icon.tsx
index 2537258..18f7f21 100644
--- a/src/components/icon.tsx
+++ b/src/components/icon.tsx
@@ -38,6 +38,8 @@ const IconContainer = styled.i`
   text-rendering: optimizeLegibility;
   -moz-osx-font-smoothing: grayscale;
   font-feature-settings: "liga";
+  font-size: ${(props) => props.theme};
+  color: ${(props) => props.color};
 `;
 
 /**
@@ -45,14 +47,11 @@ const IconContainer = styled.i`
  * @param {IIconProps} props props needed for the given icon
  * @returns {React.ReactNode} the icon node
  */
-export const Icon = ({ name, size }: IIconProps) => {
-  let Container = styled(IconContainer)`
-    font-size: ${size ? size : "24px"};
-    color: ${selectedTheme.mainColor};
-  `;
-
-  return <Container>{name}</Container>;
-};
+export const Icon = ({ name, size }: IIconProps) => (
+  <IconContainer color={selectedTheme.mainColor} theme={size}>
+    {name}
+  </IconContainer>
+);
 
 /**
  * Renders a button with an icon
diff --git a/src/lib/theme.tsx b/src/lib/theme.tsx
index ebdc07f..11804c5 100644
--- a/src/lib/theme.tsx
+++ b/src/lib/theme.tsx
@@ -27,7 +27,7 @@ export const setTheme = (theme: string) => {
  * Function that gets the saved theme from localStorage or returns the default
  * @returns {IThemeProps} the saved theme or the default theme
  */
-const getTheme = (): IThemeProps => {
+export const getTheme = (): IThemeProps => {
   let selectedTheme = defaultTheme;
 
   if (localStorage.getItem("theme") !== null) {
diff --git a/src/test/components/__snapshots__/icon.spec.tsx.snap b/src/test/components/__snapshots__/icon.spec.tsx.snap
index 076de6c..6de0c03 100644
--- a/src/test/components/__snapshots__/icon.spec.tsx.snap
+++ b/src/test/components/__snapshots__/icon.spec.tsx.snap
@@ -1,5 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`Icon test (no size) 1`] = `[Function]`;
+
 exports[`Icon test 1`] = `[Function]`;
 
 exports[`IconButton test 1`] = `[Function]`;
diff --git a/src/test/components/icon.spec.tsx b/src/test/components/icon.spec.tsx
index 3a44a1d..2791628 100644
--- a/src/test/components/icon.spec.tsx
+++ b/src/test/components/icon.spec.tsx
@@ -12,6 +12,11 @@ it("Icon test", () => {
   expect(asFragment).toMatchSnapshot();
 });
 
+it("Icon test (no size)", () => {
+  const { asFragment } = render(<Icon name={props.name} />);
+  expect(asFragment).toMatchSnapshot();
+});
+
 it("IconButton test", () => {
   const { asFragment } = render(
     <IconButton icon={props.name} onClick={props.onClick} />,
diff --git a/src/test/lib/theme.spec.tsx b/src/test/lib/theme.spec.tsx
new file mode 100644
index 0000000..88734b6
--- /dev/null
+++ b/src/test/lib/theme.spec.tsx
@@ -0,0 +1,44 @@
+import selectedTheme, {
+  getTheme,
+  IThemeProps,
+  setTheme,
+} from "../../lib/theme";
+
+const props: IThemeProps = {
+  label: "Classic",
+  value: 0,
+  mainColor: "#000000",
+  accentColor: "#1e272e",
+  backgroundColor: "#ffffff",
+};
+
+const theme = JSON.stringify(props);
+
+describe("theme.tsx", () => {
+  beforeEach(() => {
+    Object.defineProperty(window, "localStorage", {
+      value: {
+        getItem: jest.fn(() => null),
+        setItem: jest.fn(() => null),
+      },
+      writable: true,
+    });
+  });
+
+  it("setTheme test", () => {
+    setTheme(theme);
+
+    expect(window.localStorage.setItem).toHaveBeenCalledTimes(1);
+    expect(window.localStorage.setItem).toHaveBeenCalledWith("theme", theme);
+  });
+
+  it("getTheme test", () => {
+    const themeTest = getTheme();
+    expect(themeTest).toEqual(props);
+  });
+
+  it("selectedTheme test", () => {
+    const themeTest = selectedTheme;
+    expect(themeTest).toEqual(props);
+  });
+});