Core: Add globalArgs/globalArgTypes preview.js exports

examples/official-storybook/preview.js

@@ -58,3 +58,12 @@ addParameters({
 export const parameters = {
   exportedParameter: 'exportedParameter',
 };
+
+export const globalArgs = {
+  foo: 'fooValue',
+};
+
+export const globalArgTypes = {
+  foo: { defaultValue: 'fooDefaultValue' },
+  bar: { defaultValue: 'barDefaultValue' },
+};

lib/client-api/src/story_store.test.ts

@@ -216,6 +216,26 @@ describe('preview.story_store', () => {
       });
     });
 
+    it('is initialized to the default values stored in parameters.globalArgsTypes on the first story', () => {
+      const store = new StoryStore({ channel });
+      addStoryToStore(store, 'a', '1', () => 0, {
+        globalArgs: {
+          arg1: 'arg1',
+          arg2: 2,
+        },
+        globalArgTypes: {
+          arg2: { defaultValue: 'arg2' },
+          arg3: { defaultValue: { complex: { object: ['type'] } } },
+        },
+      });
+      store.finishConfiguring();
+      expect(store.getRawStory('a', '1').globalArgs).toEqual({
+        arg1: 'arg1',
+        arg2: 2,
+        arg3: { complex: { object: ['type'] } },
+      });
+    });
+
     it('on HMR it sensibly re-initializes with memory', () => {
       const store = new StoryStore({ channel });
       addons.setChannel(channel);

lib/client-api/src/story_store.ts

@@ -138,9 +138,19 @@ export default class StoryStore {
     const storyIds = Object.keys(this._stories);
     if (storyIds.length) {
       const {
-        parameters: { globalArgs },
+        parameters: { globalArgs: initialGlobalArgs, globalArgTypes },
       } = this.fromId(storyIds[0]);
 
+      const defaultGlobalArgs: Args = globalArgTypes
+        ? Object.entries(globalArgTypes as Record<string, { defaultValue: any }>).reduce(
+            (acc, [arg, { defaultValue }]) => {
+              if (defaultValue) acc[arg] = defaultValue;
+              return acc;
+            },
+            {} as Args
+          )
+        : {};
+
       // To deal with HMR, we consider the previous value of global args, and:
       //   1. Remove any keys that are not in the new parameter
       //   2. Preference any keys that were already set
@@ -151,7 +161,7 @@ export default class StoryStore {
 
           return acc;
         },
-        globalArgs
+        { ...defaultGlobalArgs, ...initialGlobalArgs }
       );
     }
   }

lib/core/src/server/preview/iframe-webpack.config.js

@@ -55,12 +55,12 @@ export default ({
       virtualModuleMapping[entryFilename] = `
         import { addDecorator, addParameters, addParameterEnhancer } from '@storybook/client-api';
 
-        const { decorators, parameters,parameterEnhancers } = require(${JSON.stringify(
+        const { decorators, parameters, parameterEnhancers, globalArgs, globalArgTypes } = require(${JSON.stringify(
           configFilename
         )});
 
         if (decorators) decorators.forEach(decorator => addDecorator(decorator));
-        if (parameters) addParameters(parameters);
+        if (parameters || globalArgs || globalArgTypes) addParameters({ ...parameters, globalArgs, globalArgTypes });
         if (parameterEnhancers) parameterEnhancers.forEach(enhancer => addParameterEnhancer(enhancer));
       `;
     }