Picking options from Plasmic selectbox in e2e tests

I’m having issues using Select and Select.Option feather components in Capybara tests with Selenium.

I’m used to the Capybara goodness of

select "option_name", from: "select_name"

or the Cypress way


What I tried so far with Capybara:

def plasmic_select_value(aria_label, option_value)
  find("div[aria-label=\"#{aria_label}\"]", match: :first).click
  find("div[data-key=\"#{option_value}\"]", match: :first).click

What I tried so far with Cypress:

Cypress.Commands.add("selectFirstFromDropdown", { prevSubject: true }, (subject: Cypress.Chainable<undefined>) => {
    .then(($el) => {
      cy.window().then((win) => {
        (win.document.querySelector("[class*=\"PlasmicSelect__Option\"]") as HTMLElement).click();

Both solutions feel hacky and unstable in regards of that they have weird timing issues sometimes.

What is the idiomatic way to select an option from a Plasmic selectbox in an e2e test?

I found this: https://github.com/plasmicapp/plasmic/blob/d77514328c5ed3df3af84ff5c9f35f351fc1c276/packages/plume-stories/src/components/select/Select.spec.tsx#L21-L38

Is this the idea? Assign testid and then select via [role="listbox"]?

That is indeed a common approach to labeling elements