test(ARMP-48): Adding test cases

jest.config.js

@@ -42,7 +42,7 @@ module.exports = {
     '@settingsStore/selector': '<rootDir>/src/store/settingsStore/selector',
   },
   transform: {
-    '.+\\.(css|scss|png|jpg|svg)$': 'jest-transform-stub',
+    '.+\\.(css|scss|png|jpg|jpeg|svg)$': 'jest-transform-stub',
     '^.+\\.(js|jsx|ts|tsx)$': 'ts-jest',
   },
   coverageThreshold: {

src/assets/icons/__tests__/ArrowRight.test.tsx

@@ -0,0 +1,10 @@
+import { render } from '@testing-library/react';
+import { ArrowRightIcon } from '../ArrowRight';
+
+describe('ArrowRight', () => {
+  it('should render correctly', () => {
+    const { container } = render(<ArrowRightIcon />);
+
+    expect(container).toMatchSnapshot();
+  });
+});

src/assets/icons/__tests__/Battery.test.tsx

@@ -0,0 +1,10 @@
+import { render } from '@testing-library/react';
+import { BatteryIcon } from '../Battery';
+
+describe('BatteryIcon', () => {
+  it('should render correctly', () => {
+    const { container } = render(<BatteryIcon />);
+
+    expect(container).toMatchSnapshot();
+  });
+});

src/assets/icons/__tests__/Check.test.tsx

@@ -0,0 +1,10 @@
+import { render } from '@testing-library/react';
+import { CheckIcon } from '../Check';
+
+describe('CheckIcon', () => {
+  it('should render correctly', () => {
+    const { container } = render(<CheckIcon />);
+
+    expect(container).toMatchSnapshot();
+  });
+});

src/assets/icons/__tests__/Keyboard.test.tsx

@@ -0,0 +1,10 @@
+import { render } from '@testing-library/react';
+import { KeyboardIcon } from '../Keyboard';
+
+describe('KeyboardIcon', () => {
+  it('should render correctly', () => {
+    const { container } = render(<KeyboardIcon />);
+
+    expect(container).toMatchSnapshot();
+  });
+});

src/assets/icons/__tests__/Wifi.test.tsx

@@ -0,0 +1,10 @@
+import { render } from '@testing-library/react';
+import { WifiIcon } from '../Wifi';
+
+describe('WifiIcon', () => {
+  it('should render correctly', () => {
+    const { container } = render(<WifiIcon />);
+
+    expect(container).toMatchSnapshot();
+  });
+});

src/assets/icons/__tests__/__snapshots__/ArrowRight.test.tsx.snap

@@ -0,0 +1,17 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ArrowRight should render correctly 1`] = `
+<div>
+  <svg
+    fill="currentColor"
+    height="1em"
+    viewBox="0 0 16 16"
+    width="1em"
+  >
+    <path
+      d="M1 8a7 7 0 1014 0A7 7 0 001 8zm15 0A8 8 0 110 8a8 8 0 0116 0zM4.5 7.5a.5.5 0 000 1h5.793l-2.147 2.146a.5.5 0 00.708.708l3-3a.5.5 0 000-.708l-3-3a.5.5 0 10-.708.708L10.293 7.5H4.5z"
+      fill-rule="evenodd"
+    />
+  </svg>
+</div>
+`;

src/assets/icons/__tests__/__snapshots__/Battery.test.tsx.snap

@@ -0,0 +1,19 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`BatteryIcon should render correctly 1`] = `
+<div>
+  <svg
+    fill="currentColor"
+    height="1em"
+    viewBox="0 0 16 16"
+    width="1em"
+  >
+    <path
+      d="M2 6h5v4H2V6z"
+    />
+    <path
+      d="M2 4a2 2 0 00-2 2v4a2 2 0 002 2h10a2 2 0 002-2V6a2 2 0 00-2-2H2zm10 1a1 1 0 011 1v4a1 1 0 01-1 1H2a1 1 0 01-1-1V6a1 1 0 011-1h10zm4 3a1.5 1.5 0 01-1.5 1.5v-3A1.5 1.5 0 0116 8z"
+    />
+  </svg>
+</div>
+`;

src/assets/icons/__tests__/__snapshots__/Check.test.tsx.snap

@@ -0,0 +1,16 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`CheckIcon should render correctly 1`] = `
+<div>
+  <svg
+    fill="currentColor"
+    height="1em"
+    viewBox="0 0 16 16"
+    width="1em"
+  >
+    <path
+      d="M12.736 3.97a.733.733 0 011.047 0c.286.289.29.756.01 1.05L7.88 12.01a.733.733 0 01-1.065.02L3.217 8.384a.757.757 0 010-1.06.733.733 0 011.047 0l3.052 3.093 5.4-6.425a.247.247 0 01.02-.022z"
+    />
+  </svg>
+</div>
+`;

src/assets/icons/__tests__/__snapshots__/Keyboard.test.tsx.snap

@@ -0,0 +1,19 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`KeyboardIcon should render correctly 1`] = `
+<div>
+  <svg
+    fill="currentColor"
+    height="1em"
+    viewBox="0 0 16 16"
+    width="1em"
+  >
+    <path
+      d="M14 5a1 1 0 011 1v5a1 1 0 01-1 1H2a1 1 0 01-1-1V6a1 1 0 011-1h12zM2 4a2 2 0 00-2 2v5a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2H2z"
+    />
+    <path
+      d="M13 10.25a.25.25 0 01.25-.25h.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-.5a.25.25 0 01-.25-.25v-.5zm0-2a.25.25 0 01.25-.25h.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-.5a.25.25 0 01-.25-.25v-.5zm-5 0A.25.25 0 018.25 8h.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-.5A.25.25 0 018 8.75v-.5zm2 0a.25.25 0 01.25-.25h1.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-1.5a.25.25 0 01-.25-.25v-.5zm1 2a.25.25 0 01.25-.25h.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-.5a.25.25 0 01-.25-.25v-.5zm-5-2A.25.25 0 016.25 8h.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-.5A.25.25 0 016 8.75v-.5zm-2 0A.25.25 0 014.25 8h.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-.5A.25.25 0 014 8.75v-.5zm-2 0A.25.25 0 012.25 8h.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-.5A.25.25 0 012 8.75v-.5zm11-2a.25.25 0 01.25-.25h.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-.5a.25.25 0 01-.25-.25v-.5zm-2 0a.25.25 0 01.25-.25h.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-.5a.25.25 0 01-.25-.25v-.5zm-2 0A.25.25 0 019.25 6h.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-.5A.25.25 0 019 6.75v-.5zm-2 0A.25.25 0 017.25 6h.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-.5A.25.25 0 017 6.75v-.5zm-2 0A.25.25 0 015.25 6h.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-.5A.25.25 0 015 6.75v-.5zm-3 0A.25.25 0 012.25 6h1.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-1.5A.25.25 0 012 6.75v-.5zm0 4a.25.25 0 01.25-.25h.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-.5a.25.25 0 01-.25-.25v-.5zm2 0a.25.25 0 01.25-.25h5.5a.25.25 0 01.25.25v.5a.25.25 0 01-.25.25h-5.5a.25.25 0 01-.25-.25v-.5z"
+    />
+  </svg>
+</div>
+`;

src/assets/icons/__tests__/__snapshots__/Wifi.test.tsx.snap

@@ -0,0 +1,16 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`WifiIcon should render correctly 1`] = `
+<div>
+  <svg
+    fill="currentColor"
+    height="1em"
+    viewBox="0 0 24 24"
+    width="1em"
+  >
+    <path
+      d="M12 21l3.6-4.8c-1-.75-2.25-1.2-3.6-1.2s-2.6.45-3.6 1.2L12 21m0-18C7.95 3 4.21 4.34 1.2 6.6L3 9c2.5-1.88 5.62-3 9-3s6.5 1.12 9 3l1.8-2.4C19.79 4.34 16.05 3 12 3m0 6c-2.7 0-5.19.89-7.2 2.4l1.8 2.4C8.1 12.67 9.97 12 12 12c2.03 0 3.9.67 5.4 1.8l1.8-2.4C17.19 9.89 14.7 9 12 9z"
+    />
+  </svg>
+</div>
+`;

src/components/wallpaper/Wallpaper.tsx

@@ -24,7 +24,13 @@ const WallpaperMap: Record<WallpaperEnum, string> = {
 
 const WallpaperComponent = ({ id }: WallpaperProps) => {
   return (
-    <Img width={'100%'} height={'100%'} src={WallpaperMap[id]} loading="lazy" />
+    <Img
+      width={'100%'}
+      height={'100%'}
+      src={WallpaperMap[id]}
+      loading="lazy"
+      aria-label={`wallpaper-component-with-${id}`}
+    />
   );
 };
 

src/components/wallpaper/__Tests__/Wallpaper.test.tsx

@@ -0,0 +1,61 @@
+import { WallpaperEnum } from '@settingsStore';
+import { render } from '@testing-library/react';
+import WallpaperComponent from '../Wallpaper';
+
+describe('Wallpaper component', () => {
+  it('should return default wallpaper type 1', () => {
+    const { container } = render(
+      <WallpaperComponent id={WallpaperEnum.Wallpaper1} />,
+    );
+
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should return wallpaper for wallpaper 2', () => {
+    const { container } = render(
+      <WallpaperComponent id={WallpaperEnum.Wallpaper2} />,
+    );
+
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should return wallpaper for wallpaper 3', () => {
+    const { container } = render(
+      <WallpaperComponent id={WallpaperEnum.Wallpaper3} />,
+    );
+
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should return wallpaper for wallpaper 4', () => {
+    const { container } = render(
+      <WallpaperComponent id={WallpaperEnum.Wallpaper4} />,
+    );
+
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should return wallpaper for wallpaper 5', () => {
+    const { container } = render(
+      <WallpaperComponent id={WallpaperEnum.Wallpaper5} />,
+    );
+
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should return wallpaper for wallpaper 6', () => {
+    const { container } = render(
+      <WallpaperComponent id={WallpaperEnum.Wallpaper6} />,
+    );
+
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should return wallpaper for wallpaper 7', () => {
+    const { container } = render(
+      <WallpaperComponent id={WallpaperEnum.Wallpaper7} />,
+    );
+
+    expect(container).toMatchSnapshot();
+  });
+});

src/components/wallpaper/__Tests__/__snapshots__/Wallpaper.test.tsx.snap

@@ -0,0 +1,78 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Wallpaper component should return default wallpaper type 1 1`] = `
+<div>
+  <img
+    aria-label="wallpaper-component-with-wallpaper1"
+    class="chakra-image css-uwwqev"
+    loading="lazy"
+    src=""
+  />
+</div>
+`;
+
+exports[`Wallpaper component should return wallpaper for wallpaper 2 1`] = `
+<div>
+  <img
+    aria-label="wallpaper-component-with-wallpaper2"
+    class="chakra-image css-uwwqev"
+    loading="lazy"
+    src=""
+  />
+</div>
+`;
+
+exports[`Wallpaper component should return wallpaper for wallpaper 3 1`] = `
+<div>
+  <img
+    aria-label="wallpaper-component-with-wallpaper3"
+    class="chakra-image css-uwwqev"
+    loading="lazy"
+    src=""
+  />
+</div>
+`;
+
+exports[`Wallpaper component should return wallpaper for wallpaper 4 1`] = `
+<div>
+  <img
+    aria-label="wallpaper-component-with-wallpaper4"
+    class="chakra-image css-uwwqev"
+    loading="lazy"
+    src=""
+  />
+</div>
+`;
+
+exports[`Wallpaper component should return wallpaper for wallpaper 5 1`] = `
+<div>
+  <img
+    aria-label="wallpaper-component-with-wallpaper5"
+    class="chakra-image css-uwwqev"
+    loading="lazy"
+    src=""
+  />
+</div>
+`;
+
+exports[`Wallpaper component should return wallpaper for wallpaper 6 1`] = `
+<div>
+  <img
+    aria-label="wallpaper-component-with-wallpaper6"
+    class="chakra-image css-uwwqev"
+    loading="lazy"
+    src=""
+  />
+</div>
+`;
+
+exports[`Wallpaper component should return wallpaper for wallpaper 7 1`] = `
+<div>
+  <img
+    aria-label="wallpaper-component-with-wallpaper7"
+    class="chakra-image css-uwwqev"
+    loading="lazy"
+    src=""
+  />
+</div>
+`;