Inherit preview.js parameters handlers in stories

As per Storybook rules of parameter inheritance, using msw in stories should inherit/concat the handlers from the preview.js parameters.

Example: The API I am using requires that I make a call for an oauth token before I can call any API call. In the current way this addon works, I have to duplicate this resolver in every single story that defines msw in its parameters because it overwrites the one from preview.js instead of merging with it.

preview.js

export const parameters = {
    actions: {argTypesRegex: '^on[A-Z].*'},
    msw: [
        rest.post('/oauth/token', (req, res, ctx) =>
            res(ctx.json({token_type: 'Bearer', access_token: 'test_token'}))
        ),
    ],
};

thing.stories.js

export default {
    component: Thing,
    parameters: {
        msw: [
            rest.get('/some/endpoint', (req, res, ctx) => 
                res(ctx.json([]))
            ),
        ],
    },
};

Both handlers should work in the story. Currently, the oauth/token handler is not included in the story.

[shilman]

@sklawren this is an interesting pattern. i wasn’t a fan initially because “object merge with array flattening” is harder to explain than “object merge”, but if one really wants to use arrays, this gets that AND merge AND backwards compatibility, which is pretty cool. A+ for creativity. my vote would still be for the simplicity of object merge, but i’ve got no horse in this race! 🏇

[shilman]

@kettanaito If you accumulate arrays then there’s no natural way to override anything that’s defined in a higher level in the hierarchy. The decision was made five years ago, so it’s all a distant memory at this point. But my recollection is that initially we merged arrays and then we backed it out based on problems it caused.