vuejs / vitepress

Vite & Vue powered static site generator.
https://vitepress.dev
MIT License
11.48k stars 1.86k forks source link

sidebar: unexpected toggling of groups with headings linked to the current page #3805

Open olets opened 4 weeks ago

olets commented 4 weeks ago

Describe the bug

Sidebar group headings can be linked. If a sidebar group is linked, visiting the page it's linked to will uncollapse the group. The effect is unexpected and can result in undesired uncollapsings.

Reproduction

  1. With the released version, replace docs/.vitepress/config/en.ts's sidebarGuide with the following.
    function sidebarGuide(): DefaultTheme.SidebarItem[] {
      return [
        {
          text: 'Introduction',
          collapsed: true,
          items: [
            {
              text: 'Group heading linked to "What is VitePress?"',
              link: 'what-is-vitepress',
              collapsed: true,
              items: [
                {
                  text: 'Another group heading linked to "What is VitePress?"',
                  link: 'what-is-vitepress',
                  collapsed: true,
                  items: [
                    {
                      text: 'What is VitePress?',
                      link: 'what-is-vitepress',
                    },
                  ],
                },
              ],
            },
            { text: 'Getting Started', link: 'getting-started' },
            { text: 'Routing', link: 'routing' },
            { text: 'Deploy', link: 'deploy' }
          ]
        },
        { text: 'What is VitePress?', link: 'what-is-vitepress',},
        {
          text: 'Writing',
          collapsed: false,
          items: [
            { text: 'Markdown Extensions', link: 'markdown' },
            { text: 'Asset Handling', link: 'asset-handling' },
            { text: 'Frontmatter', link: 'frontmatter' },
            { text: 'Using Vue in Markdown', link: 'using-vue' },
            { text: 'Internationalization', link: 'i18n' }
          ]
        },
        {
          text: 'Customization',
          collapsed: false,
          items: [
            { text: 'Using a Custom Theme', link: 'custom-theme' },
            {
              text: 'Extending the Default Theme',
              link: 'extending-default-theme'
            },
            { text: 'Build-Time Data Loading', link: 'data-loading' },
            { text: 'SSR Compatibility', link: 'ssr-compat' },
            { text: 'Connecting to a CMS', link: 'cms' }
          ]
        },
        {
          text: 'Experimental',
          collapsed: false,
          items: [
            { text: 'MPA Mode', link: 'mpa-mode' },
            { text: 'Sitemap Generation', link: 'sitemap-generation' }
          ]
        },
        { text: 'Config & API Reference', base: '/reference/', link: 'site-config' }
      ]
    }
  2. Run pnpm run docs
  3. Open http://localhost:<your port>/guide/routing in a browser
  4. Click on the text of the second sidebar item, "Group heading linked to "What is VitePress?"
  5. Confirm that it and its child group opens.

Expected behavior

Clicking a sidebar group's linked heading opens the link without toggling the group.

System Info

System:
    OS: macOS 14.3.1
    CPU: (8) arm64 Apple M1
    Memory: 191.89 MB / 16.00 GB
    Shell: 5.9 - /opt/homebrew/bin/zsh
  Binaries:
    Node: 18.12.0 - ~/.asdf/installs/nodejs/18.12.0/bin/node
    Yarn: 1.22.22 - /opt/homebrew/bin/yarn
    npm: 8.19.2 - ~/.asdf/installs/nodejs/18.12.0/bin/npm
    pnpm: 8.15.6 - ~/Library/pnpm/pnpm
    bun: 1.1.4 - ~/.bun/bin/bun
  Browsers:
    Brave Browser: 123.1.64.122
    Chrome: 123.0.6312.124
    Edge: 123.0.2420.97
    Safari: 17.3.1


### Additional context

_No response_

### Validations

- [X] Check if you're on the [latest VitePress version](https://github.com/vuejs/vitepress/releases/latest).
- [X] Follow our [Code of Conduct](https://vuejs.org/about/coc.html)
- [X] Read the [docs](https://vitepress.dev).
- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.