Selenium: sendKeys() method doesn't insert text to React-Select input

[matijalucman]

Meta

OS: Windows 10

Selenium Version: 3.5.3

Browser: Internet Explorer

Description

Hello to everyone!

We are having problem with insertion of text using sendKeys() method to React-Select input element since IEDriverServer 3.4.0 version. With version 3.3.0 all works normal, but with all newer versions of IEDriverServer, text is not inserted to input element of React-Select element (first select element on demo page: http://jedwatson.github.io/react-select/). Also, this issue exists only if nativeEvents capability is set to false (we are forced to run tests on that way).

Browser Version: Internet Explorer 11.1358.14393.0
IEDriverServer Version: 3.4.0 and newer.

Expected Behavior

Text is inserted to select input element using sendKeys() method.

Actual Behavior

Text is not inserted to select input element using sendKeys() method.

Steps to reproduce

Demo page: http://jedwatson.github.io/react-select/ - issue can be reproduced on first select element ("States" select) on demo page.

Steps to reproduce:

1. Run attached script with IEDriverServer version: 3.3.0 - option "Tasmania" will be selected from select element

2. Run attached script with IEDriverServer version: 3.4.0 or newer - option "Tasmania" will not be selected from select element because text is not inserted in select filter

Reproduction script:

            DesiredCapabilities capabilities = new DesiredCapabilities();
            JSONObject jsonCapabilities = new JSONObject();

            jsonCapabilities.put("nativeEvents", false);
            capabilities.setCapability("se:ieOptions", jsonCapabilities);

            WebDriver driver = new InternetExplorerDriver(capabilities);

            driver.get("http://jedwatson.github.io/react-select/");

            WebElement select = driver.findElement(By.cssSelector(".section .Select"));

            WebElement selectInput = select.findElement(By.cssSelector(".Select-input > input"));

            selectInput.sendKeys("Tasmania");

            WebElement selectOption = select.findElement(By.cssSelector(".Select-option"));

            selectOption.click();

            driver.quit();

[barancev]

Please retest with Selenium 3.6 and IEDriverServer 3.6, it works for me on the provides scenario.

[matijalucman]

I have updated Selenium and IEDriverServer to version 3.6 and set capabilities through InternetExplorerOptions object because constructor which gets DesiredCapabilities as parameter become deprecated (updated code attached), but issue still exists for me. I also tried to execute the same script on remote machine with Windows Server 2012 through Selenium Grid and it also doesn't work as intended. Video with shown difference of executing this code with different version on IEDriverServer is attached.
Thank you for help!

        InternetExplorerOptions options = new InternetExplorerOptions();
        JSONObject jsonCapabilities = new JSONObject();

        jsonCapabilities.put("nativeEvents", false);
        options.setCapability("se:ieOptions", jsonCapabilities);

        WebDriver driver = new InternetExplorerDriver(options);

        driver.get("http://jedwatson.github.io/react-select/");

        WebElement select = driver.findElement(By.cssSelector(".section .Select"));

        WebElement selectInput = select.findElement(By.cssSelector(".Select-input > input"));

        selectInput.sendKeys("Tasmania");

        WebElement selectOption = select.findElement(By.cssSelector(".Select-option"));

        selectOption.click();

        driver.quit();

Video

[barancev]

@jimevans Can you please look at this issue? I can't reproduce it.

[PhilippSelenium]

Have you tried getting focus on the element by clicking on it before using send_keys?

[matijalucman]

Yes, I am. Unfortunately issue still exists. I have also tried to focus element using javascript method element.focus();, writing text to input using Actions API, writing text using javascript method element.setAttribute('value', 'text'), but nothing helps.

[matijalucman]

This is not bug, it's my fault so i'm closing issue.

Setting capabilities through JSON object and se:ieOptions capability was introduced in 3.3.0.1 version of IEDriversServer, in test case I was using 3.3.0.0 version which uses old way of capability setting. So native events were turned on when I was testing with 3.3.0.0 version of driver. Because that, test case was working. If native capabilities are turned off, this test case doesn't work with any version of IE driver.
Hereby, this is not problem in IEDriver, but with reactjs itself: Issues.

I apologies for inconvenience and for vain loss of your time.