test: Init test

.github/workflows/testing.yml

@@ -0,0 +1,21 @@
+name: Unit Test
+
+on:
+  push:
+    branches:
+      - 'main'
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: 'read'
+      id-token: 'write'
+    steps:
+      - uses: 'actions/checkout@v3'
+      - name: Use Node.js
+        uses: actions/setup-node@v3
+      - name: npm install
+        run: npm ci
+      - name: Test
+        run: npm test

__tests__/button.test.js

@@ -0,0 +1,32 @@
+import { render, screen } from '@testing-library/react';
+import Button from '../src/app/[lng]/components/Button';
+import '@testing-library/jest-dom';
+
+describe('Button', () => {
+	it('renders a button contain child text', async () => {
+		render(<Button>hello</Button>);
+		const btn = await screen.getByTestId('button');
+		expect(btn).toHaveTextContent('hello');
+		expect(btn).toHaveClass('bg-dodgerBlue');
+	});
+	it('renders a disabled button', async () => {
+		render(<Button disabled={true}>hello</Button>);
+		const btn = await screen.getByTestId('button');
+		expect(btn).toHaveAttribute('disabled');
+		expect(btn).toHaveClass('bg-dodgerBlue disabled:cursor-not-allowed disabled:opacity-60');
+	});
+	it('renders a color button', async () => {
+		render(<Button color="pink">hello</Button>);
+		const btn = await screen.getByTestId('button');
+		expect(btn).toHaveClass('bg-dodgerBlue bg-pink');
+	});
+	it('click a button', async () => {
+		const foo = jest.fn();
+		render(<Button onClick={foo}>hello</Button>);
+		const btn = await screen.getByTestId('button');
+		btn.click();
+		expect(foo).toBeCalled();
+		btn.click();
+		expect(foo).toBeCalledTimes(2);
+	});
+});

jest.config.mjs

@@ -0,0 +1,18 @@
+import nextJest from 'next/jest.js';
+
+const createJestConfig = nextJest({
+	// Provide the path to your Next.js app to load next.config.js and .env files in your test environment
+	dir: './',
+});
+
+// Add any custom config to be passed to Jest
+/** @type {import('jest').Config} */
+const config = {
+	// Add more setup options before each test is run
+	// setupFilesAfterEnv: ['<rootDir>/jest.setup.js'],
+
+	testEnvironment: 'jest-environment-jsdom',
+};
+
+// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
+export default createJestConfig(config);