1

I've already read other posts and tried suggestions (eg Nightwatch Cannot Find/Click on Dropdown Option and Nightwatch to select option from select box) with no success.

It seems that regardless of what method I use to interact with a select box, nothing works on safari. The option I used for just chrome still works fine on chrome browser, but we're looking to get our safari integration tests up and running.

The option that works on chrome is:

.click('select[name="elementName"] option.OptionClass')

However this leaves the selector clicked on safari but no option selected, breaking our forms that require a selection.

I've tried clicking both in succession like

.click('select[name="elementName"]') 
.click(' option.OptionClass')

using keystrokes:

.click('select[name="elementName"]')
.keys(['\uE015', '\uE006'])

wrapping in perform calls:

browser.perform(function() {
  browser
    .click('select[id=element-id]')
    .click('option.className');
});

And about every combination in between I can think of.

Nothing on nightwatch issues, google groups, or here in stackoverflow has helped so far. Has anyone encountered this issue and has anyone figured out a solution?

Note: I've tried looking at a generic selenium way of doing this as well, and using the .execute('insert javascript to change value of select element') but that doesn't trigger the onchange event and the form doesn't submit anyways.

If I manually intercept the test locally and click on the select option after the automation has opened the select box it works fine, I just need a way to navigate to and or click the option after it's open.

I've sunk about 2-3 days of work into this, so any help is extremely appreciated. Thanks!

Brodrick
  • 43
  • 9

1 Answers1

2

What may work is to get visible text of the <option> you are looking for, and use it as a parameter for setValue(). This works fine for my Chrome browser:

browser
  .getText('select[name="elementName"] option.OptionClass', function(result) {
    client.setValue('select[name="elementName"]', result.value);
  })

Option 2:

You can also try to run JavaScript with execute() and set value programmatically, then fire change event on your select element:

var select = document.querySelector('select[name="elementName"]'),
    option = select.querySelector('option.OptionClass');

select.value = option.value;
select.dispatchEvent(new Event("change", { bubbles: true }));
akrn
  • 698
  • 4
  • 7
  • Option 1 worked for me on chrome, but again didn't work on safari unfotunately, but option 2 worked for both! Thanks so much, this had me stymied for the better part of a week. Cheers! – Brodrick Feb 13 '18 at 22:25