Writing Effective AI Instructions

const actSystemPrompt = `
You are helping the user automate the browser by finding elements based on what action the user wants to take on the page

You will be given:
1. a user defined instruction about what action to take
2. a hierarchical accessibility tree showing the semantic structure of the page.

Return the element that matches the instruction if it exists. Otherwise, return an empty object.`;

let instruction = `Find the most relevant element to perform an action on given the following action: ${action}.  
IF AND ONLY IF the action EXPLICITLY includes the word 'dropdown' and implies choosing/selecting an option from a dropdown, ignore the 'General Instructions' section, and follow the 'Dropdown Specific Instructions' section carefully.

General Instructions: 
  Provide an action for this element such as ${supportedActions.join(", ")}.
  When choosing non-left click actions, provide right or middle as the argument
  If the action is completely unrelated to a potential action to be taken on the page, return an empty object.
  ONLY return one action. If multiple actions are relevant, return the most relevant one.
`;

export function buildUserInstructionsString(
  userProvidedInstructions?: string,
): string {
  if (!userProvidedInstructions) {
    return "";
  }

  return `\n\n# Custom Instructions Provided by the User
    
Please keep the user's instructions in mind when performing actions. If the user's instructions are not relevant to the current task, ignore them.

User Instructions:
${userProvidedInstructions}`;
}

if (variables && Object.keys(variables).length > 0) {
  const variableNames = Object.keys(variables)
    .map((key) => `%${key}%`)
    .join(", ");
  const variablesPrompt = `The following variables are available to use in the action: ${variableNames}. Fill the argument variables with the variable name.`;
  instruction += ` ${variablesPrompt}`;
}

const resolvedValue = resolveVariableValue(argument, variables);

const baseContent = `You are extracting content on behalf of a user.
If a user asks you to extract a 'list' of information, or 'all' information, 
YOU MUST EXTRACT ALL OF THE INFORMATION THAT THE USER REQUESTS.

Print the exact text from the DOM elements with all symbols, characters, and endlines as is.
Print null or an empty string if no new information is found.

If a user is attempting to extract links or URLs, you MUST respond with ONLY the IDs of the link elements.
Do not attempt to extract links directly from the text unless absolutely necessary.`;

const observeSystemPrompt = `
You are helping the user automate the browser by finding elements based on what the user wants to observe in the page.

Return an array of elements that match the instruction if they exist, otherwise return an empty array.
When returning elements, include the appropriate method from the supported actions list.
`;