Add basic tests for admin panel logs page (#183)

ValueMelody · Oct 17, 2024 · 13c1b9f · 13c1b9f
1 parent 74bdf29
commit 13c1b9f
Show file tree

Hide file tree

Showing 4 changed files with 246 additions and 4 deletions.
diff --git a/admin-panel/app/[lang]/logs/page.test.tsx b/admin-panel/app/[lang]/logs/page.test.tsx
@@ -0,0 +1,170 @@
+import {
+  describe, it, expect, vi, beforeEach, Mock,
+} from 'vitest'
+import { screen } from '@testing-library/react'
+import { render } from '../../../vitest.setup'
+import Page from 'app/[lang]/logs/page'
+import {
+  useGetApiV1LogsEmailQuery,
+  useGetApiV1LogsSignInQuery,
+  useGetApiV1LogsSmsQuery,
+} from 'services/auth/api'
+import {
+  emailLogs, signInLogs, smsLogs,
+} from 'tests/logMock'
+import { configSignal } from 'signals'
+
+vi.mock(
+  'services/auth/api',
+  () => ({
+    useGetApiV1LogsEmailQuery: vi.fn(),
+    useGetApiV1LogsSignInQuery: vi.fn(),
+    useGetApiV1LogsSmsQuery: vi.fn(),
+  }),
+)
+
+vi.mock(
+  'signals',
+  () => ({
+    configSignal: {
+      value: {
+        ENABLE_EMAIL_LOG: true,
+        ENABLE_SMS_LOG: true,
+        ENABLE_SIGN_IN_LOG: true,
+      },
+      subscribe: () => () => {},
+    },
+  }),
+)
+
+describe(
+  'Page Component',
+  () => {
+    beforeEach(() => {
+      (useGetApiV1LogsEmailQuery as Mock).mockReturnValue({ data: { logs: emailLogs } });
+      (useGetApiV1LogsSmsQuery as Mock).mockReturnValue({ data: { logs: smsLogs } });
+      (useGetApiV1LogsSignInQuery as Mock).mockReturnValue({ data: { logs: signInLogs } })
+    })
+
+    it(
+      'render logs',
+      async () => {
+        render(<Page />)
+
+        const emailRows = screen.queryAllByTestId('emailLogRow')
+        expect(emailRows.length).toBe(emailLogs.length)
+        emailRows.forEach((
+          row, index,
+        ) => {
+          expect(row.querySelectorAll('td')[0]?.innerHTML).toContain(emailLogs[index].receiver)
+          const editLink = row.querySelectorAll('td')[3]?.getElementsByTagName('a')
+          expect(editLink[0].getAttribute('href')).toBe(`/en/logs/email/${emailLogs[index].id}`)
+        })
+
+        const smsRows = screen.queryAllByTestId('smsLogRow')
+        expect(smsRows.length).toBe(smsLogs.length)
+        smsRows.forEach((
+          row, index,
+        ) => {
+          expect(row.querySelectorAll('td')[0]?.innerHTML).toContain(smsLogs[index].receiver)
+          const editLink = row.querySelectorAll('td')[3]?.getElementsByTagName('a')
+          expect(editLink[0].getAttribute('href')).toBe(`/en/logs/sms/${smsLogs[index].id}`)
+        })
+
+        const signInRows = screen.queryAllByTestId('signInRow')
+        expect(signInRows.length).toBe(signInLogs.length)
+        signInRows.forEach((
+          row, index,
+        ) => {
+          expect(row.querySelectorAll('td')[0]?.innerHTML).toContain(signInLogs[index].userId)
+          const editLink = row.querySelectorAll('td')[2]?.getElementsByTagName('a')
+          expect(editLink[0].getAttribute('href')).toBe(`/en/logs/sign-in/${signInLogs[index].userId}`)
+        })
+      },
+    )
+
+    it(
+      'suppress email logs',
+      async () => {
+        vi.mocked(configSignal as unknown as { value: object }).value = {
+          ENABLE_EMAIL_LOG: false,
+          ENABLE_SMS_LOG: true,
+          ENABLE_SIGN_IN_LOG: true,
+        }
+
+        render(<Page />)
+
+        const emailRows = screen.queryAllByTestId('emailLogRow')
+        expect(emailRows.length).toBe(0)
+
+        const smsRows = screen.queryAllByTestId('smsLogRow')
+        expect(smsRows.length).toBe(smsLogs.length)
+
+        const signInRows = screen.queryAllByTestId('signInRow')
+        expect(signInRows.length).toBe(signInLogs.length)
+
+        vi.mocked(configSignal as unknown as { value: object }).value = {
+          ENABLE_EMAIL_LOG: true,
+          ENABLE_SMS_LOG: true,
+          ENABLE_SIGN_IN_LOG: true,
+        }
+      },
+    )
+
+    it(
+      'suppress sms logs',
+      async () => {
+        vi.mocked(configSignal as unknown as { value: object }).value = {
+          ENABLE_EMAIL_LOG: true,
+          ENABLE_SMS_LOG: false,
+          ENABLE_SIGN_IN_LOG: true,
+        }
+
+        render(<Page />)
+
+        const emailRows = screen.queryAllByTestId('emailLogRow')
+        expect(emailRows.length).toBe(2)
+
+        const smsRows = screen.queryAllByTestId('smsLogRow')
+        expect(smsRows.length).toBe(0)
+
+        const signInRows = screen.queryAllByTestId('signInRow')
+        expect(signInRows.length).toBe(signInLogs.length)
+
+        vi.mocked(configSignal as unknown as { value: object }).value = {
+          ENABLE_EMAIL_LOG: true,
+          ENABLE_SMS_LOG: true,
+          ENABLE_SIGN_IN_LOG: true,
+        }
+      },
+    )
+
+    it(
+      'suppress signIn logs',
+      async () => {
+        vi.mocked(configSignal as unknown as { value: object }).value = {
+          ENABLE_EMAIL_LOG: true,
+          ENABLE_SMS_LOG: true,
+          ENABLE_SIGN_IN_LOG: false,
+        }
+
+        render(<Page />)
+
+        const emailRows = screen.queryAllByTestId('emailLogRow')
+        expect(emailRows.length).toBe(2)
+
+        const smsRows = screen.queryAllByTestId('smsLogRow')
+        expect(smsRows.length).toBe(2)
+
+        const signInRows = screen.queryAllByTestId('signInRow')
+        expect(signInRows.length).toBe(0)
+
+        vi.mocked(configSignal as unknown as { value: object }).value = {
+          ENABLE_EMAIL_LOG: true,
+          ENABLE_SMS_LOG: true,
+          ENABLE_SIGN_IN_LOG: true,
+        }
+      },
+    )
+  },
+)
diff --git a/admin-panel/app/[lang]/logs/page.tsx b/admin-panel/app/[lang]/logs/page.tsx
@@ -96,7 +96,9 @@ const Page = () => {
             </Table.Head>
             <Table.Body className='divide-y'>
               {emailLogs.map((log) => (
-                <Table.Row key={log.id}>
+                <Table.Row
+                  data-testid='emailLogRow'
+                  key={log.id}>
                   <Table.Cell>{log.receiver}</Table.Cell>
                   <Table.Cell><ConfigBooleanValue config={log.success}/></Table.Cell>
                   <Table.Cell>{log.createdAt}</Table.Cell>
@@ -138,7 +140,9 @@ const Page = () => {
             </Table.Head>
             <Table.Body className='divide-y'>
               {smsLogs.map((log) => (
-                <Table.Row key={log.id}>
+                <Table.Row
+                  data-testid='smsLogRow'
+                  key={log.id}>
                   <Table.Cell>{log.receiver}</Table.Cell>
                   <Table.Cell><ConfigBooleanValue config={log.success}/></Table.Cell>
                   <Table.Cell>{log.createdAt}</Table.Cell>
@@ -179,7 +183,9 @@ const Page = () => {
             </Table.Head>
             <Table.Body className='divide-y'>
               {signInLogs.map((log) => (
-                <Table.Row key={log.id}>
+                <Table.Row
+                  data-testid='signInRow'
+                  key={log.id}>
                   <Table.Cell>{log.userId}</Table.Cell>
                   <Table.Cell>{log.createdAt}</Table.Cell>
                   <Table.Cell>

diff --git a/admin-panel/tests/logMock.ts b/admin-panel/tests/logMock.ts
@@ -0,0 +1,66 @@
+export const emailLogs = [
+  {
+    id: 1,
+    success: true,
+    receiver: 'test1@email.com',
+    response: 'response 1',
+    content: 'content 1',
+    createdAt: '2024-08-07 20:45:27',
+    updatedAt: '2024-08-07 20:45:27',
+    deletedAt: null,
+  },
+  {
+    id: 2,
+    success: true,
+    receiver: 'test2@email.com',
+    response: 'response 2',
+    content: 'content 2',
+    createdAt: '2024-08-07 20:45:27',
+    updatedAt: '2024-08-07 20:45:27',
+    deletedAt: null,
+  },
+]
+
+export const smsLogs = [
+  {
+    id: 1,
+    success: true,
+    receiver: '+16471231111',
+    response: 'response 1',
+    content: 'content 1',
+    createdAt: '2024-08-07 20:45:27',
+    updatedAt: '2024-08-07 20:45:27',
+    deletedAt: null,
+  },
+  {
+    id: 2,
+    success: true,
+    receiver: '+16471231112',
+    response: 'response 2',
+    content: 'content 2',
+    createdAt: '2024-08-07 20:45:27',
+    updatedAt: '2024-08-07 20:45:27',
+    deletedAt: null,
+  },
+]
+
+export const signInLogs = [
+  {
+    id: 1,
+    userId: 1,
+    ip: '1-1-1-1',
+    detail: 'test',
+    createdAt: '2024-08-07 20:45:27',
+    updatedAt: '2024-08-07 20:45:27',
+    deletedAt: null,
+  },
+  {
+    id: 2,
+    userId: 2,
+    ip: '1-1-1-2',
+    detail: 'test 2',
+    createdAt: '2024-08-07 20:45:27',
+    updatedAt: '2024-08-07 20:45:27',
+    deletedAt: null,
+  },
+]
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "melody-auth",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "A turnkey OAuth & authentication system.",
   "license": "MIT",
   "author": "Baozier",