1

We are using docusaurus for a long time, but lately we are receiving feedbacks from our Docs website that some menus are not properly opening.

we have a structure like this example

Menu 1
|
|
|-- Submenu 1
|      |
|      - Submenu 1.1
|           |
|           - Link 1.1.1
|           |
|           - Link 1.1.2
|           |
|           - Link 1.1.3
|
|-- Submenu 2
       |
       - Submenu 2.1
            |
            - Link 2.1.1
            |
            - Link 2.1.2
            |
            - Link 2.1.3

When someone tries to open submenu 2.1, for example, it does not expand, but if I try to reach the link 2.1.1 typing the appropriate link, it is reachable. If I hardtype the link for this link 2.1.1 (for example) when the page loads, it shows the submenu 2.1 expanded normally.

Error docusaurus website

We tried with the same chrome versions between different computers, and it seems that we are getting different responses for this bug.

it seems that we have some bug on the JS that is creating the classes for this nav-bars. Has anyone experienced this bug before and know how to solve this issue?

What I tried:

  • hardcode the css file with height: auto !important so the container that contains the nav-bar could adjust automatically its height.

    • R- The menu opened and showed all link options below it, but it was not collapsing back again.

  • Tried to find which script was creating and addressing the classes.

    • R- I couldn`t find it
Guilherme G
  • 11
  • 2
  • I encounter the same issue. Not found a real fix yet. The behaviour seems different from computer to computer. It does not work on mine, but works on my colleagues'. Another point is that I have the same issue on the offical Docusaurus documentation. – Anthony Fleury Apr 21 '23 at 11:34

1 Answers1

1

This was a docusaurus bug related to prefers-reduced-motion nested collapsible bug, see this: https://github.com/facebook/docusaurus/issues/8932

Good news is that docusaurus version 2.4.1 fixed that: https://github.com/facebook/docusaurus/releases/tag/v2.4.1 https://twitter.com/docusaurus/status/1658106844970188804

Just go to your package.json file, upgrade the versions, build the app again, and you should be fine.

  "dependencies": {
     "@docusaurus/core": "^2.4.1",
     "@docusaurus/plugin-client-redirects": "^2.4.1",
     "@docusaurus/preset-classic": "^2.4.1",
     "@docusaurus/theme-live-codeblock": "^2.4.1",
Daniel Barros
  • 11
  • 1