Not able to select element from a list

[mahmoudsameer1]

Error: locator.fill: Error: Element is not an <input>, <textarea> or [contenteditable] element
Call log:
  - waiting for locator('#elementsPerPageSelect')
  -   locator resolved to <select class="form-control" id="elementsPerPageSelect" …>…</select>
  - elementHandle.fill("20")
  -   waiting for element to be visible, enabled and editable
  -   Element is not an <input>, <textarea> or [contenteditable] element

[tatyana-avanade]

+1 Also having this issue, had to exclude selecting value from the drop down from instructions and specify each form field individually

[pramirezedicom]

This is because it does not have the selectOption action in createActions.ts, this could be extended with something similar to this:

....
locator_select_option: {
      function: async (args: { value: string; elementId: string }) => {
        await getLocator(args.elementId).selectOption({ value: args.value });

        return {
          success: true,
        };
      },
      name: "locator_select_option",
      description: "Selects option or options in `<select>`",
      parse: (args: string) => {
        return z
          .object({
            elementId: z.string(),
            value: z.string(),
          })
          .parse(JSON.parse(args));
      },
      parameters: {
        type: "object",
        properties: {
          value: {
            type: "string",
          },
          elementId: {
            type: "string",
          },
        },
      },
    },
....

Then you could make a call similar to this:

await auto(
    `Select the "xxxxx" value from the selector options`,
    { page, test },
    options
  );

You would also have to include option in sanitize sanitizeHtml.ts.

allowedTags: sanitize.defaults.allowedTags.concat([
      "button",
      "form",
      "img",
      "input",
      "select",
      "textarea",
      "option",
    ]),