Comfy-Org / Comfy-Org/ComfyUI_frontend

chore(tests): Consolidate duplicate mock CanvasRenderingContext2D helpers across test files

Open
#12,331 1 comment 1 reaction 1 assignee Claimed by @DrJKL View on GitHub
area:testing developer experience
Dominant language
TypeScript
Stars
2k
Forks
699
Avg merge
1d 3h
Merged PRs (30d)
495

Description

## Summary

A shared `createMockCanvasRenderingContext2D` utility already exists in `src/utils/__tests__/litegraphTestUtils.ts`, but many test files still define their own local `createMockCtx`, `createMockCanvas2DContext`, or inline mock context objects. This was noted in PR #12197 (comment: https://github.com/Comfy-Org/ComfyUI_frontend/pull/12197#discussion_r3261041464); that PR consolidated `LGraphCanvas.clipboard.test.ts` as a first fix, but the remaining files were intentionally left for a follow-up to keep the PR scoped.

Requested by @DrJKL.

## Files to update

The following test files have local/inline mock canvas 2D context implementations that should be replaced with `createMockCanvasRenderingContext2D` from `src/utils/__tests__/litegraphTestUtils.ts`:

### Local `createMockCtx` helpers
- `src/renderer/core/canvas/pathRenderer.test.ts`
- `src/renderer/extensions/vueNodes/widgets/composables/useImagePreviewWidget.test.ts`
- `src/lib/litegraph/src/LGraphCanvas.drawConnections.test.ts`
- `src/lib/litegraph/src/utils/textMeasureCache.test.ts`
- `src/composables/maskeditor/useMaskEditorSaver.test.ts`

### Local `createMockCanvas2DContext` helpers
- `src/lib/litegraph/src/LGraphCanvas.drawConnections.test.ts` (also has `createMockCtx`)
- `src/renderer/extensions/minimap/composables/useMinimap.test.ts`

### Inline mock ctx objects (vi.fn() scattered inline)
- `src/renderer/extensions/minimap/minimapCanvasRenderer.test.ts`
- `src/renderer/extensions/minimap/composables/useMinimapRenderer.test.ts`
- `src/renderer/extensions/minimap/composables/useMinimap.test.ts`
- `src/lib/litegraph/src/LGraphCanvas.groupSelection.test.ts`
- `src/lib/litegraph/src/LGraphCanvas.slotHitDetection.test.ts`
- `src/lib/litegraph/src/widgets/ComboWidget.test.ts`
- `src/lib/litegraph/src/subgraph/SubgraphSlotVisualFeedback.test.ts`
- `src/lib/litegraph/src/LGraphCanvas.titleButtons.test.ts`
- `src/lib/litegraph/src/LGraphCanvas.cloneZIndex.test.ts`
- `src/lib/litegraph/src/LGraphButton.test.ts`

## Already consolidated (reference)
These files already use the shared utility correctly:
- `src/lib/litegraph/src/LGraphCanvas.clipboard.test.ts` (fixed in #12197)
- `src/lib/litegraph/src/LGraphCanvas.linkDragAutoPan.test.ts`
- `src/lib/litegraph/src/canvas/LinkConnector.integration.test.ts`
- `src/lib/litegraph/src/LGraphCanvas.ghost.test.ts`

## Acceptance criteria
- All files listed above import and use `createMockCanvasRenderingContext2D` from `src/utils/__tests__/litegraphTestUtils.ts`.
- No local `createMockCtx` / `createMockCanvas2DContext` / inline mock object duplicates remain in test files.
- If `createMockCanvasRenderingContext2D` needs additional method stubs to satisfy certain tests, extend it in the shared utility rather than adding local overrides.
- All existing tests continue to pass.

┆Issue is synchronized with this [Notion page](https://www.notion.so/Issue-12331-chore-tests-Consolidate-duplicate-mock-CanvasRenderingContext2D-helpers-across-test-3656d73d3650814fad08dc2cc842910c) by [Unito](https://www.unito.io)

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.