furqanZafar / react-selectize

http://furqanzafar.github.io/react-selectize/
Apache License 2.0
703 stars 138 forks source link

watir testing #95

Open renegade84 opened 8 years ago

renegade84 commented 8 years ago

I'm trying to help our testing team with some the automated testing scripts they are writing for our application. So far we have figured out how to click on an element in the dropdown when it appears (hover + mouseDown + mouseUp), but we are having a hard time actually sending text to the react-selectize input control. All that happens when we try to send it text is the dropdown pops up with 'No results found' but the cursor does not appear in the text input area. We have tried sending text to the element directly, sending text to the parent elements, clicking and then sending text, and firing an 'onFocus' event. Does anyone have any input on how this could be done with watir?

mLuby commented 7 years ago

Also interested in how this could be accomplished.

Update: was able to get it working in Nightwatch.js with the following:

    // open the dropdown
    .click(`.ourSimpleSelectContainer .react-selectize-control`)
    // wait for dropdown to open
    .waitForElementVisible(`.ourSimpleSelectContainer .open`, 1000)
    // send text to filter results
    .setValue(`.ourSimpleSelectContainer input`, [textWeWantToSend])
    // wait for a non-No Results option to appear
    .waitForElementVisible(`.ourSimpleSelectContainer .dropdown-menu > div:nth-child(1) .aCustomOptionRenderClass`, 1000)
    // click the 1st results option option
    .click(`.ourSimpleSelectContainer .dropdown-menu > div:nth-child(1)`)

where the SimpleSelect is wrapped and has a custom option render like so:

<div class="ourSimpleSelectContainer">
  <SimpleSelect renderOption={item => <div className={"aCustomOptionRenderClass"}>{item.value}</div>} />
</div>