Skip to content

Commit c38ea5e

Browse files
mathuoclaude
andcommitted
test: Add comprehensive tests for dropdown close button functionality
Added extensive test coverage for the fixed close button behavior in tab overflow dropdowns: Core DefaultTab Tests: - Verify close button prevents default behavior - Test that already prevented events are respected - Confirm close button visibility by default TabsContainer Dropdown Tests: - Test close button visibility and clickability in dropdowns - Verify tab content clicks still activate tabs properly - Test preventDefault behavior in dropdown wrapper - Ensure proper separation of close vs activate functionality These tests verify that close buttons work correctly in both normal tabs and overflow dropdown tabs, with proper event handling. 🤖 Generated with Claude Code (https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
1 parent 55207e3 commit c38ea5e

File tree

4 files changed

+443
-2
lines changed

4 files changed

+443
-2
lines changed

packages/dockview-core/src/__tests__/dockview/components/tab/defaultTab.spec.ts

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -60,4 +60,81 @@ describe('defaultTab', () => {
6060
fireEvent.click(el!);
6161
expect(api.close).toHaveBeenCalledTimes(1);
6262
});
63+
64+
test('that close button prevents default behavior', () => {
65+
const cut = new DefaultTab();
66+
67+
const api = fromPartial<DockviewPanelApi>({
68+
onDidTitleChange: jest.fn(),
69+
close: jest.fn(),
70+
});
71+
const containerApi = fromPartial<DockviewApi>({});
72+
73+
cut.init({
74+
api,
75+
containerApi,
76+
params: {},
77+
title: 'title_abc',
78+
});
79+
80+
let el = cut.element.querySelector('.dv-default-tab-action');
81+
82+
// Create a custom event to verify preventDefault is called
83+
const clickEvent = new Event('click', { cancelable: true });
84+
const preventDefaultSpy = jest.spyOn(clickEvent, 'preventDefault');
85+
86+
el!.dispatchEvent(clickEvent);
87+
88+
expect(preventDefaultSpy).toHaveBeenCalledTimes(1);
89+
expect(api.close).toHaveBeenCalledTimes(1);
90+
});
91+
92+
test('that close button respects already prevented events', () => {
93+
const cut = new DefaultTab();
94+
95+
const api = fromPartial<DockviewPanelApi>({
96+
onDidTitleChange: jest.fn(),
97+
close: jest.fn(),
98+
});
99+
const containerApi = fromPartial<DockviewApi>({});
100+
101+
cut.init({
102+
api,
103+
containerApi,
104+
params: {},
105+
title: 'title_abc',
106+
});
107+
108+
let el = cut.element.querySelector('.dv-default-tab-action');
109+
110+
// Create a custom event and prevent it before dispatching
111+
const clickEvent = new Event('click', { cancelable: true });
112+
clickEvent.preventDefault();
113+
114+
el!.dispatchEvent(clickEvent);
115+
116+
// Close should not be called if event was already prevented
117+
expect(api.close).not.toHaveBeenCalled();
118+
});
119+
120+
test('that close button is visible by default', () => {
121+
const cut = new DefaultTab();
122+
123+
const api = fromPartial<DockviewPanelApi>({
124+
onDidTitleChange: jest.fn(),
125+
close: jest.fn(),
126+
});
127+
const containerApi = fromPartial<DockviewApi>({});
128+
129+
cut.init({
130+
api,
131+
containerApi,
132+
params: {},
133+
title: 'title_abc',
134+
});
135+
136+
let el = cut.element.querySelector('.dv-default-tab-action') as HTMLElement;
137+
expect(el).toBeTruthy();
138+
expect(el.style.display).not.toBe('none');
139+
});
63140
});

0 commit comments

Comments
 (0)