-}
-
-const flowCapture = vi.hoisted(() => ({
- renders: [] as CapturedNode[][],
- setNodes: undefined as
- | ((update: CapturedNode[] | ((current: CapturedNode[]) => CapturedNode[])) => void)
- | undefined,
-}))
-
-vi.mock('./api', () => api)
-vi.mock('./erd/TableNode', () => ({ default: () => null }))
-vi.mock('./erd/export', () => ({
- downloadText: vi.fn(),
- exportDDL: vi.fn(() => ''),
- exportDiagramSvg: vi.fn(() => ''),
- exportDictionaryCsv: vi.fn(() => ''),
- exportDictionaryMarkdown: vi.fn(() => ''),
- exportPlantUml: vi.fn(() => ''),
-}))
-vi.mock('./erd/mermaid', () => ({ exportMermaid: vi.fn(() => '') }))
-vi.mock('./erd/dbml', () => ({ exportDbml: vi.fn(() => '') }))
-vi.mock('./erd/prisma', () => ({ exportPrisma: vi.fn(() => '') }))
-vi.mock('./erd/autoInfer', () => ({ inferRelationships: vi.fn(() => []) }))
-vi.mock('./components/modals', () => ({
- AddTableModal: () => null,
- CardinalityModal: () => null,
- EditEdgeModal: () => null,
- EditTableModal: () => null,
- ExportModal: () => null,
- GroupModal: () => null,
-}))
-
-vi.mock('@xyflow/react', async () => {
- const React = await import('react')
- return {
- Background: () => null,
- Controls: () => null,
- MiniMap: () => null,
- ReactFlow: (props: { nodes: CapturedNode[]; children?: React.ReactNode }) => {
- flowCapture.renders.push(props.nodes)
- return (
-
- {props.nodes.map((node) => {String(node.data.title)})}
- {props.children}
-
- )
- },
- addEdge: (edge: unknown, edges: unknown[]) => [...edges, edge],
- useNodesState: (initial: CapturedNode[]) => {
- const [nodes, setNodes] = React.useState(initial)
- flowCapture.setNodes = setNodes as typeof flowCapture.setNodes
- return [nodes, setNodes, vi.fn()]
- },
- useEdgesState: (initial: unknown[]) => {
- const [edges, setEdges] = React.useState(initial)
- return [edges, setEdges, vi.fn()]
- },
- }
-})
-
-const graphData = vi.hoisted(() => ({
- firstUsers: {
- title: 'public.users',
- columns: [{ column_name: 'id', data_type: 'bigint', is_not_null: true, is_pk: true }],
- badges: { pk: true, fk: false },
- },
- firstOrders: {
- title: 'public.orders',
- columns: [{ column_name: 'user_id', data_type: 'bigint', is_not_null: true, is_pk: false }],
- badges: { pk: false, fk: true },
- },
- secondAccounts: {
- title: 'public.accounts',
- columns: [{ column_name: 'account_id', data_type: 'bigint', is_not_null: true, is_pk: true }],
- badges: { pk: true, fk: false },
- },
-}))
-
-vi.mock('./erd/convert', () => ({
- snapshotToGraph: vi.fn((snapshotJson: { marker?: string }) => snapshotJson.marker === 'second'
- ? { nodes: [{ id: 'accounts', type: 'tableNode', position: { x: 0, y: 0 }, data: graphData.secondAccounts }], edges: [] }
- : {
- nodes: [
- { id: 'users', type: 'tableNode', position: { x: 0, y: 0 }, data: graphData.firstUsers },
- { id: 'orders', type: 'tableNode', position: { x: 200, y: 0 }, data: graphData.firstOrders },
- ],
- edges: [],
- }),
-}))
-
-import App from './App'
-
-const projects = [{ project_space_uuid: 'project-one', project_name: 'Project One' }]
-const snapshots = [
- { schema_snapshot_uuid: 'snapshot-one', status: 'running', schema_filter: null },
- { schema_snapshot_uuid: 'snapshot-two', status: 'succeeded', schema_filter: null },
-]
-
-function detail(id: string, marker: string, status = 'succeeded') {
- return {
- schema_snapshot_uuid: id,
- status,
- schema_filter: null,
- error_message: null,
- snapshot_json: { marker, relations: [], columns: [], pk_columns: [], fk_edges: [] },
- }
-}
-
-async function renderReadyApp() {
- render()
- await waitFor(() => expect(api.listSnapshots).toHaveBeenCalledWith('project-one'))
-}
-
-async function diagramOpenButtons() {
- fireEvent.click(screen.getByRole('button', { name: '๋ค์ด์ด๊ทธ๋จ' }))
- return screen.findAllByRole('button', { name: '์ด๊ธฐ' })
-}
-
-async function openSnapshot(index: number) {
- const openButtons = await diagramOpenButtons()
- fireEvent.click(openButtons[index]!)
- await waitFor(() => expect(api.getSnapshot).toHaveBeenCalled())
-}
-
-function lastNodeData(nodeId: string): Record {
- const data = flowCapture.renders.at(-1)?.find((node) => node.id === nodeId)?.data
- if (!data) throw new Error(`No rendered data captured for ${nodeId}`)
- return data
-}
-
-describe('App search identity and polling isolation', () => {
- beforeEach(() => {
- vi.clearAllMocks()
- flowCapture.renders.length = 0
- flowCapture.setNodes = undefined
- api.getMe.mockResolvedValue({ subject: 'user-one', display_name: 'User One' })
- api.listProjects.mockResolvedValue(projects)
- api.listConnections.mockResolvedValue([])
- api.listSnapshots.mockResolvedValue(snapshots)
- api.createShareLink.mockResolvedValue({ url: 'https://example.test/share' })
- })
-
- afterEach(() => {
- vi.useRealTimers()
- cleanup()
- })
-
- it('preserves decorated data identity for normalized-query and position-only updates', async () => {
- api.getSnapshot.mockResolvedValue(detail('snapshot-one', 'first'))
- await renderReadyApp()
- await openSnapshot(0)
- await screen.findByText('public.users')
-
- const search = screen.getByLabelText('ํ
์ด๋ธ ๋๋ ์ปฌ๋ผ ๊ฒ์')
- fireEvent.change(search, { target: { value: 'users' } })
- await waitFor(() => expect(lastNodeData('users').isHighlighted).toBe(true))
- const firstDecorated = lastNodeData('users')
-
- fireEvent.change(search, { target: { value: ' users ' } })
- await waitFor(() => expect(search).toHaveValue(' users '))
- expect(lastNodeData('users')).toBe(firstDecorated)
-
- await act(async () => {
- flowCapture.setNodes?.((current) => current.map((node) => (
- node.id === 'users'
- ? { ...node, position: { x: node.position.x + 25, y: node.position.y } }
- : node
- )))
- })
- expect(lastNodeData('users')).toBe(firstDecorated)
-
- await act(async () => {
- flowCapture.setNodes?.((current) => current.map((node) => (
- node.id === 'users' ? { ...node, data: { ...node.data } } : node
- )))
- })
- const replacedSourceData = lastNodeData('users')
- expect(replacedSourceData).not.toBe(firstDecorated)
-
- fireEvent.change(search, { target: { value: 'orders' } })
- await waitFor(() => expect(lastNodeData('orders').isHighlighted).toBe(true))
- expect(lastNodeData('users')).not.toBe(replacedSourceData)
- expect(graphData.firstUsers).not.toHaveProperty('isHighlighted')
- })
-
- it('ignores a terminal response from a superseded snapshot request', async () => {
- let resolveFirst!: (value: ReturnType) => void
- api.getSnapshot.mockImplementation((snapshotId: string) => {
- if (snapshotId === 'snapshot-one') {
- return new Promise((resolve) => { resolveFirst = resolve })
- }
- return Promise.resolve(detail('snapshot-two', 'second'))
- })
-
- await renderReadyApp()
- await openSnapshot(0)
- await waitFor(() => expect(api.getSnapshot).toHaveBeenCalledWith('snapshot-one'))
-
- await openSnapshot(1)
- await screen.findByText('public.accounts')
- const refreshCountAfterCurrentTerminal = api.listSnapshots.mock.calls.length
-
- await act(async () => {
- resolveFirst(detail('snapshot-one', 'first'))
- await Promise.resolve()
- })
-
- expect(screen.getByText('public.accounts')).toBeInTheDocument()
- expect(screen.queryByText('public.users')).not.toBeInTheDocument()
- expect(api.listSnapshots).toHaveBeenCalledTimes(refreshCountAfterCurrentTerminal)
- })
-
- it('does not publish a stale polling rejection after the selected snapshot changes', async () => {
- let rejectFirst!: (reason: Error) => void
- api.getSnapshot.mockImplementation((snapshotId: string) => {
- if (snapshotId === 'snapshot-one') {
- return new Promise((_, reject) => { rejectFirst = reject })
- }
- return Promise.resolve(detail('snapshot-two', 'second'))
- })
-
- await renderReadyApp()
- await openSnapshot(0)
- await openSnapshot(1)
- await screen.findByText('public.accounts')
-
- await act(async () => {
- rejectFirst(new Error('stale polling failure with secret detail'))
- await Promise.resolve()
- })
-
- expect(screen.getByText('public.accounts')).toBeInTheDocument()
- expect(screen.queryByText(/stale polling failure with secret detail/i)).not.toBeInTheDocument()
- })
-
- it('waits for each non-terminal request before scheduling the next poll', async () => {
- let resolveFirst!: (value: ReturnType) => void
- let resolveSecond!: (value: ReturnType) => void
- api.getSnapshot
- .mockImplementationOnce(() => new Promise((resolve) => { resolveFirst = resolve }))
- .mockImplementationOnce(() => new Promise((resolve) => { resolveSecond = resolve }))
-
- await renderReadyApp()
- const openButtons = await diagramOpenButtons()
- vi.useFakeTimers()
-
- fireEvent.click(openButtons[0]!)
- await act(async () => { await Promise.resolve() })
- expect(api.getSnapshot).toHaveBeenCalledTimes(1)
-
- await act(async () => { await vi.advanceTimersByTimeAsync(2000) })
- expect(api.getSnapshot).toHaveBeenCalledTimes(1)
-
- await act(async () => {
- resolveFirst(detail('snapshot-one', 'first', 'running'))
- await Promise.resolve()
- })
- await act(async () => { await vi.advanceTimersByTimeAsync(999) })
- expect(api.getSnapshot).toHaveBeenCalledTimes(1)
- await act(async () => { await vi.advanceTimersByTimeAsync(1) })
- expect(api.getSnapshot).toHaveBeenCalledTimes(2)
-
- await act(async () => {
- resolveSecond(detail('snapshot-one', 'first'))
- await Promise.resolve()
- })
- await act(async () => { await vi.advanceTimersByTimeAsync(5000) })
- expect(api.getSnapshot).toHaveBeenCalledTimes(2)
- })
-})
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 011a1612c..0fa62ede3 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -198,30 +198,20 @@ export default function App() {
const searchMatchedNodeIds = useMemo(() => {
return findSearchMatchedNodeIds(nodes, normalizedNodeSearch);
}, [nodes, normalizedNodeSearch]);
-
- // โก Bolt: Cache decorated search state to preserve node.data identity during 60fps drag updates
- const searchCache = useMemo(() => new WeakMap(), [normalizedNodeSearch]);
-
const visibleNodes = useMemo(() => {
if (!normalizedNodeSearch) return nodes;
-
return nodes.map((node) => {
- let cachedData = searchCache.get(node.data);
- if (!cachedData) {
- const isHighlighted = searchMatchedNodeIds.has(node.id);
- cachedData = {
+ const isHighlighted = searchMatchedNodeIds.has(node.id);
+ return {
+ ...node,
+ data: {
...node.data,
isDimmed: !isHighlighted,
isHighlighted,
- };
- searchCache.set(node.data, cachedData);
- }
- return {
- ...node,
- data: cachedData,
+ },
};
});
- }, [nodes, normalizedNodeSearch, searchMatchedNodeIds, searchCache]);
+ }, [nodes, normalizedNodeSearch, searchMatchedNodeIds]);
const nodeSearchStatus = normalizedNodeSearch
? `${searchMatchedNodeIds.size}๊ฐ ํ
์ด๋ธ ์ผ์น`
: "";
@@ -319,46 +309,22 @@ export default function App() {
useEffect(() => {
if (!snapshotId) return;
- let isCurrent = true;
- let timer: number | null = null;
-
- async function poll() {
- try {
- const s = await getSnapshot(snapshotId as string);
- if (!isCurrent) return;
- setSnapshot(s);
-
- if (s.status === "succeeded" || s.status === "failed" || s.status === "not_found") {
- if (selectedProjectId) {
- try {
- const snaps = await listSnapshots(selectedProjectId);
- if (isCurrent) setSnapshots(snaps);
- } catch (e) {
- if (isCurrent) setError(String(e));
+ const timer = setInterval(() => {
+ getSnapshot(snapshotId)
+ .then((s) => {
+ setSnapshot(s);
+ if (s.status === "succeeded" || s.status === "failed" || s.status === "not_found") {
+ clearInterval(timer);
+ if (selectedProjectId) {
+ listSnapshots(selectedProjectId)
+ .then(setSnapshots)
+ .catch((e) => setError(String(e)));
}
}
- return;
- }
-
- if (isCurrent) {
- timer = window.setTimeout(poll, 1000);
- }
- } catch (e) {
- if (isCurrent) {
- setError(String(e));
- timer = window.setTimeout(poll, 1000);
- }
- }
- }
-
- poll();
-
- return () => {
- isCurrent = false;
- if (timer !== null) {
- clearTimeout(timer);
- }
- };
+ })
+ .catch((e) => setError(String(e)));
+ }, 1000);
+ return () => clearInterval(timer);
}, [selectedProjectId, snapshotId]);
const graph = useMemo(() => {
@@ -862,6 +828,7 @@ export default function App() {
function onDeleteTable() {
if (!editingNode) return;
+ if (!window.confirm("์ ๋ง๋ก ์ด ํ
์ด๋ธ์ ์ญ์ ํ์๊ฒ ์ต๋๊น?")) return;
// Remove the node
setNodes((nds) => nds.filter((n) => n.id !== editingNode.id));
diff --git a/frontend/src/components/modals/ModalCoverage.test.tsx b/frontend/src/components/modals/ModalCoverage.test.tsx
index 998c95d6f..8974d6089 100644
--- a/frontend/src/components/modals/ModalCoverage.test.tsx
+++ b/frontend/src/components/modals/ModalCoverage.test.tsx
@@ -116,8 +116,7 @@ describe('modal behavior coverage', () => {
fireEvent.change(screen.getByLabelText('์ ์ฝ์กฐ๊ฑด ์ด๋ฆ (Label)'), {
target: { value: 'fk_changed' },
})
- vi.spyOn(window, 'confirm').mockReturnValueOnce(false).mockReturnValueOnce(true)
- fireEvent.click(screen.getByRole('button', { name: '์ญ์ ' }))
+ vi.spyOn(window, 'confirm').mockReturnValueOnce(true)
fireEvent.click(screen.getByRole('button', { name: '์ญ์ ' }))
expect(window.confirm).toHaveBeenCalledWith("์ด ๊ด๊ณ๋ฅผ ์ญ์ ํ์๊ฒ ์ต๋๊น?")
fireEvent.click(screen.getByRole('button', { name: '์ทจ์' }))
@@ -247,8 +246,6 @@ describe('modal behavior coverage', () => {
)
expect(screen.getByText('๋ฑ๋ก๋ ๊ทธ๋ฃน์ด ์์ต๋๋ค.')).toBeInTheDocument()
expect(screen.getByRole('button', { name: '์ถ๊ฐ' })).toBeDisabled()
- fireEvent.submit(screen.getByRole('button', { name: '์ถ๊ฐ' }).closest('form')!)
- expect(onCreate).not.toHaveBeenCalled()
rerender(
{
fireEvent.change(screen.getByLabelText('๊ทธ๋ฃน ์ด๋ฆ'), { target: { value: 'New' } })
fireEvent.click(screen.getAllByRole('button', { name: /^์์ / })[1]!)
fireEvent.click(screen.getByRole('button', { name: '์ถ๊ฐ' }))
- vi.spyOn(window, 'confirm').mockReturnValueOnce(false).mockReturnValueOnce(true)
- fireEvent.click(screen.getByRole('button', { name: 'Billing ๊ทธ๋ฃน ์ญ์ ' }))
+ vi.spyOn(window, 'confirm').mockReturnValueOnce(true)
fireEvent.click(screen.getByRole('button', { name: 'Billing ๊ทธ๋ฃน ์ญ์ ' }))
expect(window.confirm).toHaveBeenCalledWith("'Billing' ๊ทธ๋ฃน์ ์ญ์ ํ์๊ฒ ์ต๋๊น?")
fireEvent.change(screen.getByRole('combobox'), { target: { value: '' } })
diff --git a/frontend/src/erd/__tests__/prisma.test.ts b/frontend/src/erd/__tests__/prisma.test.ts
index 07885df09..73bca1a66 100644
--- a/frontend/src/erd/__tests__/prisma.test.ts
+++ b/frontend/src/erd/__tests__/prisma.test.ts
@@ -191,54 +191,6 @@ describe('exportPrisma', () => {
expect(result).toContain('model B');
});
- it('ignores non-source handles and renders singular back-relations for primary keys', () => {
- const nodes: Node[] = [
- {
- id: 'parent',
- position: { x: 0, y: 0 },
- data: {
- title: 'parents',
- badges: { pk: true, fk: false },
- columns: [
- { column_name: 'id', data_type: 'serial', is_pk: true, is_not_null: true },
- ],
- },
- },
- {
- id: 'child',
- position: { x: 100, y: 0 },
- data: {
- title: 'children',
- badges: { pk: true, fk: true },
- columns: [
- { column_name: 'id', data_type: 'integer', is_pk: true, is_not_null: true },
- ],
- },
- },
- ];
-
- const result = exportPrisma(nodes, [
- {
- id: 'ignored-handle',
- source: 'child',
- target: 'parent',
- sourceHandle: 'legacy-id',
- targetHandle: 'tgt-id',
- },
- {
- id: 'primary-key-relation',
- source: 'child',
- target: 'parent',
- sourceHandle: 'src-id',
- targetHandle: 'tgt-id',
- label: 'child_parent',
- },
- ]);
-
- expect(result).toContain('children_id children? @relation("child_parent")');
- expect(result).not.toContain('@relation("children_parents"');
- });
-
it('handles missing is_not_null logic for optional relationships', () => {
const nodes: Node[] = [
{
From ebb3d7564e761ff492a3547f4eccbc18fc676fcb Mon Sep 17 00:00:00 2001
From: seonghobae <8172694+seonghobae@users.noreply.github.com>
Date: Thu, 13 Aug 2026 21:18:13 +0000
Subject: [PATCH 8/8] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20Fix=20flaky=20cov?=
=?UTF-8?q?erage=20test=20and=20remove=20accidental=20lockfile?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
๐ก What: `frontend/src/App.coverage.test.tsx`์์ ๊ฒ์ ์คํจ ์ ๋น ์ํ๋ฅผ ํ์ธํ๋ ๋จ์ธ๋ฌธ์ ๋๊ธฐ `getByText`์์ ๋น๋๊ธฐ `await findByText`๋ก ์์ ํ์ฌ ํ
์คํธ ์ ๋ขฐ์ฑ์ ๋์์ผ๋ฉฐ, ์๋ชป ์ถ๊ฐ๋ `frontend/pnpm-lock.yaml` ํ์ผ์ ์ญ์ ํ์ต๋๋ค.
๐ฏ Why: CI ํ๊ฒฝ์์ ์ํ ์
๋ฐ์ดํธ๊ฐ ์๋ฃ๋๊ธฐ ์ ๋๊ธฐ ์ฟผ๋ฆฌ๊ฐ ์คํ๋์ด ๊ฐํ์ ์ธ ํ
์คํธ ์คํจ(Flaky test)๊ฐ ๋ฐ์ํ๊ณ ์์์ต๋๋ค. ๋ํ ์๋์น ์์ ํจํค์ง ๋งค๋์ ์คํ์ผ๋ก ์ธํด ์ค๋ณต๋ ์ ๊ธ ํ์ผ์ด ์์ฑ๋์์ต๋๋ค.
โฟ Accessibility: N/A (Test reliability & repo maintenance)