Core: Don't fetch stories.json (either JSON or SSE) if we don't need it

addons/storyshots/storyshots-core/src/api/index.ts

@@ -24,25 +24,13 @@ function callTestMethodGlobals(
 
 const isDisabled = (parameter: any) =>
   parameter === false || (parameter && parameter.disable === true);
-
-// This is just here so that an error isn't thrown when we subclass `EventSource` in `StoryIndexClient`
-// Currently the v7 store (that uses the client) does not work with Storyshots.
-class EventSourceStandin {
-  constructor() {
-    throw new Error('EventSourceStandin is not intended to be used');
-  }
-}
-
 function testStorySnapshots(options: StoryshotsOptions = {}) {
   if (typeof describe !== 'function') {
     throw new Error('testStorySnapshots is intended only to be used inside jest');
   }
 
   addons.setChannel(mockChannel());
 
-  // Add a mock EventSource class as it is extended by the `StoryIndexClient` (we don't actually use that in v6 mode)
-  if (!global.EventSource) global.EventSource = EventSourceStandin;
-
   const { storybook, framework, renderTree, renderShallowTree } = loadFramework(options);
   const {
     asyncJest,

lib/api/src/lib/StoryIndexClient.ts

@@ -5,18 +5,24 @@ import global from 'global';
 
 import { StoryIndex } from './stories';
 
-const { fetch } = global;
+const { window, fetch, CONFIG_TYPE } = global;
 
 const PATH = './stories.json';
 
 // The stories.json endpoint both serves the basic data on a `GET` request and a stream of
 // invalidation events when called as a `event-stream` (i.e. via SSE).
-// So the `StoryIndexClient` is a EventSource that can also do a fetch
+export class StoryIndexClient {
+  source: EventSource;
 
-// eslint-disable-next-line no-undef
-export class StoryIndexClient extends EventSource {
   constructor() {
-    super(PATH);
+    if (CONFIG_TYPE === 'DEVELOPMENT') {
+      this.source = new window.EventSource(PATH);
+    }
+  }
+
+  // Silently never emit events in built storybook modes
+  addEventListener(event: string, cb: (...args: any[]) => void) {
+    if (this.source) this.source.addEventListener(event, cb);
   }
 
   async fetch() {

lib/api/src/modules/stories.ts

@@ -36,7 +36,7 @@ import { Args, ModuleFn } from '../index';
 import { ComposedRef } from './refs';
 import { StoryIndexClient } from '../lib/StoryIndexClient';
 
-const { DOCS_MODE } = global;
+const { DOCS_MODE, FEATURES } = global;
 const INVALIDATE = 'INVALIDATE';
 
 type Direction = -1 | 1;
@@ -502,9 +502,11 @@ export const init: ModuleFn = ({
       }
     );
 
-    indexClient = new StoryIndexClient();
-    indexClient.addEventListener(INVALIDATE, () => fullAPI.fetchStoryList());
-    await fullAPI.fetchStoryList();
+    if (FEATURES.storyStoreV7) {
+      indexClient = new StoryIndexClient();
+      indexClient.addEventListener(INVALIDATE, () => fullAPI.fetchStoryList());
+      await fullAPI.fetchStoryList();
+    }
   };
 
   return {

lib/api/src/tests/stories.test.js

@@ -19,6 +19,8 @@ jest.mock('../lib/events');
 jest.mock('global', () => ({
   ...jest.requireActual('global'),
   fetch: jest.fn(() => ({ json: () => ({ v: 3, stories: mockStories() }) })),
+  FEATURES: { storyStoreV7: true },
+  CONFIG_TYPE: 'DEVELOPMENT',
 }));
 
 beforeEach(() => {

lib/builder-webpack4/src/preview/iframe-webpack.config.ts

@@ -181,6 +181,7 @@ export default async (options: Options & Record<string, any>): Promise<Configura
           options: templateOptions,
           version: packageJson.version,
           globals: {
+            CONFIG_TYPE: configType,
             LOGLEVEL: logLevel,
             FRAMEWORK_OPTIONS: frameworkOptions,
             FEATURES: features,

lib/builder-webpack5/src/preview/iframe-webpack.config.ts

@@ -180,6 +180,7 @@ export default async (options: Options & Record<string, any>): Promise<Configura
           options: templateOptions,
           version: packageJson.version,
           globals: {
+            CONFIG_TYPE: configType,
             LOGLEVEL: logLevel,
             FRAMEWORK_OPTIONS: frameworkOptions,
             FEATURES: features,

lib/manager-webpack4/src/presets/manager-preset.ts

@@ -38,6 +38,7 @@ export async function managerWebpack(
     releaseNotesData,
     presets,
     modern,
+    features,
   }: Options & ManagerWebpackOptions
 ): Promise<Configuration> {
   const envs = await presets.apply<Record<string, string>>('env');
@@ -99,6 +100,7 @@ export async function managerWebpack(
           globals: {
             CONFIG_TYPE: configType,
             LOGLEVEL: logLevel,
+            FEATURES: features,
             VERSIONCHECK: JSON.stringify(versionCheck),
             RELEASE_NOTES_DATA: JSON.stringify(releaseNotesData),
             DOCS_MODE: docsMode, // global docs mode

lib/manager-webpack5/src/presets/manager-preset.ts

@@ -37,6 +37,7 @@ export async function managerWebpack(
     releaseNotesData,
     presets,
     modern,
+    features,
   }: Options & ManagerWebpackOptions
 ): Promise<Configuration> {
   const envs = await presets.apply<Record<string, string>>('env');
@@ -98,6 +99,7 @@ export async function managerWebpack(
           globals: {
             CONFIG_TYPE: configType,
             LOGLEVEL: logLevel,
+            FEATURES: features,
             VERSIONCHECK: JSON.stringify(versionCheck),
             RELEASE_NOTES_DATA: JSON.stringify(releaseNotesData),
             DOCS_MODE: docsMode, // global docs mode

lib/preview-web/src/StoryIndexClient.ts

@@ -5,17 +5,24 @@ import global from 'global';
 
 import { StoryIndex } from '@storybook/store';
 
-const { fetch } = global;
+const { window, fetch, CONFIG_TYPE } = global;
 
 const PATH = './stories.json';
+
 // The stories.json endpoint both serves the basic data on a `GET` request and a stream of
 // invalidation events when called as a `event-stream` (i.e. via SSE).
-// So the `StoryIndexClient` is a EventSource that can also do a fetch
+export class StoryIndexClient {
+  source: EventSource;
 
-// eslint-disable-next-line no-undef
-export class StoryIndexClient extends EventSource {
   constructor() {
-    super(PATH);
+    if (CONFIG_TYPE === 'DEVELOPMENT') {
+      this.source = new window.EventSource(PATH);
+    }
+  }
+
+  // Silently never emit events in bult storybook modes
+  addEventListener(event: string, cb: (...args: any[]) => void) {
+    if (this.source) this.source.addEventListener(event, cb);
   }
 
   async fetch() {