From 45184601fe07320c867d775db8cedc22682a07db Mon Sep 17 00:00:00 2001 From: userquin Date: Sat, 29 Oct 2022 00:03:51 +0200 Subject: [PATCH 1/9] feat(theme): sort multiple sidebars --- src/client/theme-default/support/sidebar.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/client/theme-default/support/sidebar.ts b/src/client/theme-default/support/sidebar.ts index b55fa1356f2..428ff775485 100644 --- a/src/client/theme-default/support/sidebar.ts +++ b/src/client/theme-default/support/sidebar.ts @@ -17,7 +17,11 @@ export function getSidebar( path = ensureStartingSlash(path) - for (const dir in sidebar) { + const useSidebar = Object.keys(sidebar).sort((a, b) => { + return a.split('/').length - b.split('/').length + }) + + for (const dir in useSidebar) { // make sure the multi sidebar key starts with slash too if (path.startsWith(ensureStartingSlash(dir))) { return sidebar[dir] From 949f3b81b940692a14406c9c86f8b5041e46d8e9 Mon Sep 17 00:00:00 2001 From: userquin Date: Sat, 29 Oct 2022 00:15:24 +0200 Subject: [PATCH 2/9] chore: use find instead loop --- src/client/theme-default/support/sidebar.ts | 22 ++++++++++----------- 1 file changed, 10 insertions(+), 12 deletions(-) diff --git a/src/client/theme-default/support/sidebar.ts b/src/client/theme-default/support/sidebar.ts index 428ff775485..65eaca90136 100644 --- a/src/client/theme-default/support/sidebar.ts +++ b/src/client/theme-default/support/sidebar.ts @@ -17,18 +17,16 @@ export function getSidebar( path = ensureStartingSlash(path) - const useSidebar = Object.keys(sidebar).sort((a, b) => { - return a.split('/').length - b.split('/').length - }) - - for (const dir in useSidebar) { - // make sure the multi sidebar key starts with slash too - if (path.startsWith(ensureStartingSlash(dir))) { - return sidebar[dir] - } - } - - return [] + const dir = Object.keys(sidebar) + .sort((a, b) => { + return a.split('/').length - b.split('/').length + }) + .find((dir) => { + // make sure the multi sidebar key starts with slash too + return path.startsWith(ensureStartingSlash(dir)) + }) + + return dir ? sidebar[dir] : [] } export function getFlatSideBarLinks(sidebar: DefaultTheme.SidebarGroup[]) { From a0413fa76a71ffa733cf96fb7869deb5d54aaabb Mon Sep 17 00:00:00 2001 From: userquin Date: Sat, 29 Oct 2022 00:58:22 +0200 Subject: [PATCH 3/9] fix: sort --- src/client/theme-default/support/sidebar.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/client/theme-default/support/sidebar.ts b/src/client/theme-default/support/sidebar.ts index 65eaca90136..e25c49ecea9 100644 --- a/src/client/theme-default/support/sidebar.ts +++ b/src/client/theme-default/support/sidebar.ts @@ -19,7 +19,7 @@ export function getSidebar( const dir = Object.keys(sidebar) .sort((a, b) => { - return a.split('/').length - b.split('/').length + return b.split('/').length - a.split('/').length }) .find((dir) => { // make sure the multi sidebar key starts with slash too From 45290cc86f32ef3e194d4733c7ac0b54a1a00295 Mon Sep 17 00:00:00 2001 From: userquin Date: Sat, 29 Oct 2022 01:01:33 +0200 Subject: [PATCH 4/9] chore: add 2 tests and example --- examples/configured/.vitepress/config.js | 24 +++++++++++ .../configured/__test__/multisidebar.spec.ts | 40 +++++++++++++++++++ examples/configured/index.md | 2 +- examples/configured/multi-sidebar/index.md | 5 +++ 4 files changed, 70 insertions(+), 1 deletion(-) create mode 100644 examples/configured/__test__/multisidebar.spec.ts create mode 100644 examples/configured/multi-sidebar/index.md diff --git a/examples/configured/.vitepress/config.js b/examples/configured/.vitepress/config.js index e027a483b72..6b0795c789c 100644 --- a/examples/configured/.vitepress/config.js +++ b/examples/configured/.vitepress/config.js @@ -24,6 +24,30 @@ export default defineConfig({ link: '/static-data/data' } ] + }, + { + text: 'Multi Sidebar Test', + items: [ + { + text: 'Test Page', + link: '/multi-sidebar/' + } + ] + } + ], + '/multi-sidebar/': [ + { + text: 'Multi Sidebar', + items: [ + { + text: 'Test Page', + link: '/multi-sidebar/' + }, + { + text: 'Back', + link: '/' + } + ] } ] } diff --git a/examples/configured/__test__/multisidebar.spec.ts b/examples/configured/__test__/multisidebar.spec.ts new file mode 100644 index 00000000000..ed7e4f88165 --- /dev/null +++ b/examples/configured/__test__/multisidebar.spec.ts @@ -0,0 +1,40 @@ +import { expect, test } from 'vitest' +import { page, vitePressTestUrl, waitForLayout } from '~utils' + +describe('test multi sidebar sort root', () => { + beforeAll(async () => { + await page.goto( + vitePressTestUrl + '/frontmatter/multiple-levels-outline.html' + ) + await waitForLayout() + }) + + test('using / sidebar', async () => { + const sidebarLocator = await page.locator( + '.VPSidebarGroup .title .title-text' + ) + + const sidebarContent = await sidebarLocator.allTextContents() + expect(sidebarContent).toEqual([ + 'Frontmatter', + 'Static Data', + 'Multi Sidebar Test' + ]) + }) +}) + +describe('test multi sidebar sort other', () => { + beforeAll(async () => { + await page.goto(vitePressTestUrl + '/multi-sidebar/index.html') + await waitForLayout() + }) + + test('using /multi-sidebar/ sidebar', async () => { + const sidebarLocator = await page.locator( + '.VPSidebarGroup .title .title-text' + ) + + const sidebarContent = await sidebarLocator.allTextContents() + expect(sidebarContent).toEqual(['Multi Sidebar']) + }) +}) diff --git a/examples/configured/index.md b/examples/configured/index.md index 5cc1ad4acf2..5319d12d6f6 100644 --- a/examples/configured/index.md +++ b/examples/configured/index.md @@ -1,3 +1,3 @@ # Full Configured VitePress Example -WIP \ No newline at end of file +WIP diff --git a/examples/configured/multi-sidebar/index.md b/examples/configured/multi-sidebar/index.md new file mode 100644 index 00000000000..c5d8b94953b --- /dev/null +++ b/examples/configured/multi-sidebar/index.md @@ -0,0 +1,5 @@ +--- +title: Multi Sidebar Test +--- + +# Multi Sidebar Test From 54ed9a338eae93f8b90713428903e251a1ecf42c Mon Sep 17 00:00:00 2001 From: userquin Date: Sat, 29 Oct 2022 01:26:12 +0200 Subject: [PATCH 5/9] chore: add sidebar client tests --- .../theme-default/support/sidebar.spec.ts | 86 +++++++++++++++++++ 1 file changed, 86 insertions(+) create mode 100644 __tests__/client/theme-default/support/sidebar.spec.ts diff --git a/__tests__/client/theme-default/support/sidebar.spec.ts b/__tests__/client/theme-default/support/sidebar.spec.ts new file mode 100644 index 00000000000..f91086f0d4a --- /dev/null +++ b/__tests__/client/theme-default/support/sidebar.spec.ts @@ -0,0 +1,86 @@ +import { describe, test, expect } from 'vitest' +import { getSidebar } from 'client/theme-default/support/sidebar' + +describe('client/theme-default/support/sidebar', () => { + const root = [ + { + text: 'Frontmatter', + collapsible: true, + items: [ + { + text: 'Multiple levels outline', + link: '' + } + ] + }, + { + text: 'Static Data', + items: [ + { + text: 'Test Page', + link: '' + } + ] + }, + { + text: 'Multi Sidebar Test', + items: [ + { + text: 'Test Page', + link: '' + } + ] + } + ] + const another = [ + { + text: 'Multi Sidebar', + items: [ + { + text: 'Test Page', + link: '' + }, + { + text: 'Back', + link: '' + } + ] + } + ] + describe('normal sidebar sort', () => { + const normalSidebar = { + '/': root, + '/multi-sidebar/': another + } + test('gets / sidebar properly', () => { + let resolved = getSidebar(normalSidebar, '/') + expect(resolved).toBe(root) + }) + test('gets /multi-sidebar/ sidebar properly', () => { + let resolved = getSidebar(normalSidebar, '/multi-sidebar/index.html') + expect(resolved).toBe(another) + }) + test('gets / sidebar properly again', () => { + let resolved = getSidebar(normalSidebar, '/some-entry.html') + expect(resolved).toBe(root) + }) + }) + describe('reversed sidebar sort', () => { + const reversedSidebar = { + '/multi-sidebar/': another, + '/': root + } + test('gets / sidebar properly', () => { + let resolved = getSidebar(reversedSidebar, '/') + expect(resolved).toBe(root) + }) + test('gets /multi-sidebar/ sidebar properly', () => { + let resolved = getSidebar(reversedSidebar, '/multi-sidebar/index.html') + expect(resolved).toBe(another) + }) + test('gets / sidebar properly again', () => { + let resolved = getSidebar(reversedSidebar, '/some-entry.html') + expect(resolved).toBe(root) + }) + }) +}) From 34847769aca57c25cce121b8e63c6e0d4d152c8c Mon Sep 17 00:00:00 2001 From: userquin Date: Sat, 29 Oct 2022 01:30:07 +0200 Subject: [PATCH 6/9] chore: add nested sidebar client tests --- .../theme-default/support/sidebar.spec.ts | 50 ++++++++++++++----- 1 file changed, 37 insertions(+), 13 deletions(-) diff --git a/__tests__/client/theme-default/support/sidebar.spec.ts b/__tests__/client/theme-default/support/sidebar.spec.ts index f91086f0d4a..7d4afc8d6d0 100644 --- a/__tests__/client/theme-default/support/sidebar.spec.ts +++ b/__tests__/client/theme-default/support/sidebar.spec.ts @@ -21,15 +21,6 @@ describe('client/theme-default/support/sidebar', () => { link: '' } ] - }, - { - text: 'Multi Sidebar Test', - items: [ - { - text: 'Test Page', - link: '' - } - ] } ] const another = [ @@ -39,10 +30,6 @@ describe('client/theme-default/support/sidebar', () => { { text: 'Test Page', link: '' - }, - { - text: 'Back', - link: '' } ] } @@ -83,4 +70,41 @@ describe('client/theme-default/support/sidebar', () => { expect(resolved).toBe(root) }) }) + describe('nested sidebar sort', () => { + const nested = [ + { + text: 'Nested Multi Sidebar', + items: [ + { + text: 'Test Page', + link: '' + } + ] + } + ] + const nestedSidebar = { + '/': root, + '/multi-sidebar/': another, + '/multi-sidebar/nested/': nested + } + test('gets / sidebar properly', () => { + let resolved = getSidebar(nestedSidebar, '/') + expect(resolved).toBe(root) + }) + test('gets /multi-sidebar/ sidebar properly', () => { + let resolved = getSidebar(nestedSidebar, '/multi-sidebar/index.html') + expect(resolved).toBe(another) + }) + test('gets /multi-sidebar/nested/ sidebar properly', () => { + let resolved = getSidebar( + nestedSidebar, + '/multi-sidebar/nested/index.html' + ) + expect(resolved).toBe(nested) + }) + test('gets / sidebar properly again', () => { + let resolved = getSidebar(nestedSidebar, '/some-entry.html') + expect(resolved).toBe(root) + }) + }) }) From ca2fe6033f90335790086408f8de9dc0aa7b711b Mon Sep 17 00:00:00 2001 From: userquin Date: Sat, 29 Oct 2022 01:36:58 +0200 Subject: [PATCH 7/9] chore: cleanup client tests --- .../theme-default/support/sidebar.spec.ts | 57 +++++++++---------- 1 file changed, 26 insertions(+), 31 deletions(-) diff --git a/__tests__/client/theme-default/support/sidebar.spec.ts b/__tests__/client/theme-default/support/sidebar.spec.ts index 7d4afc8d6d0..05500316f81 100644 --- a/__tests__/client/theme-default/support/sidebar.spec.ts +++ b/__tests__/client/theme-default/support/sidebar.spec.ts @@ -4,20 +4,20 @@ import { getSidebar } from 'client/theme-default/support/sidebar' describe('client/theme-default/support/sidebar', () => { const root = [ { - text: 'Frontmatter', + text: 'A', collapsible: true, items: [ { - text: 'Multiple levels outline', + text: 'A', link: '' } ] }, { - text: 'Static Data', + text: 'B', items: [ { - text: 'Test Page', + text: 'B', link: '' } ] @@ -25,10 +25,10 @@ describe('client/theme-default/support/sidebar', () => { ] const another = [ { - text: 'Multi Sidebar', + text: 'C', items: [ { - text: 'Test Page', + text: 'C', link: '' } ] @@ -40,16 +40,15 @@ describe('client/theme-default/support/sidebar', () => { '/multi-sidebar/': another } test('gets / sidebar properly', () => { - let resolved = getSidebar(normalSidebar, '/') - expect(resolved).toBe(root) + expect(getSidebar(normalSidebar, '/')).toBe(root) }) test('gets /multi-sidebar/ sidebar properly', () => { - let resolved = getSidebar(normalSidebar, '/multi-sidebar/index.html') - expect(resolved).toBe(another) + expect(getSidebar(normalSidebar, '/multi-sidebar/index.html')).toBe( + another + ) }) test('gets / sidebar properly again', () => { - let resolved = getSidebar(normalSidebar, '/some-entry.html') - expect(resolved).toBe(root) + expect(getSidebar(normalSidebar, '/some-entry.html')).toBe(root) }) }) describe('reversed sidebar sort', () => { @@ -58,25 +57,24 @@ describe('client/theme-default/support/sidebar', () => { '/': root } test('gets / sidebar properly', () => { - let resolved = getSidebar(reversedSidebar, '/') - expect(resolved).toBe(root) + expect(getSidebar(reversedSidebar, '/')).toBe(root) }) test('gets /multi-sidebar/ sidebar properly', () => { - let resolved = getSidebar(reversedSidebar, '/multi-sidebar/index.html') - expect(resolved).toBe(another) + expect(getSidebar(reversedSidebar, '/multi-sidebar/index.html')).toBe( + another + ) }) test('gets / sidebar properly again', () => { - let resolved = getSidebar(reversedSidebar, '/some-entry.html') - expect(resolved).toBe(root) + expect(getSidebar(reversedSidebar, '/some-entry.html')).toBe(root) }) }) describe('nested sidebar sort', () => { const nested = [ { - text: 'Nested Multi Sidebar', + text: 'D', items: [ { - text: 'Test Page', + text: 'D', link: '' } ] @@ -88,23 +86,20 @@ describe('client/theme-default/support/sidebar', () => { '/multi-sidebar/nested/': nested } test('gets / sidebar properly', () => { - let resolved = getSidebar(nestedSidebar, '/') - expect(resolved).toBe(root) + expect(getSidebar(nestedSidebar, '/')).toBe(root) }) test('gets /multi-sidebar/ sidebar properly', () => { - let resolved = getSidebar(nestedSidebar, '/multi-sidebar/index.html') - expect(resolved).toBe(another) + expect(getSidebar(nestedSidebar, '/multi-sidebar/index.html')).toBe( + another + ) }) test('gets /multi-sidebar/nested/ sidebar properly', () => { - let resolved = getSidebar( - nestedSidebar, - '/multi-sidebar/nested/index.html' - ) - expect(resolved).toBe(nested) + expect( + getSidebar(nestedSidebar, '/multi-sidebar/nested/index.html') + ).toBe(nested) }) test('gets / sidebar properly again', () => { - let resolved = getSidebar(nestedSidebar, '/some-entry.html') - expect(resolved).toBe(root) + expect(getSidebar(nestedSidebar, '/some-entry.html')).toBe(root) }) }) }) From 52a3a324933d12b2aa386d09ec0a0725ce52854e Mon Sep 17 00:00:00 2001 From: userquin Date: Sat, 29 Oct 2022 01:42:32 +0200 Subject: [PATCH 8/9] chore: client tests cleanup --- .../theme-default/support/sidebar.spec.ts | 36 ++++++++----------- 1 file changed, 14 insertions(+), 22 deletions(-) diff --git a/__tests__/client/theme-default/support/sidebar.spec.ts b/__tests__/client/theme-default/support/sidebar.spec.ts index 05500316f81..9f41d417c07 100644 --- a/__tests__/client/theme-default/support/sidebar.spec.ts +++ b/__tests__/client/theme-default/support/sidebar.spec.ts @@ -39,15 +39,13 @@ describe('client/theme-default/support/sidebar', () => { '/': root, '/multi-sidebar/': another } - test('gets / sidebar properly', () => { + test('gets / sidebar', () => { expect(getSidebar(normalSidebar, '/')).toBe(root) }) - test('gets /multi-sidebar/ sidebar properly', () => { - expect(getSidebar(normalSidebar, '/multi-sidebar/index.html')).toBe( - another - ) + test('gets /multi-sidebar/ sidebar', () => { + expect(getSidebar(normalSidebar, '/multi-sidebar/')).toBe(another) }) - test('gets / sidebar properly again', () => { + test('gets / sidebar again', () => { expect(getSidebar(normalSidebar, '/some-entry.html')).toBe(root) }) }) @@ -56,15 +54,13 @@ describe('client/theme-default/support/sidebar', () => { '/multi-sidebar/': another, '/': root } - test('gets / sidebar properly', () => { + test('gets / sidebar', () => { expect(getSidebar(reversedSidebar, '/')).toBe(root) }) - test('gets /multi-sidebar/ sidebar properly', () => { - expect(getSidebar(reversedSidebar, '/multi-sidebar/index.html')).toBe( - another - ) + test('gets /multi-sidebar/ sidebar', () => { + expect(getSidebar(reversedSidebar, '/multi-sidebar/')).toBe(another) }) - test('gets / sidebar properly again', () => { + test('gets / sidebar again', () => { expect(getSidebar(reversedSidebar, '/some-entry.html')).toBe(root) }) }) @@ -85,20 +81,16 @@ describe('client/theme-default/support/sidebar', () => { '/multi-sidebar/': another, '/multi-sidebar/nested/': nested } - test('gets / sidebar properly', () => { + test('gets / sidebar', () => { expect(getSidebar(nestedSidebar, '/')).toBe(root) }) - test('gets /multi-sidebar/ sidebar properly', () => { - expect(getSidebar(nestedSidebar, '/multi-sidebar/index.html')).toBe( - another - ) + test('gets /multi-sidebar/ sidebar', () => { + expect(getSidebar(nestedSidebar, '/multi-sidebar/')).toBe(another) }) - test('gets /multi-sidebar/nested/ sidebar properly', () => { - expect( - getSidebar(nestedSidebar, '/multi-sidebar/nested/index.html') - ).toBe(nested) + test('gets /multi-sidebar/nested/ sidebar', () => { + expect(getSidebar(nestedSidebar, '/multi-sidebar/nested/')).toBe(nested) }) - test('gets / sidebar properly again', () => { + test('gets / sidebar again', () => { expect(getSidebar(nestedSidebar, '/some-entry.html')).toBe(root) }) }) From e1e2a487a277951d36a1f66baf7a5c0a28414fea Mon Sep 17 00:00:00 2001 From: Divyansh Singh <40380293+brc-dd@users.noreply.github.com> Date: Sat, 29 Oct 2022 13:31:37 +0530 Subject: [PATCH 9/9] add null check --- src/client/theme-default/support/sidebar.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/client/theme-default/support/sidebar.ts b/src/client/theme-default/support/sidebar.ts index e25c49ecea9..80971064c96 100644 --- a/src/client/theme-default/support/sidebar.ts +++ b/src/client/theme-default/support/sidebar.ts @@ -15,6 +15,10 @@ export function getSidebar( return sidebar } + if (sidebar == null) { + return [] + } + path = ensureStartingSlash(path) const dir = Object.keys(sidebar)