GithubStar/docsify
1
0
Fork 0
mirror of https://github.com/docsifyjs/docsify.git synced 2026-10-17 04:31:18 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: add configurable right sidebar (#2772)

Browse Source
This commit is contained in:
Shivansh Gupta
2026-08-04 09:16:10 +05:30
committed by GitHub
parent 24a16c630a
commit ee7063cfd9
8 changed files with 129 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
test/e2e/configuration.test.js
+64
View File
@@ -151,6 +151,70 @@ test.describe('Configuration options', () => {
await expect(page.locator('#main')).toContainText(expectText);
});
});
test.describe('sidebarPosition', () => {
test('right: renders the sidebar and toggle on the right', async ({
page,
}) => {
await page.emulateMedia({ reducedMotion: 'reduce' });
await docsifyInit({
config: {
sidebarPosition: 'right',
},
markdown: {
homepage: '# Hello World',
},
styleURLs: ['/dist/themes/core.css'],
});
const sidebar = page.locator('.sidebar');
const toggle = page.locator('.sidebar-toggle');
await expect(sidebar).toHaveClass(/sidebar-right/);
await expect(toggle).toHaveClass(/sidebar-right/);
await expect(sidebar).toHaveClass(/show/);
const sidebarBox = await sidebar.boundingBox();
const toggleBox = await toggle.boundingBox();
const layoutWidth = await page.evaluate(
() => document.documentElement.clientWidth,
);
expect(sidebarBox?.x + sidebarBox?.width).toBe(layoutWidth);
expect(toggleBox?.x + toggleBox?.width).toBe(sidebarBox?.x);
});
test('right: opens from the right on mobile', async ({ page }) => {
await page.setViewportSize({ width: 600, height: 800 });
await page.emulateMedia({ reducedMotion: 'reduce' });
await docsifyInit({
config: {
sidebarPosition: 'right',
},
markdown: {
homepage: '# Hello World',
},
styleURLs: ['/dist/themes/core.css'],
});
const sidebar = page.locator('.sidebar');
const toggle = page.locator('.sidebar-toggle');
await expect(sidebar).not.toHaveClass(/show/);
await page.locator('.sidebar-toggle-button').click();
await expect(sidebar).toHaveClass(/show/);
const sidebarBox = await sidebar.boundingBox();
const toggleBox = await toggle.boundingBox();
const layoutWidth = await page.evaluate(
() => document.documentElement.clientWidth,
);
expect(sidebarBox?.x + sidebarBox?.width).toBe(layoutWidth);
expect(toggleBox?.x).toBe(0);
expect(toggleBox?.width).toBe(layoutWidth - (sidebarBox?.width ?? 0));
});
});
});
test.describe('keyBindings', () => {