Merge pull request #4871 from yuki0410-dev/feat/4700_jest

[typescript-migration] move test and fix jest config
Hacker0x01 · Jun 8, 2024 · 1b0a813 · 1b0a813
2 parents 6744400 + 2c3f920
commit 1b0a813
Show file tree

Hide file tree

Showing 41 changed files with 531 additions and 421 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -14,7 +14,7 @@ const config = {
   parser: "@typescript-eslint/parser",
   plugins: ["@typescript-eslint", "import", "unused-imports"],
   parserOptions: {
-    project: ["./tsconfig.dev.json"],
+    project: ["./tsconfig.json"],
   },
   rules: {
     "no-unused-vars": "off", // Duplicate with unused-import/no-unused-vars

diff --git a/jest.config.js b/jest.config.js
@@ -1,6 +1,56 @@
+const babelTargetList = [
+  "helper_components/custom_input\\.tsx",
+  "calendar_test\\.test\\.tsx",
+  "datepicker_test\\.test\\.tsx",
+  "min_time_test\\.test\\.tsx",
+  "month_dropdown_test\\.test\\.tsx",
+  "month_test\\.test\\.tsx",
+  "month_year_dropdown_test\\.test\\.tsx",
+  "multi_month_test\\.test\\.tsx",
+  "multiple_selected_dates\\.test\\.tsx",
+  "week_number_test\\.test\\.tsx",
+];
+
+const tsTargetList = [
+  "helper_components/calendar_icon\\.tsx",
+  // "helper_components/custom_input\\.tsx",
+  "helper_components/custom_time_input\\.tsx",
+  "helper_components/test_wrapper\\.tsx",
+  "calendar_icon\\.test\\.tsx",
+  // "calendar_test\\.test\\.tsx",
+  "date_utils_test\\.test\\.ts",
+  // "datepicker_test\\.test\\.tsx",
+  "day_test\\.test\\.tsx",
+  "exclude_dates\\.test\\.tsx",
+  "exclude_time_period_test\\.test\\.tsx",
+  "exclude_times_test\\.test\\.tsx",
+  "filter_times_test\\.test\\.tsx",
+  "include_times_test\\.test\\.tsx",
+  "index\\.ts",
+  "inject_times_test\\.test\\.tsx",
+  // "min_time_test\\.test\\.tsx",
+  // "month_dropdown_test\\.test\\.tsx",
+  // "month_test\\.test\\.tsx",
+  // "month_year_dropdown_test\\.test\\.tsx",
+  // "multi_month_test\\.test\\.tsx",
+  // "multiple_selected_dates\\.test\\.tsx",
+  "run_axe\\.tsx",
+  "show_time_test\\.test\\.tsx",
+  "test_utils\\.ts",
+  "time_format_test\\.test\\.tsx",
+  "time_input_test\\.test\\.tsx",
+  "timepicker_test\\.test\\.tsx",
+  // "week_number_test\\.test\\.tsx",
+  "week_picker_test\\.test\\.tsx",
+  "week_test\\.test\\.tsx",
+  "year_dropdown_options_test\\.test\\.tsx",
+  "year_dropdown_test\\.test\\.tsx",
+  "year_picker_test\\.test\\.tsx",
+];
+
 module.exports = {
-  roots: ["./test"],
-  setupFilesAfterEnv: ["<rootDir>/test/index.ts"],
+  roots: ["./src/test"],
+  setupFilesAfterEnv: ["<rootDir>/src/test/index.ts"],
   testEnvironment: "jest-environment-jsdom",
   collectCoverage: true,
   coverageReporters: ["json", "lcov", "text", "clover"],
@@ -11,7 +61,26 @@ module.exports = {
   ],
   transformIgnorePatterns: ["/node_modules/(?!date-fns)"],
   transform: {
-    "^.+\\.(js|jsx|ts|tsx)$": "babel-jest",
+    "^.+\\.(js|jsx)$": "babel-jest",
+    ...babelTargetList.reduce((prev, item) => {
+      return {
+        ...prev,
+        // [`^<rootDir>/src/test/${item}$`]: "babel-jest",
+        [`^.+/src/test/${item}$`]: "babel-jest",
+        // [`^<rootDir>/${item}$`]: "babel-jest",
+        // [`^.+/${item}$`]: "babel-jest",
+      };
+    }, {}),
+    ...tsTargetList.reduce((prev, item) => {
+      return {
+        ...prev,
+        // [`^<rootDir>/src/test/${item}$`]: "ts-jest",
+        [`^.+/src/test/${item}$`]: "ts-jest",
+        // [`^<rootDir>/${item}$`]: "ts-jest",
+        // [`^.+/${item}$`]: "ts-jest",
+      };
+    }, {}),
+    "^.+/src/(?!test/).*\\.(ts|tsx)$": "ts-jest",
     // TODO: use it after the migration
     // "^.+\\.ts?$": "ts-jest",
     "node_modules/(?!date-fns/.*)": "ts-jest",

diff --git a/package.json b/package.json
@@ -6,6 +6,7 @@
   "license": "MIT",
   "homepage": "https://github.com/Hacker0x01/react-datepicker",
   "main": "dist/index.js",
+  "types": "dist/index.d.ts",
   "browser": "dist/react-datepicker.min.js",
   "module": "dist/es/index.js",
   "unpkg": "dist/react-datepicker.min.js",
@@ -86,7 +87,7 @@
     "react-onclickoutside": "^6.13.0"
   },
   "scripts": {
-    "eslint": "eslint --ext .js,.jsx,.ts,.tsx src test",
+    "eslint": "eslint --ext .js,.jsx,.ts,.tsx ./src",
     "precommit": "lint-staged --allow-empty",
     "sass-lint": "stylelint 'src/stylesheets/*.scss'",
     "lint": "yarn run eslint && yarn run sass-lint",
@@ -96,15 +97,14 @@
     "test": "NODE_ENV=test jest",
     "test:ci": "NODE_ENV=test jest --ci --coverage",
     "test:watch": "NODE_OPTIONS=--openssl-legacy-provider NODE_ENV=test jest --watch",
-    "build": "NODE_ENV=production yarn run build:src && NODE_ENV=production yarn run css:prod && NODE_ENV=production yarn run css:modules:dev && NODE_ENV=production yarn run css:dev && NODE_ENV=production yarn run css:modules:dev && NODE_ENV=production yarn run build:types",
-    "build-dev": "NODE_ENV=development yarn run js:dev && NODE_ENV=development yarn run css:dev && NODE_ENV=development yarn run css:modules:dev && NODE_ENV=production yarn run build:types",
+    "build": "NODE_ENV=production yarn run build:src && NODE_ENV=production yarn run css:prod && NODE_ENV=production yarn run css:modules:dev && NODE_ENV=production yarn run css:dev && NODE_ENV=production yarn run css:modules:dev",
+    "build-dev": "NODE_ENV=development yarn run js:dev && NODE_ENV=development yarn run css:dev && NODE_ENV=development yarn run css:modules:dev",
     "css:prod": "sass --style compressed src/stylesheets/datepicker.scss > dist/react-datepicker.min.css",
     "css:modules:prod": "sass --style compressed src/stylesheets/datepicker-cssmodules.scss | tee dist/react-datepicker-cssmodules.min.css dist/react-datepicker-min.module.css",
     "css:dev": "sass --style expanded src/stylesheets/datepicker.scss > dist/react-datepicker.css",
     "css:modules:dev": "sass --style expanded src/stylesheets/datepicker-cssmodules.scss | tee dist/react-datepicker-cssmodules.css dist/react-datepicker.module.css",
-    "type-check": "tsc --noEmit",
+    "type-check": "tsc --project tsconfig.build.json --noEmit",
     "type-check:watch": "npm run type-check -- --watch",
-    "build:types": "tsc --emitDeclarationOnly",
     "build:src": "rollup -c",
     "js:dev": "rollup -cw",
     "prepare": "husky install"

diff --git a/rollup.config.mjs b/rollup.config.mjs
@@ -13,9 +13,9 @@ import typescript from "@rollup/plugin-typescript";
 const pkg = JSON.parse(
   fs
     .readFileSync(
-      path.join(path.dirname(fileURLToPath(import.meta.url)), "package.json")
+      path.join(path.dirname(fileURLToPath(import.meta.url)), "package.json"),
     )
-    .toString()
+    .toString(),
 );
 
 const banner = `/*!
@@ -33,10 +33,10 @@ const dateFnsPackageJson = JSON.parse(
     .readFileSync(
       path.join(
         path.dirname(fileURLToPath(import.meta.url)),
-        "node_modules/date-fns/package.json"
-      )
+        "node_modules/date-fns/package.json",
+      ),
     )
-    .toString()
+    .toString(),
 );
 const dateFnsSubpackages = Object.keys(dateFnsPackageJson.exports)
   .map((key) => key.replace("./", ""))
@@ -101,7 +101,7 @@ const config = {
     babel(),
     commonjs(),
     typescript({
-      tsconfig: "./tsconfig.json",
+      tsconfig: "./tsconfig.build.json",
       declaration: true,
       declarationDir: "dist",
     }),

diff --git a/test/calendar_icon.test.tsx → src/test/calendar_icon.test.tsx b/test/calendar_icon.test.tsx → src/test/calendar_icon.test.tsx
@@ -1,12 +1,12 @@
 import { render, fireEvent } from "@testing-library/react";
 import React from "react";
 
-import CalendarIcon from "../src/calendar_icon";
+import CalendarIcon from "../calendar_icon";
 
 import { IconParkSolidApplication } from "./helper_components/calendar_icon";
 
 describe("CalendarIcon", () => {
-  let onClickMock;
+  let onClickMock: jest.Mock;
   beforeEach(() => {
     onClickMock = jest.fn();
   });

diff --git a/test/calendar_test.test.tsx → src/test/calendar_test.test.tsx b/test/calendar_test.test.tsx → src/test/calendar_test.test.tsx
@@ -9,7 +9,7 @@ import { eo } from "date-fns/locale/eo";
 import { fi } from "date-fns/locale/fi";
 import React from "react";
 
-import Calendar from "../src/calendar";
+import Calendar from "../calendar";
 import {
   KeyType,
   getMonthInLocale,
@@ -28,12 +28,12 @@ import {
   isSameDay,
   subMonths,
   subYears,
-} from "../src/date_utils";
-import DatePicker from "../src/index";
+} from "../date_utils";
+import DatePicker from "../index";
 
 import { getKey } from "./test_utils";
 
-import type { Locale } from "../src/date_utils";
+import type { Locale } from "../date_utils";
 import type { Day } from "date-fns";
 
 // TODO Possibly rename

diff --git a/test/date_utils_test.test.ts → src/test/date_utils_test.test.ts b/test/date_utils_test.test.ts → src/test/date_utils_test.test.ts
@@ -51,7 +51,7 @@ import {
   getMidnightDate,
   registerLocale,
   isMonthYearDisabled,
-} from "../src/date_utils";
+} from "../date_utils";
 
 registerLocale("pt-BR", ptBR);
 
@@ -318,20 +318,20 @@ describe("date_utils", () => {
 
     it("should be enabled if date filter returns true", () => {
       const day = newDate();
-      const filterDate = (d) => isEqual(d, day);
+      const filterDate = (d: Date) => isEqual(d, day);
       expect(isDayDisabled(day, { filterDate })).toBe(false);
     });
 
     it("should be disabled if date filter returns false", () => {
       const day = newDate();
-      const filterDate = (d) => !isEqual(d, day);
+      const filterDate = (d: Date) => !isEqual(d, day);
       expect(isDayDisabled(day, { filterDate })).toBe(true);
     });
 
     it("should not allow date filter to modify input date", () => {
       const day = newDate();
       const dayClone = newDate(day);
-      const filterDate = (d) => {
+      const filterDate = (d: Date) => {
         addDays(d, 1);
         return true;
       };
@@ -456,20 +456,20 @@ describe("date_utils", () => {
 
     it("should be enabled if date filter returns true", () => {
       const day = newDate();
-      const filterDate = (d) => isEqual(d, day);
+      const filterDate = (d: Date) => isEqual(d, day);
       expect(isMonthDisabled(day, { filterDate })).toBe(false);
     });
 
     it("should be disabled if date filter returns false", () => {
       const day = newDate();
-      const filterDate = (d) => !isEqual(d, day);
+      const filterDate = (d: Date) => !isEqual(d, day);
       expect(isMonthDisabled(day, { filterDate })).toBe(true);
     });
 
     it("should not allow date filter to modify input date", () => {
       const day = newDate();
       const dayClone = newDate(day);
-      const filterDate = (d) => {
+      const filterDate = (d: Date) => {
         addDays(d, 40);
         return true;
       };
@@ -540,20 +540,20 @@ describe("date_utils", () => {
 
     it("should be enabled if date filter returns true", () => {
       const day = newDate();
-      const filterDate = (d) => isEqual(d, day);
+      const filterDate = (d: Date) => isEqual(d, day);
       expect(isQuarterDisabled(day, { filterDate })).toBe(false);
     });
 
     it("should be disabled if date filter returns false", () => {
       const day = newDate();
-      const filterDate = (d) => !isEqual(d, day);
+      const filterDate = (d: Date) => !isEqual(d, day);
       expect(isQuarterDisabled(day, { filterDate })).toBe(true);
     });
 
     it("should not allow date filter to modify input date", () => {
       const day = newDate();
       const dayClone = newDate(day);
-      const filterDate = (d) => {
+      const filterDate = (d: Date) => {
         addDays(d, 40);
         return true;
       };
@@ -605,12 +605,12 @@ describe("date_utils", () => {
     });
 
     it("should be enabled if date filter returns true", () => {
-      const filterDate = (d) => isSameYear(d, newYearsDay);
+      const filterDate = (d: Date) => isSameYear(d, newYearsDay);
       expect(isYearDisabled(year, { filterDate })).toBe(false);
     });
 
     it("should be disabled if date filter returns false", () => {
-      const filterDate = (d) => !isSameYear(d, newYearsDay);
+      const filterDate = (d: Date) => !isSameYear(d, newYearsDay);
       expect(isYearDisabled(year, { filterDate })).toBe(true);
     });
   });
@@ -868,22 +868,22 @@ describe("date_utils", () => {
     it("should be enabled if time filter returns true", () => {
       const date = newDate();
       const time = setHours(setMinutes(date, 30), 1);
-      const filterTime = (t) => isEqual(t, time);
+      const filterTime = (t: Date) => isEqual(t, time);
       expect(isTimeDisabled(time, { filterTime })).toBe(false);
     });
 
     it("should be disabled if time filter returns false", () => {
       const date = newDate();
       const time = setHours(setMinutes(date, 30), 1);
-      const filterTime = (t) => !isEqual(t, time);
+      const filterTime = (t: Date) => !isEqual(t, time);
       expect(isTimeDisabled(time, { filterTime })).toBe(true);
     });
 
     it("should not allow time filter to modify input time", () => {
       const date = newDate();
       const time = setHours(setMinutes(date, 30), 1);
       const timeClone = newDate(time);
-      const filterTime = (t) => {
+      const filterTime = (t: Date) => {
         addHours(t, 1);
         return true;
       };

diff --git a/test/datepicker_test.test.tsx → src/test/datepicker_test.test.tsx b/test/datepicker_test.test.tsx → src/test/datepicker_test.test.tsx
@@ -22,8 +22,8 @@ import {
   subMonths,
   subWeeks,
   subYears,
-} from "../src/date_utils";
-import DatePicker, { registerLocale } from "../src/index";
+} from "../date_utils";
+import DatePicker, { registerLocale } from "../index";
 
 import CustomInput from "./helper_components/custom_input";
 import TestWrapper from "./helper_components/test_wrapper";