Merge pull request #64 from ssu-commerce/feature/SCF-55

SCF-63

Author: osydoo

apps/commerce/__tests__/mock.test.tsx

@@ -0,0 +1,13 @@
+import "@testing-library/jest-dom";
+import { render, screen } from "@testing-library/react";
+import Page from "../app/page";
+
+describe("Page", () => {
+  it("renders a heading", () => {
+    render(<Page />);
+
+    const heading = screen.getByText("main");
+
+    expect(heading).toBeInTheDocument();
+  });
+});

apps/commerce/jest.config.js

@@ -0,0 +1,15 @@
+const nextJest = require("next/jest");
+
+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 customJestConfig = {
+  setupFilesAfterEnv: ["<rootDir>/jest.setup.js"],
+  testEnvironment: "jsdom",
+};
+
+// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
+module.exports = createJestConfig(customJestConfig);

apps/commerce/jest.setup.js

@@ -0,0 +1,2 @@
+// Learn more: https://github.com/testing-library/jest-dom
+import "@testing-library/jest-dom"; // Learn more: https://github.com/testing-library/jest-dom

apps/commerce/package.json

@@ -6,6 +6,8 @@
     "dev": "next dev --port 3001",
     "build": "next build",
     "start": "next start",
+    "test": "jest",
+    "test:watch": "jest --watch",
     "lint": "next lint --fix",
     "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf .next"
   },
@@ -29,13 +31,18 @@
     "zustand": "^4.5.2"
   },
   "devDependencies": {
+    "@sc-config/jest": "workspace:*",
     "@next/eslint-plugin-next": "^13.4.19",
     "@svgr/webpack": "^8.1.0",
     "@tanstack/eslint-plugin-query": "^5.17.7",
+    "@testing-library/jest-dom": "^6.1.4",
+    "@testing-library/react": "^14.0.0",
     "@types/node": "^18.17.0",
     "@types/react": "^18.2.0",
     "@types/react-dom": "^18.2.0",
     "eslint-config-sc": "workspace:*",
+    "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.6.4",
     "tsconfig-sc": "workspace:*",
     "typescript": "^5.2.2"
   }

apps/commerce/tsconfig.json

@@ -16,7 +16,9 @@
     "**/*.tsx",
     ".next/types/**/*.ts",
     "global.d.ts",
-    "styles.d.ts"
+    "styles.d.ts",
+    "jest.config.js",
+    "jest.setup.js"
   ],
   "exclude": ["node_modules"]
 }

pnpm-lock.yaml

@@ -5,12 +5,13 @@
   "scripts": {
     "dev": "storybook dev -p 6006",
     "build": "storybook build --docs",
+    "build-storybook": "storybook build --docs",
     "preview-storybook": "serve storybook-static",
     "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf storybook-static",
     "lint": "eslint src/ --fix",
     "test": "concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"npx http-server storybook-static --port 6006 --silent\" \"npx wait-on tcp:6006 && pnpm test-storybook\"",
     "test:watch": "test-storybook --watch",
-    "chromatic": "npx chromatic"
+    "chromatic": "npx chromatic --project-token=chpt_bcfcb25b665220e"
   },
   "dependencies": {
     "@sc/shared": "workspace:*",