Unable to pass the vuex store to a story synchronously with a decorator

[chopfitzroy]

Describe the bug
I want to add a Vuex store to a story after the store has loaded, it is initialized by an external script that I am loading in via preview-head.html.

This issue was discussed at length in #6726 and I closed that at the time because it moved outside of the scope of the original question, I have since been able to spend some time on this and believe I have identified the issue at hand.

Essentially I have a decorator that renders the <story> once a promise on the window resolves, the code for that looks like this:

Decorator code

// https://github.com/storybookjs/storybook/issues/6726#issuecomment-509649601

const waitForStore = () => (() => ({
    data() {
        return {
            ready: false
        }
    },
    async created() {
        try {
            await window.components.resourcesLoaded;
            this.ready = true;
        } catch (err) {
            console.log(new Error('Error loading resources'));
        }
    },
    render(h) {
        if (this.ready) {
            // The <story> component is already created as a component of the decorator
            // At this point it is too late to add the store?
            const { story } = this.$options.components;

            console.log({ story });

            return h('story')

            // Doesn't do anything, store key is ignore
            // - https://vuejs.org/v2/guide/render-function.html#The-Virtual-DOM
            // return h('story', { store: window.store });
        }
        return h('span', 'Waiting for store...');
    }
}));

export { waitForStore };

And is being used like so:

Story code

import { storiesOf } from '@storybook/vue';

import { waitForStore } from '../../decorators/utilities';

import EventList from '../../../../src/components/EventList.vue';

storiesOf('Event List', module)
    .addDecorator(waitForStore())
    .add('with valid data', () => {
        return {
            components: {
                EventList
            },
            data: () => {
                return {
                    initalEnabled: true
                };
            },
            template: `<event-list :initial-enabled="initalEnabled" />`
        };
    });

Now this works exactly as expected, the problem is that h doesn't accept store as an argument so it is impossible to apply the store to the <story> at this point.

The only thing I could think of was to try and manually add the store with something like:

const { story } = this.$options.components;

story.prototype.$store = window.store

After the promise resolves, unfortunately this does not work and feels very hacky anyway.

In an ideal world I would be able to hook into story books creation of the <story> component and provide a reference to the store then, unfortunately it looks like the <story> component exists long before I can access it?

To Reproduce
I do not have preview setup, given that the setup I am using is rather custom, but I have included all prevalent code samples.

Expected behavior
Ideally I would be able to hook into the <story> creation.

System:
Please paste the results of npx -p @storybook/cli@next sb info here.

Environment Info:

  System:
    OS: Linux 4.18 Ubuntu 18.10 (Cosmic Cuttlefish)
    CPU: (12) x64 Intel(R) Core(TM) i7-8700 CPU @ 3.20GHz
  Binaries:
    Node: 10.18.1 - /usr/bin/node
    npm: 6.13.6 - ~/Developer/globalpix-remote-modules/node_modules/.bin/npm
  Browsers:
    Chrome: 79.0.3945.117
    Firefox: 68.0
  npmPackages:
    @storybook/addon-actions: ^5.2.6 => 5.3.2 
    @storybook/addon-knobs: ^5.2.6 => 5.3.2 
    @storybook/addon-links: ^5.2.6 => 5.3.2 
    @storybook/addon-notes: ^5.2.6 => 5.3.2 
    @storybook/vue: ^5.3.2 => 5.3.2

Additional context
I am going to do some digging to see if there are any hooks that Vue provides to add a store to an existing instance.

[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!

[stale]

Hey there, it's me again! I am going close this issue to help our maintainers focus on the current development roadmap instead. If the issue mentioned is still a concern, please open a new ticket and mention this old one. Cheers and thanks for using Storybook!