Undefined document ID

[gdude2002]

I've been banging my head against the wall on this one for a little while - hoping someone has any ideas! I've had no luck on the Discord so far.

I've been working on moving my project's documentation from Writerside to Docusaurus, and things are mostly going fine. Furthermore, I decided to add a version picker to retrieve metadata and dependency info about each version.

My first attempt downloaded all info about all versions on startup, and this works fine. I'm using a global Redux store, nothing too complex. However, this approach was quite slow and not suitable for users with some types of connection, so I decided to download the required information on demand. The code I've written works when run in dev mode, but for some reason, it breaks when I build:

      [errors]: [
        Error: Can't render static file for pathname "/bots/versions"
            at generateStaticFile (C:\Users\coles\IdeaProjects\KordEx\docs\node_modules\.pnpm\@[email protected]_@mdx_52b8db5564a79b32dc6c8f55397c910c\node_modules\@docusaurus\core\lib\ssg\ssgRenderer.js:131:20)
            at processTicksAndRejections (node:internal/process/task_queues:105:5)
            at runNextTicks (node:internal/process/task_queues:69:3)
            at process.processImmediate (node:internal/timers:473:9)
            at async C:\Users\coles\IdeaProjects\KordEx\docs\node_modules\.pnpm\[email protected]\node_modules\p-map\index.js:57:22 {
          [cause]: TypeError: Cannot read properties of undefined (reading 'id')
              at DocItem (server.bundle.js:31351:86)
              at Uc (server.bundle.js:39704:44)
              at Xc (server.bundle.js:39706:253)
              at Z (server.bundle.js:39712:89)
              at Xc (server.bundle.js:39710:231)
              at Z (server.bundle.js:39712:89)
              at Xc (server.bundle.js:39706:481)
              at Z (server.bundle.js:39712:89)
              at Vc (server.bundle.js:39704:473)
              at Xc (server.bundle.js:39706:210)
        }
      ]

I can't figure out any workarounds, which may be unsurprising given I don't have all that much experience with React and almost zero experience with Redux. Swizzling out DocItem to modify the one place it accesses the document ID doesn't help either.

• New component, and commit comparison
• Store and Hooks/Thunk

I would very much appreciate any help that might point me in the right direction!

[slorber]

It's difficult to help troubleshoot issues with custom code you write. But if you know this commit introduced the problem, why not try to apply your changes again in many smaller commits until you find the root cause of the issue, and remove what you swizzled until it works again to find the problematic part.

[gdude2002]

It's difficult to help troubleshoot issues with custom code you write.

Sorry, yeah, I just don't have the experience I need to debug something so deep within Docusaurus myself.

remove what you swizzled

I actually didn't need to swizzle DocItem, I just swizzled it in hope that I could provide a string when id is undefined. Didn't work, though. I removed it locally to check, but yeah, no difference.

---

why not try to apply your changes again in many smaller commits until you find the root cause of the issue

Yep, I've been trying to do that. The only thing that helps is removing references to the Redux store/hooks/thunk in my component, though that obviously leaves things in an unusable state. This even includes just grabbing the version list from the store, without using the thunk or any hooks other than the selector.

[slorber]

What's the purpose of this specific change? This might be the problem:

---

I encountered the above error on another site, and the issue is related to the usage of symlinks. Are you using symlinks?

In this case, symlinked docs files are considered as "MDX Partials" and do not have an associated docs metadata JSON file, leading to this code throwing: const docHtmlClassName = docs-doc-id-${props.content.metadata.id};

Your issue leads to the same underlying problem (missing metadata) and is likely related to things you import in MDX files, so that diff looks suspicious.

[gdude2002]

Thanks for the idea - but no, I'm not using symlinks, and replacing the @site didn't change anything.

The reason I made the change is actually because I edit in IntelliJ IDEA Ultimate, and it has a hard time with these aliases.

[slorber]

Your problem is related to using top-level await in modules. I'm not sure why this produces such an error in our React components, but we don't have full ESM support and top-level await is a quite fancy feature that you'd rather avoid if your tool doesn't explicitly support it.

If you use hardcoded data, your build can pass:

const versions = ["version"]
const latestVersion = versions[0]
const latest = {

[gdude2002]

Bingo - this was the problem! Massively appreciate the help!

It took a little time to figure out how to get rid of my top-level awaits, but everything seems to be fine now. Thanks again!