-
Notifications
You must be signed in to change notification settings - Fork 0
🧹 [code health improvement] Remove any cast in LayoutEditor.test.tsx #298
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Changes from all commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -4,6 +4,11 @@ import LayoutEditor from "../LayoutEditor"; | |
| import { CardLayout } from "@/lib/types"; | ||
| import "@testing-library/jest-dom"; | ||
|
|
||
| interface MockWindow { | ||
| triggerDragEnd?: (event: unknown) => void; | ||
| mockIsOverId?: string; | ||
| } | ||
|
|
||
| // Mock dnd-kit components | ||
| vi.mock("@dnd-kit/core", async (importOriginal) => { | ||
| const actual = await importOriginal<typeof import("@dnd-kit/core")>(); | ||
|
|
@@ -13,7 +18,7 @@ vi.mock("@dnd-kit/core", async (importOriginal) => { | |
| <div data-testid="dnd-context" onClick={() => { | ||
| // Expose a way to trigger onDragEnd via a synthetic event or global for testing | ||
| // We'll attach it to window for easy triggering | ||
| (window as unknown as { triggerDragEnd: (event: unknown) => void }).triggerDragEnd = onDragEnd; | ||
| (window as unknown as MockWindow).triggerDragEnd = onDragEnd; | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. |
||
| }}> | ||
| {children} | ||
| </div> | ||
|
|
@@ -22,8 +27,7 @@ vi.mock("@dnd-kit/core", async (importOriginal) => { | |
| useSensor: vi.fn(() => ({})), | ||
| useDroppable: ({ id }: { id: string }) => ({ | ||
| setNodeRef: vi.fn(), | ||
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| isOver: (window as any).mockIsOverId === id, | ||
| isOver: (window as unknown as MockWindow).mockIsOverId === id, | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. |
||
| }), | ||
| PointerSensor: vi.fn(), | ||
| KeyboardSensor: vi.fn(), | ||
|
|
@@ -64,10 +68,8 @@ describe("LayoutEditor", () => { | |
| beforeEach(() => { | ||
| mockOnLayoutChange = vi.fn(); | ||
| mockOnToggleVisibility = vi.fn(); | ||
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| (window as any).triggerDragEnd = undefined; | ||
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| (window as any).mockIsOverId = undefined; | ||
| (window as unknown as MockWindow).triggerDragEnd = undefined; | ||
| (window as unknown as MockWindow).mockIsOverId = undefined; | ||
|
Comment on lines
+71
to
+72
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. |
||
| }); | ||
|
|
||
| it("renders blocks in their respective columns", () => { | ||
|
|
@@ -119,8 +121,7 @@ describe("LayoutEditor", () => { | |
| const dndContext = screen.getByTestId("dnd-context"); | ||
| fireEvent.click(dndContext); | ||
|
|
||
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| const triggerDragEnd = (window as any).triggerDragEnd; | ||
| const triggerDragEnd = (window as unknown as MockWindow).triggerDragEnd!; | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. |
||
| expect(triggerDragEnd).toBeDefined(); | ||
|
|
||
| // Drag 'avatar' to 'right' column | ||
|
|
@@ -149,8 +150,7 @@ describe("LayoutEditor", () => { | |
| const dndContext = screen.getByTestId("dnd-context"); | ||
| fireEvent.click(dndContext); | ||
|
|
||
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| const triggerDragEnd = (window as any).triggerDragEnd; | ||
| const triggerDragEnd = (window as unknown as MockWindow).triggerDragEnd!; | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. |
||
|
|
||
| // Drag 'avatar' over 'topLanguages' | ||
| triggerDragEnd({ | ||
|
|
@@ -178,8 +178,7 @@ describe("LayoutEditor", () => { | |
| const dndContext = screen.getByTestId("dnd-context"); | ||
| fireEvent.click(dndContext); | ||
|
|
||
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| const triggerDragEnd = (window as any).triggerDragEnd; | ||
| const triggerDragEnd = (window as unknown as MockWindow).triggerDragEnd!; | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. |
||
| triggerDragEnd({ | ||
| active: { id: "avatar" }, | ||
| over: null, | ||
|
|
@@ -200,8 +199,7 @@ describe("LayoutEditor", () => { | |
| const dndContext = screen.getByTestId("dnd-context"); | ||
| fireEvent.click(dndContext); | ||
|
|
||
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| const triggerDragEnd = (window as any).triggerDragEnd; | ||
| const triggerDragEnd = (window as unknown as MockWindow).triggerDragEnd!; | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. |
||
| triggerDragEnd({ | ||
| active: { id: "avatar" }, | ||
| over: { id: "avatar" }, | ||
|
|
@@ -222,8 +220,7 @@ describe("LayoutEditor", () => { | |
| const dndContext = screen.getByTestId("dnd-context"); | ||
| fireEvent.click(dndContext); | ||
|
|
||
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| const triggerDragEnd = (window as any).triggerDragEnd; | ||
| const triggerDragEnd = (window as unknown as MockWindow).triggerDragEnd!; | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. |
||
| triggerDragEnd({ | ||
| active: { id: "avatar" }, | ||
| over: { id: "non-existent-block" }, | ||
|
|
@@ -250,8 +247,7 @@ describe("LayoutEditor", () => { | |
| const dndContext = screen.getByTestId("dnd-context"); | ||
| fireEvent.click(dndContext); | ||
|
|
||
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| const triggerDragEnd = (window as any).triggerDragEnd; | ||
| const triggerDragEnd = (window as unknown as MockWindow).triggerDragEnd!; | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. |
||
|
|
||
| // Drag 'avatar' over 'stats' (downwards) | ||
| triggerDragEnd({ | ||
|
|
@@ -278,8 +274,7 @@ describe("LayoutEditor", () => { | |
| const dndContext = screen.getByTestId("dnd-context"); | ||
| fireEvent.click(dndContext); | ||
|
|
||
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| const triggerDragEnd = (window as any).triggerDragEnd; | ||
| const triggerDragEnd = (window as unknown as MockWindow).triggerDragEnd!; | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. |
||
|
|
||
| // Drag 'avatar' to empty column 'right' | ||
| triggerDragEnd({ | ||
|
|
||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Instead of defining a local interface and using repetitive double-casting (
as unknown as MockWindow), you can use global augmentation to extend theWindowinterface. This is more idiomatic in TypeScript for test files and significantly improves code readability by allowing direct access to these properties on thewindowobject.