storybook-addon-playwright 5.2.0 → 5.4.0

package/README.md

@@ -86,6 +86,48 @@ module.exports = function (router) {
 For a full list of available options with detailed descriptions, see the [`Config` interface in `src/typings/config.ts`](src/typings/config.ts).
 Every option is documented with a JSDoc comment explaining its purpose, parameters, and usage.
 
+### AI prompt helper for `getScreenshotTitle`
+
+This package exports `createScreenshotTitlePrompt(data, options)` so you can build a strict LLM prompt for title generation and reuse it across projects.
+
+The helper is designed for small models too. It asks the model to:
+
+- parse the provided data as JSON,
+- understand each field,
+- generate a concise title,
+- return JSON only in this shape: `{ "title": "..." }`.
+
+Example:
+
+```js
+const { setConfig } = require('storybook-addon-playwright/configs');
+const { createScreenshotTitlePrompt } = require('storybook-addon-playwright');
+
+async function askLlm(prompt) {
+  // Call your LLM provider here and return parsed JSON.
+  // The model response must match: { title: string }
+  return { title: 'Button / primary / loading' };
+}
+
+setConfig({
+  storybookEndpoint: 'http://localhost:6006/',
+  getPage: async () => {
+    throw new Error('Example only: implement getPage');
+  },
+  getScreenshotTitle: async (data) => {
+    const prompt = createScreenshotTitlePrompt(data, {
+      maxTitleLength: 72,
+      fallbackTitle: 'Should render correctly.',
+      includeBrowserType: true,
+      includeStoryId: false,
+    });
+
+    const result = await askLlm(prompt);
+    return result.title;
+  },
+});
+```
+
 ## How it works
 
 The addon is an interface between Playwright and Storybook stories. It executes user-defined action sequences on the Playwright page provided in the configuration.

package/dist/api/server/routes.d.mts

@@ -2,12 +2,12 @@ import { appRouter } from '../../trpc/router.mjs';
 import '@material-ui/core';
 import 'playwright';
 import 'ts-to-json';
-import '../../request-CyuY6GGO.mjs';
+import '../../request-B60Gnj7P.mjs';
 import 'zod';
 import '@trpc/server';
 import 'node:http';
 import 'jest-image-snapshot';
-import '../../image-diff-Dg_Di4zv.mjs';
+import '../../image-diff-DeB-XSUP.mjs';
 import '../../get-screenshot-paths-BhXNedbs.mjs';
 
 

package/dist/api/server/routes.d.ts

@@ -2,12 +2,12 @@ import { appRouter } from '../../trpc/router.js';
 import '@material-ui/core';
 import 'playwright';
 import 'ts-to-json';
-import '../../request-CyuY6GGO.js';
+import '../../request-B60Gnj7P.js';
 import 'zod';
 import '@trpc/server';
 import 'node:http';
 import 'jest-image-snapshot';
-import '../../image-diff-BSb7XwJb.js';
+import '../../image-diff-DwK_Ui8E.js';
 import '../../get-screenshot-paths-BhXNedbs.js';