@storybook/core - npm Package Compare versions

Comparing version 3.4.0-alpha.4 to 3.4.0-alpha.5

dist/client/preview/client_api.js

@@ -25,4 +25,10 @@ 'use strict';
 
+var _story_store = require('./story_store');
+
+var _story_store2 = _interopRequireDefault(_story_store);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+/* eslint no-underscore-dangle: 0 */
+
 var defaultDecorateStory = function defaultDecorateStory(getStory, decorators) {
@@ -36,11 +42,14 @@ return decorators.reduce(function (decorated, decorator) {
   }, getStory);
-}; /* eslint no-underscore-dangle: 0 */
+};
 
-var ClientApi = function ClientApi(_ref) {
+var ClientApi = function ClientApi() {
   var _this = this;
 
-  var channel = _ref.channel,
-      storyStore = _ref.storyStore,
+  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      channel = _ref.channel,
+      _ref$storyStore = _ref.storyStore,
+      storyStore = _ref$storyStore === undefined ? new _story_store2.default() : _ref$storyStore,
       _ref$decorateStory = _ref.decorateStory,
       decorateStory = _ref$decorateStory === undefined ? defaultDecorateStory : _ref$decorateStory;
+
   (0, _classCallCheck3.default)(this, ClientApi);
@@ -47,0 +56,0 @@

dist/client/preview/story_store.js

@@ -146,3 +146,5 @@ 'use strict';
     value: function removeStoryKind(kind) {
-      this._data[kind].stories = {};
+      if (this.hasStoryKind(kind)) {
+        this._data[kind].stories = {};
+      }
     }
@@ -149,0 +151,0 @@ }, {

package.json

 {
   "name": "@storybook/core",
-  "version": "3.4.0-alpha.4",
+  "version": "3.4.0-alpha.5",
   "description": "Storybook framework-agnostic API",
@@ -20,3 +20,3 @@ "homepage": "https://github.com/storybooks/storybook/tree/master/lib/core",
   "dependencies": {
-    "@storybook/client-logger": "^3.4.0-alpha.4",
+    "@storybook/client-logger": "^3.4.0-alpha.5",
     "events": "^1.1.1",
@@ -23,0 +23,0 @@ "global": "^4.3.2",

src/client/preview/client_api.js

@@ -5,2 +5,4 @@ /* eslint no-underscore-dangle: 0 */
 
+import StoryStore from './story_store';
+
 const defaultDecorateStory = (getStory, decorators) =>
@@ -13,3 +15,7 @@ decorators.reduce(
 export default class ClientApi {
-  constructor({ channel, storyStore, decorateStory = defaultDecorateStory }) {
+  constructor({
+    channel,
+    storyStore = new StoryStore(),
+    decorateStory = defaultDecorateStory,
+  } = {}) {
     // channel can be null when running in node
@@ -16,0 +22,0 @@ // always check whether channel is available

src/client/preview/client_api.test.js

@@ -5,48 +5,2 @@ /* eslint no-underscore-dangle: 0 */
 
-class StoryStore {
-  constructor() {
-    this.stories = [];
-  }
-
-  addStory(kind, story, fn, fileName) {
-    this.stories.push({ kind, story, fn, fileName });
-  }
-
-  getStoryKinds() {
-    return this.stories.reduce((kinds, info) => {
-      if (kinds.indexOf(info.kind) === -1) {
-        kinds.push(info.kind);
-      }
-      return kinds;
-    }, []);
-  }
-
-  getStories(kind) {
-    return this.stories.reduce((stories, info) => {
-      if (info.kind === kind) {
-        stories.push(info.story);
-      }
-      return stories;
-    }, []);
-  }
-
-  getStoryFileName(kind) {
-    const story = this.stories.find(info => info.kind === kind);
-    return story ? story.fileName : null;
-  }
-
-  getStory(kind, name) {
-    return this.stories.reduce((fn, info) => {
-      if (!fn && info.kind === kind && info.story === name) {
-        return info.fn;
-      }
-      return fn;
-    }, null);
-  }
-
-  hasStory(kind, name) {
-    return Boolean(this.getStory(kind, name));
-  }
-}
-
 describe('preview.client_api', () => {
@@ -142,4 +96,14 @@ describe('setAddon', () => {
   describe('addDecorator', () => {
+    class MockStoryStore {
+      stories = [];
+      addStory(kind, name, fn, fileName) {
+        this.stories.push({ kind, name, fn, fileName });
+      }
+      hasStory(k, n) {
+        return this.stories.find(({ kind, name }) => kind === k && name === n);
+      }
+    }
+
     it('should add local decorators', () => {
-      const storyStore = new StoryStore();
+      const storyStore = new MockStoryStore();
       const api = new ClientAPI({ storyStore });
@@ -154,3 +118,3 @@ const localApi = api.storiesOf('none', module);
     it('should add global decorators', () => {
-      const storyStore = new StoryStore();
+      const storyStore = new MockStoryStore();
       const api = new ClientAPI({ storyStore });
@@ -165,3 +129,3 @@ api.addDecorator(fn => `bb-${fn()}`);
     it('should utilize both decorators at once', () => {
-      const storyStore = new StoryStore();
+      const storyStore = new MockStoryStore();
       const api = new ClientAPI({ storyStore });
@@ -178,3 +142,3 @@ const localApi = api.storiesOf('none', module);
     it('should pass the context', () => {
-      const storyStore = new StoryStore();
+      const storyStore = new MockStoryStore();
       const api = new ClientAPI({ storyStore });
@@ -194,3 +158,3 @@ const localApi = api.storiesOf('none', module);
     it('should have access to the context', () => {
-      const storyStore = new StoryStore();
+      const storyStore = new MockStoryStore();
       const api = new ClientAPI({ storyStore });
@@ -220,24 +184,22 @@ const localApi = api.storiesOf('none', module);
   describe('getStorybook', () => {
-    it('should return storybook when empty', () => {
-      const storyStore = new StoryStore();
-      const api = new ClientAPI({ storyStore });
-      const book = api.getStorybook();
-      expect(book).toEqual([]);
-    });
+    it('should transform the storybook to an array with filenames', () => {
+      class MockStoryStore {
+        getStoryKinds() {
+          return ['kind-1', 'kind-2'];
+        }
 
-    it('should return storybook with stories', () => {
-      const storyStore = new StoryStore();
-      const api = new ClientAPI({ storyStore });
-      const functions = {
-        'story-1.1': () => 'story-1.1',
-        'story-1.2': () => 'story-1.2',
-        'story-2.1': () => 'story-2.1',
-        'story-2.2': () => 'story-2.2',
-      };
-      const kind1 = api.storiesOf('kind-1', { filename: 'kind1.js' });
-      kind1.add('story-1.1', functions['story-1.1']);
-      kind1.add('story-1.2', functions['story-1.2']);
-      const kind2 = api.storiesOf('kind-2', { filename: 'kind2.js' });
-      kind2.add('story-2.1', functions['story-2.1']);
-      kind2.add('story-2.2', functions['story-2.2']);
+        getStoryFileName(kind) {
+          return `${kind}.js`;
+        }
+
+        getStories() {
+          return ['a', 'b'];
+        }
+
+        getStory(kind, name) {
+          return `${kind}:${name}`;
+        }
+      }
+
+      const api = new ClientAPI({ storyStore: new MockStoryStore() });
       const book = api.getStorybook();
@@ -247,51 +209,70 @@ expect(book).toEqual([
           kind: 'kind-1',
-          fileName: 'kind1.js',
-          stories: [
-            { name: 'story-1.1', render: functions['story-1.1'] },
-            { name: 'story-1.2', render: functions['story-1.2'] },
-          ],
+          fileName: 'kind-1.js',
+          stories: [{ name: 'a', render: 'kind-1:a' }, { name: 'b', render: 'kind-1:b' }],
         },
         {
           kind: 'kind-2',
-          fileName: 'kind2.js',
-          stories: [
-            { name: 'story-2.1', render: functions['story-2.1'] },
-            { name: 'story-2.2', render: functions['story-2.2'] },
-          ],
+          fileName: 'kind-2.js',
+          stories: [{ name: 'a', render: 'kind-2:a' }, { name: 'b', render: 'kind-2:b' }],
         },
       ]);
     });
+  });
 
-    it('should return storybook with file names when module with file name provided', () => {
-      const storyStore = new StoryStore();
-      const api = new ClientAPI({ storyStore });
-      const functions = {
-        'story-1.1': () => 'story-1.1',
-        'story-1.2': () => 'story-1.2',
-        'story-2.1': () => 'story-2.1',
-        'story-2.2': () => 'story-2.2',
+  describe('reads filename from module', () => {
+    const api = new ClientAPI();
+    const story = () => 0;
+    api.storiesOf('kind', { filename: 'foo.js' }).add('story', story);
+    expect(api.getStorybook()).toEqual([
+      { kind: 'kind', fileName: 'foo.js', stories: [{ name: 'story', render: story }] },
+    ]);
+  });
+
+  describe('hot module loading', () => {
+    class MockModule {
+      hot = {
+        callbacks: [],
+        dispose(fn) {
+          this.callbacks.push(fn);
+        },
+        reload() {
+          this.callbacks.forEach(fn => fn());
+        },
       };
-      const kind1 = api.storiesOf('kind-1', { filename: 'foo' });
-      kind1.add('story-1.1', functions['story-1.1']);
-      kind1.add('story-1.2', functions['story-1.2']);
-      const kind2 = api.storiesOf('kind-2', { filename: 'bar' });
-      kind2.add('story-2.1', functions['story-2.1']);
-      kind2.add('story-2.2', functions['story-2.2']);
-      const book = api.getStorybook();
-      expect(book).toEqual([
+    }
+
+    it('should increment store revision when the module reloads', () => {
+      const api = new ClientAPI();
+      expect(api._storyStore.getRevision()).toEqual(0);
+
+      const module = new MockModule();
+      api.storiesOf('kind', module);
+      module.hot.reload();
+
+      expect(api._storyStore.getRevision()).toEqual(1);
+    });
+
+    it('should replace a kind when the module reloads', () => {
+      const module = new MockModule();
+      const stories = [jest.fn(), jest.fn()];
+
+      const api = new ClientAPI();
+      expect(api.getStorybook()).toEqual([]);
+
+      api.storiesOf('kind', module).add('story', stories[0]);
+      expect(api.getStorybook()).toEqual([
         {
-          kind: 'kind-1',
-          fileName: 'foo',
-          stories: [
-            { name: 'story-1.1', render: functions['story-1.1'] },
-            { name: 'story-1.2', render: functions['story-1.2'] },
-          ],
+          kind: 'kind',
+          stories: [{ name: 'story', render: stories[0] }],
         },
+      ]);
+
+      module.hot.reload();
+      expect(api.getStorybook()).toEqual([]);
+
+      api.storiesOf('kind', module).add('story', stories[1]);
+      expect(api.getStorybook()).toEqual([
         {
-          kind: 'kind-2',
-          fileName: 'bar',
-          stories: [
-            { name: 'story-2.1', render: functions['story-2.1'] },
-            { name: 'story-2.2', render: functions['story-2.2'] },
-          ],
+          kind: 'kind',
+          stories: [{ name: 'story', render: stories[1] }],
         },
@@ -298,0 +279,0 @@ ]);

src/client/preview/story_store.js

@@ -88,3 +88,5 @@ /* eslint no-underscore-dangle: 0 */
   removeStoryKind(kind) {
-    this._data[kind].stories = {};
+    if (this.hasStoryKind(kind)) {
+      this._data[kind].stories = {};
+    }
   }
@@ -91,0 +93,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

39311

increased by2.87%

Number of package files

22

increased by4.76%

Lines of code

1105

increased by2.89%

Dependency changes

• Updated@storybook/client-logger@^3.4.0-alpha.5