From 7dbcbb730f1edd99a6228ca4f155c8a4fcc6d0ff Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Tue, 5 Apr 2022 17:53:21 +0200 Subject: [PATCH 01/12] add event for preloading stories on channel --- lib/preview-web/src/PreviewWeb.tsx | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/lib/preview-web/src/PreviewWeb.tsx b/lib/preview-web/src/PreviewWeb.tsx index 71c450cb1ea1..e491f1edc09a 100644 --- a/lib/preview-web/src/PreviewWeb.tsx +++ b/lib/preview-web/src/PreviewWeb.tsx @@ -127,6 +127,7 @@ export class PreviewWeb { this.channel.on(Events.RESET_STORY_ARGS, this.onResetArgs.bind(this)); this.channel.on(Events.FORCE_RE_RENDER, this.onForceReRender.bind(this)); this.channel.on(Events.FORCE_REMOUNT, this.onForceRemount.bind(this)); + this.channel.on(Events.PRELOAD_STORY, this.onPreloadStory.bind(this)); } getProjectAnnotationsOrRenderError( @@ -398,6 +399,10 @@ export class PreviewWeb { await this.onUpdateArgs({ storyId, updatedArgs }); } + async onPreloadStory({ storyId }: { storyId: string }) { + await this.storyStore.loadStory({ storyId }); + } + // ForceReRender does not include a story id, so we simply must // re-render all stories in case they are relevant async onForceReRender() { From ed05f670bf99557351244ea1001c1ebc9e05a290 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Wed, 6 Apr 2022 09:51:22 +0200 Subject: [PATCH 02/12] change name of the event --- lib/core-events/src/index.ts | 3 +++ lib/preview-web/src/PreviewWeb.tsx | 2 +- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/lib/core-events/src/index.ts b/lib/core-events/src/index.ts index 98638ef54c15..5e635b27aff4 100644 --- a/lib/core-events/src/index.ts +++ b/lib/core-events/src/index.ts @@ -16,6 +16,8 @@ enum events { FORCE_RE_RENDER = 'forceReRender', // Force the current story to re-render from scratch, with its initial args FORCE_REMOUNT = 'forceRemount', + // Request the story has been loaded into the store, ahead of time, before it's actually + STORY_PRELOAD = 'storyPreload', // The story has been loaded into the store, we have parameters/args/etc STORY_PREPARED = 'storyPrepared', // The next 6 events are emitted by the StoryRenderer when rendering the current story @@ -71,6 +73,7 @@ export const { STORY_PREPARED, STORY_CHANGED, STORY_UNCHANGED, + STORY_PRELOAD, STORY_RENDERED, STORY_MISSING, STORY_ERRORED, diff --git a/lib/preview-web/src/PreviewWeb.tsx b/lib/preview-web/src/PreviewWeb.tsx index e491f1edc09a..5b7e9d7b953d 100644 --- a/lib/preview-web/src/PreviewWeb.tsx +++ b/lib/preview-web/src/PreviewWeb.tsx @@ -127,7 +127,7 @@ export class PreviewWeb { this.channel.on(Events.RESET_STORY_ARGS, this.onResetArgs.bind(this)); this.channel.on(Events.FORCE_RE_RENDER, this.onForceReRender.bind(this)); this.channel.on(Events.FORCE_REMOUNT, this.onForceRemount.bind(this)); - this.channel.on(Events.PRELOAD_STORY, this.onPreloadStory.bind(this)); + this.channel.on(Events.STORY_PRELOAD, this.onPreloadStory.bind(this)); } getProjectAnnotationsOrRenderError( From 10d08025c27ad8845940e51e0cb02cd77f269b28 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Wed, 6 Apr 2022 09:55:35 +0200 Subject: [PATCH 03/12] cleanup --- lib/preview-web/src/PreviewWeb.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/lib/preview-web/src/PreviewWeb.tsx b/lib/preview-web/src/PreviewWeb.tsx index 5b7e9d7b953d..dae6d6247029 100644 --- a/lib/preview-web/src/PreviewWeb.tsx +++ b/lib/preview-web/src/PreviewWeb.tsx @@ -6,15 +6,15 @@ import Events, { IGNORED_EXCEPTION } from '@storybook/core-events'; import { logger } from '@storybook/client-logger'; import { addons, Channel } from '@storybook/addons'; import { AnyFramework, StoryId, ProjectAnnotations, Args, Globals } from '@storybook/csf'; -import { +import type { ModuleImportFn, Selection, Story, - StoryStore, StorySpecifier, StoryIndex, WebProjectAnnotations, } from '@storybook/store'; +import { StoryStore } from '@storybook/store'; import { UrlStore } from './UrlStore'; import { WebView } from './WebView'; From 675732731ddbcbbe483d33271416a8a8aff3ad6b Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Wed, 6 Apr 2022 13:08:17 +0200 Subject: [PATCH 04/12] add api for finding sibling storyId --- lib/api/src/lib/stories.ts | 15 +++++++ lib/api/src/modules/stories.ts | 76 ++++++++++++++++++---------------- 2 files changed, 56 insertions(+), 35 deletions(-) diff --git a/lib/api/src/lib/stories.ts b/lib/api/src/lib/stories.ts index f59305e130a5..dd6f31697927 100644 --- a/lib/api/src/lib/stories.ts +++ b/lib/api/src/lib/stories.ts @@ -1,3 +1,4 @@ +import memoize from 'memoizerific'; import React from 'react'; import deprecate from 'util-deprecate'; import dedent from 'ts-dedent'; @@ -327,3 +328,17 @@ export function isStory(item: Item): item is Story { } return false; } + +export const getComponentLookupList = memoize(1)((hash: StoriesHash) => { + return Object.entries(hash).reduce((acc, i) => { + const value = i[1]; + if (value.isComponent) { + acc.push([...i[1].children]); + } + return acc; + }, [] as StoryId[][]); +}); + +export const getStoriesLookupList = memoize(1)((hash: StoriesHash) => { + return Object.keys(hash).filter((k) => !(hash[k].children || Array.isArray(hash[k]))); +}); diff --git a/lib/api/src/modules/stories.ts b/lib/api/src/modules/stories.ts index 62b1bf358de3..75ee2fa942f6 100644 --- a/lib/api/src/modules/stories.ts +++ b/lib/api/src/modules/stories.ts @@ -22,7 +22,10 @@ import { isStory, isRoot, transformStoryIndexToStoriesHash, + getComponentLookupList, + getStoriesLookupList, } from '../lib/stories'; + import type { StoriesHash, Story, @@ -77,6 +80,12 @@ export interface SubAPI { updateStoryArgs(story: Story, newArgs: Args): void; resetStoryArgs: (story: Story, argNames?: string[]) => void; findLeafStoryId(StoriesHash: StoriesHash, storyId: StoryId): StoryId; + findSiblingStoryId( + storyId: StoryId, + hash: StoriesHash, + direction: Direction, + toSiblingGroup: boolean // when true, skip over leafs within the same group + ): StoryId; fetchStoryList: () => Promise; setStoryList: (storyList: StoryIndex) => Promise; updateStory: (storyId: StoryId, update: StoryUpdate, ref?: ComposedRef) => Promise; @@ -187,26 +196,7 @@ export const init: ModuleFn = ({ } const hash = refId ? refs[refId].stories || {} : storiesHash; - - const lookupList = Object.entries(hash).reduce((acc, i) => { - const value = i[1]; - if (value.isComponent) { - acc.push([...i[1].children]); - } - return acc; - }, []); - - const index = lookupList.findIndex((i) => i.includes(storyId)); - - // cannot navigate beyond fist or last - if (index === lookupList.length - 1 && direction > 0) { - return; - } - if (index === 0 && direction < 0) { - return; - } - - const result = lookupList[index + direction][0]; + const result = api.findSiblingStoryId(storyId, hash, direction, true); if (result) { api.selectStory(result, undefined, { ref: refId }); @@ -227,21 +217,7 @@ export const init: ModuleFn = ({ } const hash = story.refId ? refs[story.refId].stories : storiesHash; - - const lookupList = Object.keys(hash).filter( - (k) => !(hash[k].children || Array.isArray(hash[k])) - ); - const index = lookupList.indexOf(storyId); - - // cannot navigate beyond fist or last - if (index === lookupList.length - 1 && direction > 0) { - return; - } - if (index === 0 && direction < 0) { - return; - } - - const result = lookupList[index + direction]; + const result = api.findSiblingStoryId(storyId, hash, direction, true); if (result) { api.selectStory(result, undefined, { ref: refId }); @@ -332,6 +308,36 @@ export const init: ModuleFn = ({ const childStoryId = storiesHash[storyId].children[0]; return api.findLeafStoryId(storiesHash, childStoryId); }, + findSiblingStoryId(storyId, hash, direction, toSiblingGroup) { + if (toSiblingGroup) { + const lookupList = getComponentLookupList(hash); + const index = lookupList.findIndex((i) => i.includes(storyId)); + + // cannot navigate beyond fist or last + if (index === lookupList.length - 1 && direction > 0) { + return; + } + if (index === 0 && direction < 0) { + return; + } + + // eslint-disable-next-line consistent-return + return lookupList[index + direction][0]; + } + const lookupList = getStoriesLookupList(hash); + const index = lookupList.indexOf(storyId); + + // cannot navigate beyond fist or last + if (index === lookupList.length - 1 && direction > 0) { + return; + } + if (index === 0 && direction < 0) { + return; + } + + // eslint-disable-next-line consistent-return + return lookupList[index + direction]; + }, updateStoryArgs: (story, updatedArgs) => { const { id: storyId, refId } = story; fullAPI.emit(UPDATE_STORY_ARGS, { From 5c7cc8c14891dfb313ed70d53860331fc42c778b Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Wed, 6 Apr 2022 14:03:05 +0200 Subject: [PATCH 05/12] fix incorrect boolean & add tests --- lib/api/src/modules/stories.ts | 2 +- lib/api/src/tests/stories.test.js | 51 +++++++++++++++++++++++++++++-- 2 files changed, 50 insertions(+), 3 deletions(-) diff --git a/lib/api/src/modules/stories.ts b/lib/api/src/modules/stories.ts index 75ee2fa942f6..fc1898f30958 100644 --- a/lib/api/src/modules/stories.ts +++ b/lib/api/src/modules/stories.ts @@ -217,7 +217,7 @@ export const init: ModuleFn = ({ } const hash = story.refId ? refs[story.refId].stories : storiesHash; - const result = api.findSiblingStoryId(storyId, hash, direction, true); + const result = api.findSiblingStoryId(storyId, hash, direction, false); if (result) { api.selectStory(result, undefined, { ref: refId }); diff --git a/lib/api/src/tests/stories.test.js b/lib/api/src/tests/stories.test.js index a6158410708f..d083778969f2 100644 --- a/lib/api/src/tests/stories.test.js +++ b/lib/api/src/tests/stories.test.js @@ -12,6 +12,7 @@ import { EventEmitter } from 'events'; import global from 'global'; import { mockChannel } from '@storybook/addons'; +import { stopCoverage } from 'v8'; import { getEventMetadata } from '../lib/events'; import { init as initStories } from '../modules/stories'; @@ -85,8 +86,22 @@ describe('stories API', () => { }); const parameters = {}; const storiesHash = { - 'a--1': { kind: 'a', name: '1', parameters, path: 'a--1', id: 'a--1', args: {} }, - 'a--2': { kind: 'a', name: '2', parameters, path: 'a--2', id: 'a--2', args: {} }, + 'a--1': { + kind: 'a', + name: '1', + parameters, + path: 'a--1', + id: 'a--1', + args: {}, + }, + 'a--2': { + kind: 'a', + name: '2', + parameters, + path: 'a--2', + id: 'a--2', + args: {}, + }, 'b-c--1': { kind: 'b/c', name: '1', @@ -703,6 +718,38 @@ describe('stories API', () => { }); }); + describe('findSiblingStoryId', () => { + it('works forward', () => { + const navigate = jest.fn(); + const store = createMockStore(); + + const storyId = 'a--1'; + const { + api: { setStories, findSiblingStoryId }, + state, + } = initStories({ store, navigate, storyId, viewMode: 'story', provider }); + store.setState(state); + setStories(storiesHash); + + const result = findSiblingStoryId(storyId, storiesHash, 1, false); + expect(result).toBe('a--2'); + }); + it('works forward toSiblingGroup', () => { + const navigate = jest.fn(); + const store = createMockStore(); + + const storyId = 'a--1'; + const { + api: { setStories, findSiblingStoryId }, + state, + } = initStories({ store, navigate, storyId, viewMode: 'story', provider }); + store.setState(state); + setStories(storiesHash); + + const result = findSiblingStoryId(storyId, store.getState().storiesHash, 1, true); + expect(result).toBe('b-c--1'); + }); + }); describe('jumpToComponent', () => { it('works forward', () => { const navigate = jest.fn(); From 3e72da20ae5f74d739df413bd490df43d13c24cf Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Wed, 6 Apr 2022 17:36:42 +0200 Subject: [PATCH 06/12] call preloadStories with a list of related stories when story changed --- lib/api/src/modules/stories.ts | 14 ++++++++++++++ lib/preview-web/src/PreviewWeb.tsx | 4 ++-- 2 files changed, 16 insertions(+), 2 deletions(-) diff --git a/lib/api/src/modules/stories.ts b/lib/api/src/modules/stories.ts index fc1898f30958..8024db802819 100644 --- a/lib/api/src/modules/stories.ts +++ b/lib/api/src/modules/stories.ts @@ -1,6 +1,7 @@ import global from 'global'; import { toId, sanitize } from '@storybook/csf'; import { + STORY_PRELOAD, STORY_PREPARED, UPDATE_STORY_ARGS, RESET_STORY_ARGS, @@ -445,12 +446,25 @@ export const init: ModuleFn = ({ const { sourceType } = getEventMetadata(this, fullAPI); if (sourceType === 'local') { + const { storyId, storiesHash } = store.getState(); const options = fullAPI.getCurrentParameter('options'); if (options) { checkDeprecatedOptionParameters(options); fullAPI.setOptions(options); } + + // create a list of related stories to be preloaded + const toBePreloaded = Array.from( + new Set([ + api.findSiblingStoryId(storyId, storiesHash, 1, false), + api.findSiblingStoryId(storyId, storiesHash, -1, false), + api.findSiblingStoryId(storyId, storiesHash, 1, true), + api.findSiblingStoryId(storyId, storiesHash, -1, true), + ]) + ); + + fullAPI.emit(STORY_PRELOAD, toBePreloaded); } }); diff --git a/lib/preview-web/src/PreviewWeb.tsx b/lib/preview-web/src/PreviewWeb.tsx index dae6d6247029..e984fadf7e7a 100644 --- a/lib/preview-web/src/PreviewWeb.tsx +++ b/lib/preview-web/src/PreviewWeb.tsx @@ -399,8 +399,8 @@ export class PreviewWeb { await this.onUpdateArgs({ storyId, updatedArgs }); } - async onPreloadStory({ storyId }: { storyId: string }) { - await this.storyStore.loadStory({ storyId }); + async onPreloadStory(ids: string[]) { + await Promise.all(ids.map((id) => this.storyStore.loadStory({ storyId: id }))); } // ForceReRender does not include a story id, so we simply must From c6e9ee0d0dca200ce40020c408411b96d602eec1 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Thu, 7 Apr 2022 11:18:45 +0200 Subject: [PATCH 07/12] fix review comments & add a unit-test --- lib/api/src/modules/stories.ts | 6 ++---- lib/core-events/src/index.ts | 4 ++-- lib/preview-web/src/PreviewWeb.test.ts | 17 +++++++++++++++++ lib/preview-web/src/PreviewWeb.tsx | 5 ++--- 4 files changed, 23 insertions(+), 9 deletions(-) diff --git a/lib/api/src/modules/stories.ts b/lib/api/src/modules/stories.ts index 8024db802819..08af803aea36 100644 --- a/lib/api/src/modules/stories.ts +++ b/lib/api/src/modules/stories.ts @@ -1,7 +1,7 @@ import global from 'global'; import { toId, sanitize } from '@storybook/csf'; import { - STORY_PRELOAD, + PRELOAD_STORIES, STORY_PREPARED, UPDATE_STORY_ARGS, RESET_STORY_ARGS, @@ -457,14 +457,12 @@ export const init: ModuleFn = ({ // create a list of related stories to be preloaded const toBePreloaded = Array.from( new Set([ - api.findSiblingStoryId(storyId, storiesHash, 1, false), - api.findSiblingStoryId(storyId, storiesHash, -1, false), api.findSiblingStoryId(storyId, storiesHash, 1, true), api.findSiblingStoryId(storyId, storiesHash, -1, true), ]) ); - fullAPI.emit(STORY_PRELOAD, toBePreloaded); + fullAPI.emit(PRELOAD_STORIES, toBePreloaded); } }); diff --git a/lib/core-events/src/index.ts b/lib/core-events/src/index.ts index 5e635b27aff4..ab11f81da3e3 100644 --- a/lib/core-events/src/index.ts +++ b/lib/core-events/src/index.ts @@ -17,7 +17,7 @@ enum events { // Force the current story to re-render from scratch, with its initial args FORCE_REMOUNT = 'forceRemount', // Request the story has been loaded into the store, ahead of time, before it's actually - STORY_PRELOAD = 'storyPreload', + PRELOAD_STORIES = 'storyPreload', // The story has been loaded into the store, we have parameters/args/etc STORY_PREPARED = 'storyPrepared', // The next 6 events are emitted by the StoryRenderer when rendering the current story @@ -73,7 +73,7 @@ export const { STORY_PREPARED, STORY_CHANGED, STORY_UNCHANGED, - STORY_PRELOAD, + PRELOAD_STORIES, STORY_RENDERED, STORY_MISSING, STORY_ERRORED, diff --git a/lib/preview-web/src/PreviewWeb.test.ts b/lib/preview-web/src/PreviewWeb.test.ts index f5436f57b518..3e486f9a0a85 100644 --- a/lib/preview-web/src/PreviewWeb.test.ts +++ b/lib/preview-web/src/PreviewWeb.test.ts @@ -1022,6 +1022,23 @@ describe('PreviewWeb', () => { }); }); + describe('onPreloadStories', () => { + it('loads stories', async () => { + document.location.search = '?id=component-one--a&viewMode=docs'; + const mockedImportFn = jest.fn(() => + Promise.resolve({ default: { title: 'Component Two' }, C: () => {} } as any) + ); + const preview = await createAndRenderPreview({ + importFn: mockedImportFn, + }); + await preview.onPreloadStories(['component-two--c']); + + await waitForRender(); + + expect(mockedImportFn).toHaveBeenCalledWith('./src/ComponentTwo.stories.js'); + }); + }); + describe('onResetArgs', () => { it('emits STORY_ARGS_UPDATED', async () => { document.location.search = '?id=component-one--a'; diff --git a/lib/preview-web/src/PreviewWeb.tsx b/lib/preview-web/src/PreviewWeb.tsx index 8b2092ff30f6..417730034bd3 100644 --- a/lib/preview-web/src/PreviewWeb.tsx +++ b/lib/preview-web/src/PreviewWeb.tsx @@ -13,7 +13,6 @@ import type { PromiseLike, WebProjectAnnotations, } from '@storybook/store'; -import { StoryStore } from '@storybook/store'; import { Preview } from './Preview'; @@ -67,7 +66,7 @@ export class PreviewWeb extends Preview) { @@ -210,7 +209,7 @@ export class PreviewWeb extends Preview this.storyStore.loadStory({ storyId: id }))); } From 02a2ba32fd07ec3b6f6b2457dffaf47ff4929780 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Thu, 7 Apr 2022 11:21:17 +0200 Subject: [PATCH 08/12] cleanup --- lib/api/src/tests/stories.test.js | 1 - 1 file changed, 1 deletion(-) diff --git a/lib/api/src/tests/stories.test.js b/lib/api/src/tests/stories.test.js index d083778969f2..e8eecac18cd8 100644 --- a/lib/api/src/tests/stories.test.js +++ b/lib/api/src/tests/stories.test.js @@ -12,7 +12,6 @@ import { EventEmitter } from 'events'; import global from 'global'; import { mockChannel } from '@storybook/addons'; -import { stopCoverage } from 'v8'; import { getEventMetadata } from '../lib/events'; import { init as initStories } from '../modules/stories'; From ff78d13842278e2da1028413b05bfaab3bbf30c6 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Thu, 7 Apr 2022 12:48:36 +0200 Subject: [PATCH 09/12] change implementation to preload stories only when the STORY_PREPARED is emitted This only happens when StoryStoreV7 is enabled --- lib/api/src/modules/stories.ts | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/lib/api/src/modules/stories.ts b/lib/api/src/modules/stories.ts index 08af803aea36..9c4077971afa 100644 --- a/lib/api/src/modules/stories.ts +++ b/lib/api/src/modules/stories.ts @@ -446,13 +446,20 @@ export const init: ModuleFn = ({ const { sourceType } = getEventMetadata(this, fullAPI); if (sourceType === 'local') { - const { storyId, storiesHash } = store.getState(); const options = fullAPI.getCurrentParameter('options'); if (options) { checkDeprecatedOptionParameters(options); fullAPI.setOptions(options); } + } + }); + + fullAPI.on(STORY_PREPARED, function handler() { + const { sourceType } = getEventMetadata(this, fullAPI); + + if (sourceType === 'local') { + const { storyId, storiesHash } = store.getState(); // create a list of related stories to be preloaded const toBePreloaded = Array.from( @@ -460,7 +467,7 @@ export const init: ModuleFn = ({ api.findSiblingStoryId(storyId, storiesHash, 1, true), api.findSiblingStoryId(storyId, storiesHash, -1, true), ]) - ); + ).filter(Boolean); fullAPI.emit(PRELOAD_STORIES, toBePreloaded); } From d4b476b17e5418f77c42dd028c68c2aff631a0f9 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 8 Apr 2022 12:05:18 +0200 Subject: [PATCH 10/12] Update lib/core-events/src/index.ts Co-authored-by: Tom Coleman --- lib/core-events/src/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/core-events/src/index.ts b/lib/core-events/src/index.ts index ab11f81da3e3..9cacf48ea153 100644 --- a/lib/core-events/src/index.ts +++ b/lib/core-events/src/index.ts @@ -17,7 +17,7 @@ enum events { // Force the current story to re-render from scratch, with its initial args FORCE_REMOUNT = 'forceRemount', // Request the story has been loaded into the store, ahead of time, before it's actually - PRELOAD_STORIES = 'storyPreload', + PRELOAD_STORIES = 'preloadStories', // The story has been loaded into the store, we have parameters/args/etc STORY_PREPARED = 'storyPrepared', // The next 6 events are emitted by the StoryRenderer when rendering the current story From acb43034e42fcf7e3be0f068f293126fc036413e Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 8 Apr 2022 12:18:26 +0200 Subject: [PATCH 11/12] Update lib/preview-web/src/PreviewWeb.test.ts Co-authored-by: Tom Coleman --- lib/preview-web/src/PreviewWeb.test.ts | 13 ++++--------- 1 file changed, 4 insertions(+), 9 deletions(-) diff --git a/lib/preview-web/src/PreviewWeb.test.ts b/lib/preview-web/src/PreviewWeb.test.ts index 3e486f9a0a85..dcb051002edd 100644 --- a/lib/preview-web/src/PreviewWeb.test.ts +++ b/lib/preview-web/src/PreviewWeb.test.ts @@ -1025,17 +1025,12 @@ describe('PreviewWeb', () => { describe('onPreloadStories', () => { it('loads stories', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - const mockedImportFn = jest.fn(() => - Promise.resolve({ default: { title: 'Component Two' }, C: () => {} } as any) - ); - const preview = await createAndRenderPreview({ - importFn: mockedImportFn, - }); - await preview.onPreloadStories(['component-two--c']); - + const preview = await createAndRenderPreview(); await waitForRender(); - expect(mockedImportFn).toHaveBeenCalledWith('./src/ComponentTwo.stories.js'); + importFn.mockClear(); + await preview.onPreloadStories(['component-two--c']); + expect(importFn).toHaveBeenCalledWith('./src/ComponentTwo.stories.js'); }); }); From c01880d05e52644312267c613169bee42863eaee Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 8 Apr 2022 13:44:46 +0200 Subject: [PATCH 12/12] fix unit tests --- lib/api/src/modules/stories.ts | 39 +++++++++++++++++----------------- 1 file changed, 19 insertions(+), 20 deletions(-) diff --git a/lib/api/src/modules/stories.ts b/lib/api/src/modules/stories.ts index 9c4077971afa..70b3c5ba8800 100644 --- a/lib/api/src/modules/stories.ts +++ b/lib/api/src/modules/stories.ts @@ -322,8 +322,11 @@ export const init: ModuleFn = ({ return; } - // eslint-disable-next-line consistent-return - return lookupList[index + direction][0]; + if (lookupList[index + direction]) { + // eslint-disable-next-line consistent-return + return lookupList[index + direction][0]; + } + return; } const lookupList = getStoriesLookupList(hash); const index = lookupList.indexOf(storyId); @@ -455,8 +458,20 @@ export const init: ModuleFn = ({ } }); - fullAPI.on(STORY_PREPARED, function handler() { - const { sourceType } = getEventMetadata(this, fullAPI); + fullAPI.on(STORY_PREPARED, function handler({ id, ...update }) { + const { ref, sourceType } = getEventMetadata(this, fullAPI); + fullAPI.updateStory(id, { ...update, prepared: true }, ref); + + if (!ref) { + if (!store.getState().hasCalledSetOptions) { + const { options } = update.parameters; + checkDeprecatedOptionParameters(options); + fullAPI.setOptions(options); + store.setState({ hasCalledSetOptions: true }); + } + } else { + fullAPI.updateRef(ref.id, { ready: true }); + } if (sourceType === 'local') { const { storyId, storiesHash } = store.getState(); @@ -514,22 +529,6 @@ export const init: ModuleFn = ({ } ); - fullAPI.on(STORY_PREPARED, function handler({ id, ...update }) { - const { ref } = getEventMetadata(this, fullAPI); - fullAPI.updateStory(id, { ...update, prepared: true }, ref); - - if (!ref) { - if (!store.getState().hasCalledSetOptions) { - const { options } = update.parameters; - checkDeprecatedOptionParameters(options); - fullAPI.setOptions(options); - store.setState({ hasCalledSetOptions: true }); - } - } else { - fullAPI.updateRef(ref.id, { ready: true }); - } - }); - fullAPI.on( STORY_ARGS_UPDATED, function handleStoryArgsUpdated({ storyId, args }: { storyId: StoryId; args: Args }) {