K6 Browser selectOption() Not Working for List Menu

Grafana k6 k6-browser
1

Hi K6 newbie here…

With K6 Browser, I’m trying to select an item from a menu list
//*[@id=“menu-state”]/div[3]/ul

The list contains whole bunch of items:
//[@id=“menu-state”]/div[3]/ul/li[1]
//[@id=“menu-state”]/div[3]/ul/li[2]
//[@id=“menu-state”]/div[3]/ul/li[3]
…
My code is like this:
const w = page.locator('//[@id=“menu-state”]/div[3]/ul’);
w.selectOption(‘Iowa’);

Got error:
Uncaught (in promise) GoError: selecting option on “//*[@id="menu-state"]/div[3]/ul”: read tcp 127.0.0.1:31281->127.0.0.1:31280: wsarecv: An existing connection was forcibly closed by the remote host.
default at github.com/grafana/xk6-browser/api.Locator.SelectOption-fm (native)

Meanwhile, if I click on the list to expand it, the locator becomes "//[@id="selectLabelId"]".
If I call page.locator(//[@id="selectLabelId"]).selectOption(‘Iows’), there is error:

Uncaught (in promise) GoError: selecting option on “//*[@id="selectLabelId"]”: strict mode violation, multiple elements returned for selector query

Any suggestions?
Thanks a lot,
-Madison

3

Ok. I made some progress. First, expand the menu list; Second, select a menu item.

//This solved “multiple elements return” issue:
page.locator(‘(//*[@id=“selectLabelId”])[2]’).click();

//This bypasses selectOption():
page.locator(‘//*[@id=“menu-state”]/div[3]/ul/li[1]’).click();

1 Like
4

Hi @madisonli, welcome to the forum! :wave:

Could you please post the full test script? Which version of k6 are you using?

5

Hi Daniel,
My k6 version:
k6 v0.45.0 (2023-06-19T08:41:01+0000/v0.45.0-0-gc3b4587b, go1.20.5, windows/amd64)

My original script was:
const w = page.locator(‘//*[@id=menu-state]/div[3]’);
w.selectOption(‘AK’);

It didn’t work.

Thanks,
-Madison

6

Could you post the full script @madisonli ? Does it reference a public site that we could also test?

In regards of the issue:

Uncaught (in promise) GoError: selecting option on “//*[@id="selectLabelId"]”: strict mode violation, multiple elements returned for selector query

As the error message says, Locator uses “strict mode”, which means that it only allows selectors that specify a single element. If you can not refine the selector to reference a single element, or if you want to select more than one element and then iterate through them, you can use the $$ query selector.