Selenium chaining CSS selector

Question

I've been trying to find element by chaining it with previous selector like this:

WebElement click = driver.findElement(By.cssSelector("td[data-container-for='NumberFrom'] input.k-formatted-value"));       
System.out.println(click.toString());

WebElement input1 = click.findElement(By.cssSelector(" ~ input"));
System.out.println(input1.toString());

But I'm getting:

An invalid or illegal selector was specified
Element info: {Using=css selector, value= ~ input}

When I'm using xpath instead of css, or single css selector everything works just fine:

WebElement input2 = click.findElement(By.xpath("//following-sibling::input"));
System.out.println(input2.toString());

WebElement input3 = driver.findElement(By.cssSelector("td[data-container-for='NumberFrom'] input.k-formatted-value ~ input"));
System.out.println(input3.toString());

My HTML is:

<td role="gridcell" data-container-for="NumberFrom">
  <span class="k-widget k-numerictextbox" style="">
    <span class="k-numeric-wrap k-state-default">
      <input class="k-formatted-value k-input" type="text" tabindex="0" style="display: inline;" title="" aria-disabled="false" aria-readonly="false">
      <input class="k-input" type="text" name="NumberFrom" data-role="numerictextbox" role="spinbutton" style="display: none;" aria-valuemin="1" aria-valuenow="" aria-disabled="false" aria-readonly="false" data-bind="value:NumberFrom">
    </span>
  </span>
</td>

Is there something wrong with my input1 selector?

I don't think Selenium supports relative selectors.

BoltClock
– BoltClock

2016-04-04 13:21:09 +00:00
Commented Apr 4, 2016 at 13:21 — BoltClock
– BoltClock, Commented Apr 4, 2016 at 13:21
It seems I will have to stick with XPath.

Angusiasty
– Angusiasty

2016-04-04 13:25:38 +00:00
Commented Apr 4, 2016 at 13:25 — Angusiasty
– Angusiasty, Commented Apr 4, 2016 at 13:25

alecxe · Accepted Answer · 2016-04-04 13:24:15Z

1

There is no way to reference the current node in a CSS selector in selenium.

Either stay with XPath and the sibling axis or use the full CSS selector.

answered Apr 4, 2016 at 13:24

alecxe

476k127 gold badges1.1k silver badges1.2k bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Drew · Accepted Answer · 2016-04-04 13:30:24Z

0

The following selector works for me using your HTML.

input.k-formatted-value ~ input

answered Apr 4, 2016 at 13:30

Drew

665 bronze badges

1 Comment

Angusiasty Over a year ago

Sorry, but this is unrelated to my question. You can't use your selector as a relative one.

Collectives™ on Stack Overflow

Selenium chaining CSS selector

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related