feat: trigger general demo when git-glimpse config/workflow files change

DeDuckProject · claude · DeDuckProject · commit 6570f8a2e5f9 · 2026-03-14T16:01:20.000+02:00
When git-glimpse.config.* or .github/workflows/*glimpse*.yml changes,
the pipeline now runs a general app overview demo instead of skipping
due to no UI-relevant files. This works in all trigger modes (including
on-demand), solving the chicken-and-egg problem where first-time
integrators couldn't validate their setup without merging to main first.

Changes:
- trigger/index.ts: detect config/workflow file changes, set generalDemo flag
- pipeline.ts: skip UI-file guard when generalDemo, thread flag through
- generator/script-generator.ts: use general demo prompt when generalDemo
- generator/prompts.ts: add buildGeneralDemoPrompt for app overview tours
- action/src/index.ts: pass generalDemo from trigger decision to pipeline

Co-Authored-By: Claude Sonnet 4.6 &lt;noreply@anthropic.com&gt;
diff --git a/packages/action/dist/check.js b/packages/action/dist/check.js
@@ -53549,6 +53549,10 @@ function parseGlimpseCommand(commentBody, commandPrefix = "/glimpse") {
 }
 
 // ../core/dist/trigger/index.js
+var CONFIG_FILE_PATTERNS = [
+  /^git-glimpse\.config\.[jt]s$/,
+  /^\.github\/workflows\/.*glimpse.*\.ya?ml$/i
+];
 function evaluateTrigger(opts) {
   const { files, triggerConfig, eventType, command } = opts;
   if (command?.force) {
@@ -53568,6 +53572,16 @@ function evaluateTrigger(opts) {
       triggerSource: "comment"
     };
   }
+  const configFiles = files.filter((f) => CONFIG_FILE_PATTERNS.some((p) => p.test(f.path)));
+  if (configFiles.length > 0) {
+    return {
+      shouldRun: true,
+      reason: `git-glimpse configuration changed (${configFiles.map((f) => f.path).join(", ")}). Running a general app demo to validate the setup.`,
+      matchedFiles: configFiles.map((f) => f.path),
+      triggerSource: "auto",
+      generalDemo: true
+    };
+  }
   if (triggerConfig.mode === "on-demand") {
     return {
       shouldRun: false,
diff --git a/packages/action/dist/check.js.map b/packages/action/dist/check.js.map
diff --git a/packages/action/dist/index.js b/packages/action/dist/index.js
@@ -65396,6 +65396,41 @@ export async function demo(page: Page): Promise<void> {
   // your implementation
 }`;
 }
+function buildGeneralDemoPrompt(options) {
+  return `You are a Playwright script generator. Generate a TypeScript Playwright script that records a general overview demo of a web app \u2014 as if showing it to someone for the first time.
+
+## Goal
+Produce a short, visually engaging tour that demonstrates the app is running and shows its main UI. This is a setup-validation demo, not a feature showcase.
+
+## Rules
+- Navigate to the home page and 1-2 other meaningful routes if they exist
+- Scroll gently to reveal content, hover over key UI elements
+- Do NOT test anything \u2014 just demonstrate that the app loads and looks reasonable
+- Use resilient selectors: text content > ARIA roles > CSS classes
+- Act as a real user: only interact through the UI. Never re-implement app features in the script.
+- Do NOT inject code via \`page.evaluate\`, \`page.addInitScript\`, or inline scripts/styles
+- Always call \`await page.waitForLoadState('networkidle')\` after navigation
+
+## Timing
+- Total demo under ${options.maxDuration} seconds
+- Use \`await page.waitForTimeout(400)\` between actions \u2014 keep it brisk
+
+## Mouse movement
+- Move naturally before clicks: one intermediate \`page.mouse.move(x, y)\` waypoint is enough
+- Use plausible coordinates within the ${options.viewport.width}x${options.viewport.height} viewport
+
+## Context
+- Base URL: ${options.baseUrl}
+- Viewport: ${options.viewport.width}x${options.viewport.height}
+
+## Output format
+Respond with ONLY the TypeScript script, no markdown fences, no explanation:
+
+import type { Page } from '@playwright/test';
+
+export async function demo(page: Page): Promise<void> {
+}`;
+}
 function buildRetryPrompt(originalScript, errorMessage, screenshotDescription, options) {
   return `The following Playwright demo script failed with an error. Please fix it.
 
@@ -65442,7 +65477,7 @@ function stripMarkdownFences(script) {
 
 // ../core/dist/generator/script-generator.js
 var MAX_RETRIES = 2;
-async function generateDemoScript(client, analysis, rawDiff, baseUrl, config) {
+async function generateDemoScript(client, analysis, rawDiff, baseUrl, config, generalDemo = false) {
   const recording = config.recording ?? { viewport: { width: 1280, height: 720 }, maxDuration: 30, format: "gif", deviceScaleFactor: 2 };
   const llm = config.llm ?? { provider: "anthropic", model: "claude-sonnet-4-6" };
   const promptOptions = {
@@ -65456,7 +65491,7 @@ async function generateDemoScript(client, analysis, rawDiff, baseUrl, config) {
   const errors = [];
   let lastScript = "";
   for (let attempt = 1; attempt <= MAX_RETRIES + 1; attempt++) {
-    const prompt = attempt === 1 ? buildScriptGenerationPrompt(promptOptions) : buildRetryPrompt(lastScript, errors[errors.length - 1] ?? "", "", promptOptions);
+    const prompt = attempt === 1 ? generalDemo ? buildGeneralDemoPrompt({ baseUrl, maxDuration: recording.maxDuration, viewport: recording.viewport }) : buildScriptGenerationPrompt(promptOptions) : buildRetryPrompt(lastScript, errors[errors.length - 1] ?? "", "", promptOptions);
     const response = await client.messages.create({
       model: llm.model,
       max_tokens: 4096,
@@ -65767,7 +65802,7 @@ function sanitizeRoute(route) {
 
 // ../core/dist/pipeline.js
 async function runPipeline(options) {
-  const { diff, baseUrl, config } = options;
+  const { diff, baseUrl, config, generalDemo = false } = options;
   const outputDir = options.outputDir ?? "./recordings";
   const errors = [];
   const recording = config.recording ?? {
@@ -65779,20 +65814,22 @@ async function runPipeline(options) {
   };
   const llm = config.llm ?? { provider: "anthropic", model: "claude-sonnet-4-6" };
   const parsedDiff = parseDiff(diff);
-  const uiFiles = filterUIFiles(parsedDiff.files, config.trigger);
-  if (uiFiles.length === 0) {
-    return {
-      success: false,
-      script: "",
-      analysis: {
-        changedFiles: parsedDiff.files.map((f2) => f2.path),
-        affectedRoutes: [],
-        changeDescription: "No UI files changed.",
-        suggestedDemoFlow: ""
-      },
-      attempts: 0,
-      errors: ["No UI files detected in diff"]
-    };
+  if (!generalDemo) {
+    const uiFiles = filterUIFiles(parsedDiff.files, config.trigger);
+    if (uiFiles.length === 0) {
+      return {
+        success: false,
+        script: "",
+        analysis: {
+          changedFiles: parsedDiff.files.map((f2) => f2.path),
+          affectedRoutes: [],
+          changeDescription: "No UI files changed.",
+          suggestedDemoFlow: ""
+        },
+        attempts: 0,
+        errors: ["No UI files detected in diff"]
+      };
+    }
   }
   const routes = detectRoutes(parsedDiff, {
     routeMap: config.routeMap,
@@ -65803,7 +65840,7 @@ async function runPipeline(options) {
     throw new Error("ANTHROPIC_API_KEY environment variable is required");
   const client = new sdk_default({ apiKey });
   const analysis = await summarizeChanges(client, parsedDiff, routes, llm.model);
-  const { script, attempts, errors: genErrors } = await generateDemoScript(client, analysis, diff, baseUrl, config);
+  const { script, attempts, errors: genErrors } = await generateDemoScript(client, analysis, diff, baseUrl, config, generalDemo);
   errors.push(...genErrors);
   try {
     const recordingResult = await runScriptAndRecord({
@@ -70152,6 +70189,10 @@ function parseGlimpseCommand(commentBody, commandPrefix = "/glimpse") {
 }
 
 // ../core/dist/trigger/index.js
+var CONFIG_FILE_PATTERNS = [
+  /^git-glimpse\.config\.[jt]s$/,
+  /^\.github\/workflows\/.*glimpse.*\.ya?ml$/i
+];
 function evaluateTrigger(opts) {
   const { files, triggerConfig, eventType, command } = opts;
   if (command?.force) {
@@ -70171,6 +70212,16 @@ function evaluateTrigger(opts) {
       triggerSource: "comment"
     };
   }
+  const configFiles = files.filter((f2) => CONFIG_FILE_PATTERNS.some((p2) => p2.test(f2.path)));
+  if (configFiles.length > 0) {
+    return {
+      shouldRun: true,
+      reason: `git-glimpse configuration changed (${configFiles.map((f2) => f2.path).join(", ")}). Running a general app demo to validate the setup.`,
+      matchedFiles: configFiles.map((f2) => f2.path),
+      triggerSource: "auto",
+      generalDemo: true
+    };
+  }
   if (triggerConfig.mode === "on-demand") {
     return {
       shouldRun: false,
@@ -70341,7 +70392,7 @@ async function run() {
   }
   try {
     core.info("Running git-glimpse pipeline...");
-    const result = await runPipeline({ diff, baseUrl, outputDir: "./recordings", config });
+    const result = await runPipeline({ diff, baseUrl, outputDir: "./recordings", config, generalDemo: decision.generalDemo });
     if (result.errors.length > 0) {
       core.warning(`Pipeline completed with errors:
 ${result.errors.join("\n")}`);
diff --git a/packages/action/dist/index.js.map b/packages/action/dist/index.js.map
diff --git a/packages/action/src/index.ts b/packages/action/src/index.ts
@@ -175,7 +175,7 @@ async function run(): Promise<void> {
 
   try {
     core.info('Running git-glimpse pipeline...');
-    const result = await runPipeline({ diff, baseUrl, outputDir: './recordings', config });
+    const result = await runPipeline({ diff, baseUrl, outputDir: './recordings', config, generalDemo: decision.generalDemo });
 
     if (result.errors.length > 0) {
       core.warning(`Pipeline completed with errors:\n${result.errors.join('\n')}`);
diff --git a/packages/core/src/generator/prompts.ts b/packages/core/src/generator/prompts.ts
@@ -64,6 +64,42 @@ export async function demo(page: Page): Promise<void> {
 }`;
 }
 
+export function buildGeneralDemoPrompt(options: Pick<ScriptPromptOptions, 'baseUrl' | 'maxDuration' | 'viewport'>): string {
+  return `You are a Playwright script generator. Generate a TypeScript Playwright script that records a general overview demo of a web app — as if showing it to someone for the first time.
+
+## Goal
+Produce a short, visually engaging tour that demonstrates the app is running and shows its main UI. This is a setup-validation demo, not a feature showcase.
+
+## Rules
+- Navigate to the home page and 1-2 other meaningful routes if they exist
+- Scroll gently to reveal content, hover over key UI elements
+- Do NOT test anything — just demonstrate that the app loads and looks reasonable
+- Use resilient selectors: text content > ARIA roles > CSS classes
+- Act as a real user: only interact through the UI. Never re-implement app features in the script.
+- Do NOT inject code via \`page.evaluate\`, \`page.addInitScript\`, or inline scripts/styles
+- Always call \`await page.waitForLoadState('networkidle')\` after navigation
+
+## Timing
+- Total demo under ${options.maxDuration} seconds
+- Use \`await page.waitForTimeout(400)\` between actions — keep it brisk
+
+## Mouse movement
+- Move naturally before clicks: one intermediate \`page.mouse.move(x, y)\` waypoint is enough
+- Use plausible coordinates within the ${options.viewport.width}x${options.viewport.height} viewport
+
+## Context
+- Base URL: ${options.baseUrl}
+- Viewport: ${options.viewport.width}x${options.viewport.height}
+
+## Output format
+Respond with ONLY the TypeScript script, no markdown fences, no explanation:
+
+import type { Page } from '@playwright/test';
+
+export async function demo(page: Page): Promise<void> {
+}`;
+}
+
 export function buildRetryPrompt(
   originalScript: string,
   errorMessage: string,
diff --git a/packages/core/src/generator/script-generator.ts b/packages/core/src/generator/script-generator.ts
@@ -1,7 +1,7 @@
 import Anthropic from '@anthropic-ai/sdk';
 import type { ChangeAnalysis } from '../analyzer/change-summarizer.js';
 import type { GitGlimpseConfig } from '../config/schema.js';
-import { buildScriptGenerationPrompt, buildRetryPrompt, type ScriptPromptOptions } from './prompts.js';
+import { buildScriptGenerationPrompt, buildGeneralDemoPrompt, buildRetryPrompt, type ScriptPromptOptions } from './prompts.js';
 import { validateScript } from './validator.js';
 
 const MAX_RETRIES = 2;
@@ -17,7 +17,8 @@ export async function generateDemoScript(
   analysis: ChangeAnalysis,
   rawDiff: string,
   baseUrl: string,
-  config: GitGlimpseConfig
+  config: GitGlimpseConfig,
+  generalDemo = false
 ): Promise<ScriptGenerationResult> {
   const recording = config.recording ?? { viewport: { width: 1280, height: 720 }, maxDuration: 30, format: 'gif' as const, deviceScaleFactor: 2 };
   const llm = config.llm ?? { provider: 'anthropic' as const, model: 'claude-sonnet-4-6' };
@@ -37,7 +38,9 @@ export async function generateDemoScript(
   for (let attempt = 1; attempt <= MAX_RETRIES + 1; attempt++) {
     const prompt =
       attempt === 1
-        ? buildScriptGenerationPrompt(promptOptions)
+        ? (generalDemo
+            ? buildGeneralDemoPrompt({ baseUrl, maxDuration: recording.maxDuration, viewport: recording.viewport })
+            : buildScriptGenerationPrompt(promptOptions))
         : buildRetryPrompt(lastScript, errors[errors.length - 1] ?? '', '', promptOptions);
 
     const response = await client.messages.create({
diff --git a/packages/core/src/pipeline.ts b/packages/core/src/pipeline.ts
@@ -15,6 +15,8 @@ export interface PipelineOptions {
   baseUrl: string;
   outputDir?: string;
   config: GitGlimpseConfig;
+  /** When true, skip UI-file filtering and run a general app overview demo. */
+  generalDemo?: boolean;
 }
 
 export interface DemoResult {
@@ -33,7 +35,7 @@ export interface DemoResult {
 }
 
 export async function runPipeline(options: PipelineOptions): Promise<DemoResult> {
-  const { diff, baseUrl, config } = options;
+  const { diff, baseUrl, config, generalDemo = false } = options;
   const outputDir = options.outputDir ?? './recordings';
   const errors: string[] = [];
 
@@ -48,20 +50,23 @@ export async function runPipeline(options: PipelineOptions): Promise<DemoResult>
 
   // 1. Parse diff
   const parsedDiff = parseDiff(diff);
-  const uiFiles = filterUIFiles(parsedDiff.files, config.trigger);
-  if (uiFiles.length === 0) {
-    return {
-      success: false,
-      script: '',
-      analysis: {
-        changedFiles: parsedDiff.files.map((f) => f.path),
-        affectedRoutes: [],
-        changeDescription: 'No UI files changed.',
-        suggestedDemoFlow: '',
-      },
-      attempts: 0,
-      errors: ['No UI files detected in diff'],
-    };
+
+  if (!generalDemo) {
+    const uiFiles = filterUIFiles(parsedDiff.files, config.trigger);
+    if (uiFiles.length === 0) {
+      return {
+        success: false,
+        script: '',
+        analysis: {
+          changedFiles: parsedDiff.files.map((f) => f.path),
+          affectedRoutes: [],
+          changeDescription: 'No UI files changed.',
+          suggestedDemoFlow: '',
+        },
+        attempts: 0,
+        errors: ['No UI files detected in diff'],
+      };
+    }
   }
 
   // 2. Detect routes
@@ -84,7 +89,8 @@ export async function runPipeline(options: PipelineOptions): Promise<DemoResult>
     analysis,
     diff,
     baseUrl,
-    config
+    config,
+    generalDemo
   );
   errors.push(...genErrors);
 
diff --git a/packages/core/src/trigger/index.ts b/packages/core/src/trigger/index.ts
@@ -12,8 +12,16 @@ export interface TriggerDecision {
   reason: string;
   matchedFiles: string[];
   triggerSource: 'auto' | 'comment' | 'force';
+  /** True when triggered by a config/workflow file change — pipeline runs a general app demo. */
+  generalDemo?: boolean;
 }
 
+/** Files whose changes should always trigger a general demo run. */
+const CONFIG_FILE_PATTERNS = [
+  /^git-glimpse\.config\.[jt]s$/,
+  /^\.github\/workflows\/.*glimpse.*\.ya?ml$/i,
+];
+
 export interface EvaluateTriggerOptions {
   files: DiffFile[];
   triggerConfig: TriggerConfig;
@@ -50,6 +58,19 @@ export function evaluateTrigger(opts: EvaluateTriggerOptions): TriggerDecision {
     };
   }
 
+  // Config/workflow file changes always trigger a general demo, regardless of mode.
+  // This lets users validate their git-glimpse setup on a branch before merging.
+  const configFiles = files.filter((f) => CONFIG_FILE_PATTERNS.some((p) => p.test(f.path)));
+  if (configFiles.length > 0) {
+    return {
+      shouldRun: true,
+      reason: `git-glimpse configuration changed (${configFiles.map((f) => f.path).join(', ')}). Running a general app demo to validate the setup.`,
+      matchedFiles: configFiles.map((f) => f.path),
+      triggerSource: 'auto',
+      generalDemo: true,
+    };
+  }
+
   // Push event + on-demand mode: skip and wait for explicit trigger
   if (triggerConfig.mode === 'on-demand') {
     return {
