diff --git a/app/components/Code/FileTree.vue b/app/components/Code/FileTree.vue index ae34449680..1959b83b1f 100644 --- a/app/components/Code/FileTree.vue +++ b/app/components/Code/FileTree.vue @@ -39,7 +39,7 @@ const { toggleDir, isExpanded, autoExpandAncestors } = useFileTreeState(props.ba watch( () => props.currentPath, path => { - if (path) { + if (depth.value === 0 && path) { autoExpandAncestors(path) } }, diff --git a/test/nuxt/components/CodeFileTree.spec.ts b/test/nuxt/components/CodeFileTree.spec.ts new file mode 100644 index 0000000000..20e067f952 --- /dev/null +++ b/test/nuxt/components/CodeFileTree.spec.ts @@ -0,0 +1,91 @@ +import { mountSuspended } from '@nuxt/test-utils/runtime' +import { describe, expect, it, vi } from 'vitest' +import CodeFileTree from '~/components/Code/FileTree.vue' + +const mockTree: PackageFileTree[] = [ + { + name: 'distribution', + type: 'directory', + path: 'distribution', + children: [ + { + name: 'core', + type: 'directory', + path: 'distribution/core', + children: [ + { + name: 'constants.d.ts', + type: 'file', + path: 'distribution/core/constants.d.ts', + }, + ], + }, + { + name: 'types', + type: 'directory', + path: 'distribution/types', + children: [ + { + name: 'common.d.ts', + type: 'file', + path: 'distribution/types/common.d.ts', + }, + ], + }, + ], + }, +] + +function findDirButton(wrapper: Awaited>, name: string) { + return wrapper.findAll('button').find(button => button.text().trim() === name) +} + +async function mountCodeFileTree() { + return mountSuspended(CodeFileTree, { + attachTo: document.body, + props: { + tree: mockTree, + currentPath: 'distribution/core/constants.d.ts', + baseUrl: '/package-code/ky/v/1.14.3/distribution/core/constants.d.ts?test=tree', + baseRoute: { + params: { + packageName: 'ky', + version: '1.14.3', + filePath: '', + }, + }, + }, + }) +} + +describe('CodeFileTree', () => { + it('expands and collapses a directory when clicked', async () => { + const wrapper = await mountCodeFileTree() + try { + await vi.waitFor(() => { + expect(wrapper.text()).toContain('constants.d.ts') + expect(wrapper.text()).not.toContain('common.d.ts') + }) + + const coreButton = findDirButton(wrapper, 'core') + expect(coreButton).toBeDefined() + await coreButton!.trigger('click') + + await vi.waitFor(() => { + expect(wrapper.text()).not.toContain('constants.d.ts') + expect(wrapper.text()).not.toContain('common.d.ts') + }) + + const typesButton = findDirButton(wrapper, 'types') + expect(typesButton).toBeDefined() + await typesButton!.trigger('click') + + await vi.waitFor(() => { + expect(wrapper.text()).toContain('common.d.ts') + expect(wrapper.text()).not.toContain('constants.d.ts') + }) + } finally { + wrapper.unmount() + } + }) +})