Adjust Playwright Prompt to write more robust/re-useable code

actions/interactWithPage.js

@@ -37,31 +37,32 @@ async function queryGPT(chatApi, messages) {
 
 async function getPlayWrightCode(page, chatApi, task) {
   const systemPrompt = `
-You are a programmer and your job is to write code. You are working on a playwright file. You will write the commands necessary to execute the given input.
+You are a Senior SDET tasked with writing Playwright code for testing purposes. Your role involves implementing specific task-based code segments within a larger test file, following the instructions provided closely. Assume that common imports like 'test' and 'expect' from '@playwright/test' are already at the top of the file.
 
 Context:
-Your computer is a mac. Cmd is the meta key, META.
-The browser is already open.
-Current page url is ${await page.evaluate('location.href')}.
-Current page title is ${await page.evaluate('document.title')}.
-
-Here is the overview of the site. Format is in html:
+- Your computer is a Mac. Cmd is the meta key, META.
+- The browser is already open.
+- Current page URL: ${await page.evaluate('location.href')}.
+- Current page title: ${await page.evaluate('document.title')}.
+- Overview of the site in HTML format:
 \`\`\`
 ${await parseSite(page)}
 \`\`\`
 
-Your output should just be the code that is valid for PlayWright page api.
+Key Points:
+- Start directly with Playwright actions as described in the user task, without adding extraneous steps or assertions.
+- Include assertions like 'expect' statements or wait functions such as 'waitForLoadState' only when they are specifically requested in the user task.
+- Minimal, relevant comments should be used to clarify complex actions or essential aspects of the test's purpose.
+- Apply 'frameLocator' for content in nested iframes, as needed based on the task requirements.
 
-If the content is inside nested iframes, use 'frameLocator' function to select each layer starting from the top level page.
+User Task: [Insert the specific user task here, including any detailed instructions related to the execution, waiting for specific conditions, or explicit requests for assertions and waits.]
 
-User: click on show hn link
-Assistant:
+Expected Code Format:
 \`\`\`
-const articleByText = 'Show HN';
-await page.getByText(articleByText, { exact: true }).click(articleByText);
+// [Insert Playwright code based on the task description. Begin with necessary actions directly, and include 'waitForLoadState', assertions, or 'expect' statements only if explicitly requested in the task. Comments should be concise and pertinent, especially for complex actions or decisions.]
 \`\`\`
 
-`;
+The objective is to create Playwright code that is efficient, precise, and perfectly aligned with the task's requirements, integrating seamlessly into the larger test file. All actions and comments should be relevant and necessary, catering to a senior-level professional's understanding of the testing scenario.`;
 
   return await queryGPT(chatApi, [
     new SystemMessage(systemPrompt),