How can I consistently remove the default text from an input element with Selenium?

Question

I'm trying to use Selenium WebDriver to input text to a GWT input element that has default text, "Enter User ID". Here are a few ways I've tried to get this to work:

        searchField.click();
        if(!searchField.getAttribute("value").isEmpty()) {
            // clear field, if not already empty 
            searchField.clear();
        }
        if(!searchField.getAttribute("value").isEmpty()) {
            // if it still didn't clear, click away and click back
            externalLinksHeader.click();
            searchField.click();
        }

        searchField.sendKeys(username);

The strange thing is the above this only works some of the time. Sometimes, it ends up searching for "Enter User IDus", basically beginning to type "username" after the default text -- and not even finishing that.

Any other better, more reliable ways to clear out default text from a GWT element?

Edited to add: The HTML of the input element. Unfortunately, there's not much to see, thanks to the JS/GWT hotness. Here's the field when it's unselected:

<input type="text" class="gwt-TextBox empty" maxlength="40">

After I've clicked it and given it focus manually, the default text and the "empty" class are removed.

The JS to setDefaultText() gets called both onBlur() and onChange() if the change results in an empty text field. Guess that's why the searchField.clear() isn't helping.

I've also stepped through this method in debug mode, and in that case, it never works. When run normally, it works the majority of the time. I can't say why, though.

Can you post a copy of the HTML of the control, and is there any javascript that interacts with the control? — Arran, Jun 28 '12 at 19:58
Does the default text in the `input` come from a `placeholder` HTML5 attribute, or is there some kind of `onfocus` and `onblur` JavaScript? — Petr Janeček, Jun 28 '12 at 20:42

score 23 · Accepted Answer · edited May 23 '17 at 11:52

Okay, the script obviously kicks in when the clear() method clears the input and leaves it empty. The solutions it came up with are given below.

The naïve one, presses Backspace 10 times:
```
String b = Keys.BACK_SPACE.toString();
searchField.sendKeys(b+b+b+b+b+b+b+b+b+b + username);
```
(StringUtils.repeat() from Apache Commons Lang or Google Guava's Strings.repeat() may come in handy)

The nicer one using Ctrl+A, Delete:

String del = Keys.chord(Keys.CONTROL, "a") + Keys.DELETE; 
searchField.sendKeys(del + username);

Deleting the content of the input via JavaScript:

JavascriptExecutor js = (JavascriptExecutor)driver;
js.executeScript("arguments[0].value = '';", searchField);
searchField.sendKeys(username);

Setting the value of the input via JavaScript altogether:

JavascriptExecutor js = (JavascriptExecutor)driver;
js.executeScript("arguments[0].value = '" + username + "';", searchField);

Note that javascript might not always work, as shown here: Why can't I clear an input field with javascript?

Thanks very much for the ideas. I tried 2, which works the first time, but when I go back to search a second user, only deletes the last character of the first username. Very odd. With solution number 4, the "Find" button that must be clicked to search does not get activated, because there were no click or edit events. Solution number 3 works perfectly for me. Thanks! — mcole, Jul 05 '12 at 22:02
Huh. I thought the number 2 was a sure bet. Anyway, I'm glad it helped! — Petr Janeček, Jul 06 '12 at 17:22

salk31 · Answer 2 · 2013-02-05T14:00:57.240

For what it is worth I'm have a very similar issue. WebDriver 2.28.0 and FireFox 18.0.1

I'm also using GWT but can reproduce it with simple HTML/JS:

<html>
<body>
<div>
<h3>Box one</h3>
<input id="boxOne" type="text" onfocus="if (this.value == 'foo') this.value = '';" onblur="if (this.value == '') this.value = 'foo';"/>
</div>
<div>
<h3>Box two</h3>
<input id="boxTwo" type="text" />
</div>
</body>
</html>

This test fails most of the time:

@Test
public void testTextFocusBlurDirect() throws Exception {
  FirefoxDriver driver = new FirefoxDriver();

  driver.navigate().to(getClass().getResource("/TestTextFocusBlur.html"));

  for (int i = 0; i < 200; i++) {
      String magic = "test" + System.currentTimeMillis();
      driver.findElementById("boxOne").clear();
      Thread.sleep(100);
      driver.findElementById("boxOne").sendKeys(magic);
      Thread.sleep(100);
      driver.findElementById("boxTwo").clear();
      Thread.sleep(100);
      driver.findElementById("boxTwo").sendKeys("" + i);
      Thread.sleep(100);
      assertEquals(magic, driver.findElementById("boxOne").getAttribute("value"));
  }

  driver.quit();
}

It could just be the OS taking focus away from the browser in a way WebDriver can't control. We don't seem to get this issue on the CI server to maybe that is the case.

score 0 · Answer 3 · edited May 23 '17 at 11:52

0

I cannot add a comment yet, so I am putting it as an answer here. I want to inform you that if you want to use only javascript to clear and/or edit an input text field, then the javascript approach given by @slanec will not work. Here is an example: Why can't I clear an input field with javascript?

edited May 23 '17 at 11:52

Community

1
1

answered Aug 15 '16 at 01:16

MasterJoe

2,103
5
32
58

score 0 · Answer 4 · answered Dec 05 '17 at 18:19

In case you use c# then solution would be :

// provide some text
webElement.SendKeys("aa");
// this is how you use this in C# , VS
String b = Keys.Backspace.ToString();

// then provide back space few times 
webElement.SendKeys(b + b + b + b + b + b + b + b + b + b);

How can I consistently remove the default text from an input element with Selenium?

4 Answers4

Linked