Release: Patch 9.1.15

CHANGELOG.md

@@ -1,3 +1,8 @@
+## 9.1.15
+
+- Core: Add `preview-first-load` telemetry - [#32770](https://github.com/storybookjs/storybook/pull/32770), thanks @shilman!
+- Dependencies: Update `vite-plugin-storybook-nextjs` - [#32821](https://github.com/storybookjs/storybook/pull/32821), thanks @ndelangen!
+
 ## 9.1.14
 
 - NextJS: Add NextJS 16 support - [#32791](https://github.com/storybookjs/storybook/pull/32791), thanks @yannbf and @ndelangen!

code/core/src/core-events/index.ts

@@ -58,6 +58,8 @@ enum events {
   // A global was just updated
   GLOBALS_UPDATED = 'globalsUpdated',
   REGISTER_SUBSCRIPTION = 'registerSubscription',
+  // Preview initialized for first-load-event
+  PREVIEW_INITIALIZED = 'previewInitialized',
   // Tell the manager that the user pressed a key in the preview
   PREVIEW_KEYDOWN = 'previewKeydown',
   // Tell the preview that the builder is in progress
@@ -111,6 +113,7 @@ export const {
   PLAY_FUNCTION_THREW_EXCEPTION,
   UNHANDLED_ERRORS_WHILE_PLAYING,
   PRELOAD_ENTRIES,
+  PREVIEW_INITIALIZED,
   PREVIEW_BUILDER_PROGRESS,
   PREVIEW_KEYDOWN,
   REGISTER_SUBSCRIPTION,

code/core/src/core-server/presets/common-preset.ts

@@ -29,6 +29,7 @@ import { dedent } from 'ts-dedent';
 
 import { initCreateNewStoryChannel } from '../server-channel/create-new-story-channel';
 import { initFileSearchChannel } from '../server-channel/file-search-channel';
+import { initPreviewInitializedChannel } from '../server-channel/preview-initialized-channel';
 import { defaultStaticDirs } from '../utils/constants';
 import { initializeSaveStory } from '../utils/save-story/save-story';
 import { parseStaticDir } from '../utils/server-statics';
@@ -257,6 +258,7 @@ export const experimental_serverChannel = async (
 
   initFileSearchChannel(channel, options, coreOptions);
   initCreateNewStoryChannel(channel, options, coreOptions);
+  initPreviewInitializedChannel(channel, options, coreOptions);
 
   return channel;
 };

code/core/src/core-server/server-channel/preview-initialized-channel.ts

@@ -0,0 +1,31 @@
+import type { Channel } from 'storybook/internal/channels';
+import { PREVIEW_INITIALIZED } from 'storybook/internal/core-events';
+import { telemetry } from 'storybook/internal/telemetry';
+import type { CoreConfig, Options } from 'storybook/internal/types';
+
+import { getLastEvents } from '../../telemetry/event-cache';
+import { getSessionId } from '../../telemetry/session-id';
+
+export function initPreviewInitializedChannel(
+  channel: Channel,
+  options: Options,
+  _coreConfig: CoreConfig
+) {
+  channel.on(PREVIEW_INITIALIZED, async ({ userAgent }) => {
+    if (!options.disableTelemetry) {
+      try {
+        const sessionId = await getSessionId();
+        const lastEvents = await getLastEvents();
+        const lastInit = lastEvents.init;
+        const lastPreviewFirstLoad = lastEvents['preview-first-load'];
+        if (!lastPreviewFirstLoad) {
+          const isInitSession = lastInit?.body.sessionId === sessionId;
+          const timeSinceInit = lastInit ? Date.now() - lastInit.body.timestamp : undefined;
+          telemetry('preview-first-load', { timeSinceInit, isInitSession, userAgent });
+        }
+      } catch (e) {
+        // do nothing
+      }
+    }
+  });
+}

code/core/src/manager/globals/exports.ts

@@ -559,6 +559,7 @@ export default {
     'PLAY_FUNCTION_THREW_EXCEPTION',
     'PRELOAD_ENTRIES',
     'PREVIEW_BUILDER_PROGRESS',
+    'PREVIEW_INITIALIZED',
     'PREVIEW_KEYDOWN',
     'REGISTER_SUBSCRIPTION',
     'REQUEST_WHATS_NEW_DATA',
@@ -618,6 +619,7 @@ export default {
     'PLAY_FUNCTION_THREW_EXCEPTION',
     'PRELOAD_ENTRIES',
     'PREVIEW_BUILDER_PROGRESS',
+    'PREVIEW_INITIALIZED',
     'PREVIEW_KEYDOWN',
     'REGISTER_SUBSCRIPTION',
     'REQUEST_WHATS_NEW_DATA',

code/core/src/preview-api/modules/preview-web/Preview.tsx

@@ -9,6 +9,7 @@ import {
   FORCE_REMOUNT,
   FORCE_RE_RENDER,
   GLOBALS_UPDATED,
+  PREVIEW_INITIALIZED,
   RESET_STORY_ARGS,
   type RequestData,
   type ResponseData,
@@ -128,6 +129,9 @@ export class Preview<TRenderer extends Renderer> {
       const projectAnnotations = await this.getProjectAnnotationsOrRenderError();
       await this.runBeforeAllHook(projectAnnotations);
       await this.initializeWithProjectAnnotations(projectAnnotations);
+      // eslint-disable-next-line compat/compat
+      const userAgent = globalThis?.navigator?.userAgent;
+      await this.channel.emit(PREVIEW_INITIALIZED, { userAgent });
     } catch (err) {
       this.rejectStoreInitializationPromise(err as Error);
     }

code/core/src/telemetry/event-cache.ts

@@ -24,8 +24,12 @@ export const set = async (eventType: EventType, body: any) => {
 };
 
 export const get = async (eventType: EventType) => {
-  const lastEvents = await cache.get('lastEvents');
-  return lastEvents?.[eventType];
+  const lastEvents = await getLastEvents();
+  return lastEvents[eventType];
+};
+
+export const getLastEvents = async () => {
+  return (await cache.get('lastEvents')) || {};
 };
 
 const upgradeFields = (event: any): UpgradeSummary => {

code/core/src/telemetry/telemetry.ts

@@ -97,17 +97,13 @@ export async function sendTelemetry(
   try {
     request = prepareRequest(data, context, options);
     tasks.push(request);
-    if (options.immediate) {
-      await Promise.all(tasks);
-    } else {
-      await request;
-    }
 
     const sessionId = await getSessionId();
     const eventId = nanoid();
     const body = { ...rest, eventType, eventId, sessionId, metadata, payload, context };
 
-    await saveToCache(eventType, body);
+    const waitFor = options.immediate ? tasks : [request];
+    await Promise.all([...waitFor, saveToCache(eventType, body)]);
   } catch (err) {
     //
   } finally {

code/core/src/telemetry/types.ts

@@ -31,7 +31,8 @@ export type EventType =
   | 'test-run'
   | 'addon-onboarding'
   | 'onboarding-survey'
-  | 'mocking';
+  | 'mocking'
+  | 'preview-first-load';
 
 export interface Dependency {
   version: string | undefined;

code/lib/create-storybook/src/scaffold-new-project.ts

@@ -45,10 +45,10 @@ const SUPPORTED_PROJECTS: Record<string, SupportedProject> = {
       language: 'TS',
     },
     createScript: {
-      npm: 'npm create next-app . -- --turbopack --typescript --use-npm --eslint --tailwind --no-app --import-alias="@/*" --src-dir',
+      npm: 'npm create next-app . -- --turbopack --typescript --use-npm --eslint --tailwind --no-app --import-alias="@/*" --src-dir --no-react-compiler',
       // yarn doesn't support version ranges, so we have to use npx
-      yarn: 'npx create-next-app . --turbopack --typescript --use-yarn --eslint --tailwind --no-app --import-alias="@/*" --src-dir',
-      pnpm: 'pnpm create next-app . --turbopack --typescript --use-pnpm --eslint --tailwind --no-app --import-alias="@/*" --src-dir',
+      yarn: 'npx create-next-app . --turbopack --typescript --use-yarn --eslint --tailwind --no-app --import-alias="@/*" --src-dir --no-react-compiler',
+      pnpm: 'pnpm create next-app . --turbopack --typescript --use-pnpm --eslint --tailwind --no-app --import-alias="@/*" --src-dir --no-react-compiler',
     },
   },
   'vue-vite-ts': {

code/package.json

@@ -281,5 +281,6 @@
         "Dependency Upgrades"
       ]
     ]
-  }
+  },
+  "deferredNextVersion": "9.1.15"
 }

docs/versions/latest.json

@@ -1 +1 @@
-{"version":"9.1.14","info":{"plain":"- Addon-Vitest: Support Vitest 4 - [#32819](https://github.com/storybookjs/storybook/pull/32819), thanks @yannbf!\n- CSF: Fix `play-fn` tag for methods - [#32695](https://github.com/storybookjs/storybook/pull/32695), thanks @shilman!"}}
+{"version":"9.1.15","info":{"plain":"- Core: Add `preview-first-load` telemetry - [#32770](https://github.com/storybookjs/storybook/pull/32770), thanks @shilman!\n- Dependencies: Update `vite-plugin-storybook-nextjs` - [#32821](https://github.com/storybookjs/storybook/pull/32821), thanks @ndelangen!"}}