fix: prompt should mention contents (#34746)

packages/web/src/components/prompts.ts

@@ -19,9 +19,18 @@ function stripAnsiEscapes(str: string): string {
   return str.replace(ansiRegex, '');
 }
 
+function enumerate(items: string[]) {
+  if (items.length === 0)
+    return '';
+  if (items.length === 1)
+    return items[0];
+  return items.slice(0, -1).join(', ') + ' and ' + items[items.length - 1];
+}
+
 export function fixTestPrompt(error: string, diff?: string, pageSnapshot?: string) {
+  const includedData = ['the error', diff && 'a code diff', pageSnapshot && 'a snapshot of the page'].filter((v): v is string => Boolean(v));
   const promptParts = [
-    `My Playwright test failed. What's going wrong?`,
+    `My Playwright test failed, what's going wrong? I've included ${enumerate(includedData)} below.`,
     `Please give me a suggestion how to fix it, and then explain what went wrong. Be very concise and apply Playwright best practices.`,
     `Don't include many headings in your output. Make sure what you're saying is correct, and take into account whether there might be a bug in the app.`,
     'Here is the error:',

tests/playwright-test/reporter-html.spec.ts

@@ -2706,7 +2706,10 @@ for (const useIntermediateMergeReport of [true, false] as const) {
         `,
         'example.spec.ts': `
           import { test, expect } from '@playwright/test';
-          test('sample', async ({}) => { expect(2).toBe(3); });
+          test('sample', async ({ page }) => {
+            await page.setContent('<button>Click me</button>');
+            expect(2).toBe(3);
+          });
         `,
       };
       const baseDir = await writeFiles(files);
@@ -2744,8 +2747,10 @@ for (const useIntermediateMergeReport of [true, false] as const) {
       await page.getByRole('link', { name: 'sample' }).click();
       await page.getByRole('button', { name: 'Fix with AI' }).click();
       const prompt = await page.evaluate(() => navigator.clipboard.readText());
+      expect(prompt, 'first line').toContain(`My Playwright test failed, what's going wrong? I've included the error, a code diff and a snapshot of the page below.`);
       expect(prompt, 'contains error').toContain('expect(received).toBe(expected)');
-      expect(prompt, 'contains diff').toContain(`+          test('sample', async ({}) => { expect(2).toBe(3); });`);
+      expect(prompt, 'contains snapshot').toContain('- button "Click me"');
+      expect(prompt, 'contains diff').toContain(`+            expect(2).toBe(3);`);
     });
   });
 }