[Vue3] addon-docs (essentials) Global components not recognized in docs tab.

[Mootook]

Describe the bug
Vue applications allow for global component registration through

// main.js
import MyComponent from '../MyComponent.vue'
const app = createApp(app)
app.component('MyComponent', MyComponent)
app.mount('#app')

// can be imitated in .storybook/preview.js
import { app } from '@storybook/vue3'
import MyComponent from '../MyComponent.vue'
app.component('MyComponent', MyComponent)

These global components are then used throughout the codebase, without the need for manual imports and declaring the component in the options.
This works in a component story's Canvas view, yet in the docs view, there is
[Vue warn]: Failed to resolve component: MyComponent, and the component isn't available.

To Reproduce
Steps to reproduce the behavior:

1. I created an isolated repo to test it.

git clone https://github.com/Mootook/global-component-vue-sb
yarn install
yarn storybook

2. Go to the "HelloWorld" story once Storybook launches
3. Notice the Global button component is available in the canvas but not in docs tab (warning in console)

Expected behavior
The global component is available in both the docs and canvas tabs of a story.

Screenshots


Code snippets
If applicable, add code samples to help explain your problem.

System
Please paste the results of npx sb@next info here.
Environment Info:
System:
OS: macOS 10.15.7
CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
Binaries:
Node: 12.20.1 - ~/.nvm/versions/node/v12.20.1/bin/node
Yarn: 1.22.10 - /usr/local/bin/yarn
npm: 6.14.10 - ~/.nvm/versions/node/v12.20.1/bin/npm
Browsers:
Chrome: 88.0.4324.150
Safari: 14.0.3
npmPackages:
@storybook/addon-actions: ^6.2.0-alpha.25 => 6.2.0-alpha.25
@storybook/addon-essentials: ^6.2.0-alpha.25 => 6.2.0-alpha.25
@storybook/addon-links: ^6.2.0-alpha.25 => 6.2.0-alpha.25
@storybook/vue3: ^6.2.0-alpha.25 => 6.2.0-alpha.25

[phated]

I actually can't find a good way to support this. The current addon-docs logic uses Vue 3's render method to insert a component directly into the page. Even if an "app" was used, there doesn't seem to be an API to clone the preview "app" into an isolated environment.

[phated]

Scratch that, right as I hit submit, I had an idea and it looks like it works.

[shilman]

Shiver me timbers!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.2.0-alpha.26 containing PR #13894 that references this issue. Upgrade today to the @next NPM tag to try it out!

npx sb upgrade --prerelease

Closing this issue. Please re-open if you think there's still more to do.