Addon-Docs: MDX links to internal docs cannot be opened in new tab

[zbream]

Describe the bug

When writing MDX, opening an internal link in a new tab displays an error due to a malformed URL (see screenshot). This is related to the new NAVIGATE_URL functionality introduced in #9328, which is otherwise amazing btw.

The new URL has iframe.html before the query string, so presumably the manager isn't getting loaded in the new tab.

To Reproduce

Steps to reproduce the behavior:

1. Go to the following:
   https://storybookjs.now.sh/official-storybook/?path=/docs/addons-docs-mdx-in-story--typography#links
2. Open link to another story (docs) in new tab, or middle click it.
3. See error in new tab.

Expected behavior

The new tab should correctly load the linked docs page.

Screenshots

System:

  System:
    OS: Windows 10 10.0.17134
    CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
  Binaries:
    Node: 12.14.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.21.1 - C:\Users\zream\AppData\Roaming\npm\yarn.CMD
    npm: 6.13.4 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: 42.17134.1098.0

[stale]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[zbream]

I found a workaround while troubleshooting an unrelated problem with Angular routing in a story.

By adding <base href="/"> to preview-head.html, this goes away. Both relative and absolute links work perfectly, as far as I can tell.

I'm unsure if this has any broader implications, but perhaps this should come default on the existing <base target="_parent"> tag.

---

EDIT: Don't do this, it has broader implications! Turns out it breaks the header anchor links in docs, causing them to launch the manager within the preview frame.

[dimitrieh]

This issue continues to exist. Is the storybook development team aware of this navigation issue with their platform?

Also: #17921

Edit: Will be looking into if this issue persists in 7.0

cc: @yannbf

[dimitrieh]

I have created a test for internal linking for storybook 7.0 using beta 48 as this issue seems to persist there.

• Test Repo: https://github.com/dimitrieh/Test-Storybook-7-Internal-Linking
• Live URL: https://dimitrieh.github.io/Test-Storybook-7-Internal-Linking (behaved differently than the one locally spun up in dev mode)
• Loom video: https://www.loom.com/share/cc3a9260fe4a4adebc66e0cb63557323

Other related issues:

• [addon-docs] Link to another story #8618
• Linking Docs to MDX removes the Storybook Viewer. #17921

cc: @yannbf

[shilman]

Crikey!! I just released https://github.com/storybookjs/storybook/releases/tag/v7.0.0-rc.4 containing PR #21569 that references this issue. Upgrade today to the @next NPM tag to try it out!

npx sb@next upgrade --prerelease

[dimitrieh]

@shilman amazing! We'll be trying this out as soon as we migrated to 7.0 🥳