Merge pull request #18 from UNLV-CS472-672/4-cicd-testing-with-jest-c…

…ypress

⚡️test: Add jest with testing library

.eslintrc.json

@@ -1,5 +1,10 @@
 {
-  "extends": ["next/core-web-vitals", "prettier"],
+  "extends": [
+    "next/core-web-vitals", 
+    "prettier", 
+    "plugin:testing-library/react", 
+    "plugin:jest-dom/recommended"
+  ],
   "rules": {
     "@next/next/no-img-element": "off",
     "@next/next/no-page-custom-font": "off",

__tests__/Home.test.tsx

@@ -0,0 +1,10 @@
+import { render, screen } from '@testing-library/react'
+import Home from '@/app/page'
+
+describe('Home', () => {
+  it('should have Docs text', () => {
+    render(<Home />)
+    const elem = screen.getByText('Docs')
+    expect(elem).toBeInTheDocument()
+  })
+})

jest.config.ts

@@ -0,0 +1,23 @@
+import type { Config } from 'jest'
+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
+const config: Config = {
+  coverageProvider: 'v8',
+  testEnvironment: 'jsdom',
+  // Add more setup options before each test is run
+  setupFilesAfterEnv: ['<rootDir>/jest.setup.ts'],
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/$1',
+    // '^@/components/(.*)$': '<rootDir>/components/$1',
+  }
+}
+
+
+// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
+export default createJestConfig(config)

jest.setup.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom'