Selenium ByChained, By.CssSelector, By.XPath, ByJQuery.ByJQuerySelector not working the way I'm expecting it to work

Question

I'm having trouble working out a specific selector. My NUnit test keeps failing when it reaches my selector. I'm looking for help in trying to make this correct. On with the example.

Given the following HTML code:

<div class="form-item required row" data-form-item-property="MyDataGrouping" data-form-item-id="view1_MyDataGrouping">
  <label class="form-label span2" for="view1_MyDataGrouping">
  <div class="form-value span3">
    <div class="radio">
      <input id="undefined" type="radio" data-property="MyDataGrouping" checked="checked" value="1" name="view1_MyDataGrouping">
      <label title="My Groups">My Groups</label>
    </div>
    <div class="radio">
      <input id="undefined" type="radio" data-property="MyDataGrouping" value="2" name="view1_MyDataGrouping">
      <label title="Default Groups">Default Groups</label>
    </div>
  </div>
</div>

I've created a class that is supposed to handle this style of radiobutton and checkbutton (It provides the selectors for the container, label and input. It also provides holds the text of the label.)

class RadioButton {
  public By ItemsContainer { get; set; }
  public By InputSelector 
  { 
     get 
     { 
        return new ByChained( LabelSelector, By.XPath("/../input")); 
     } 
  }
  public By LabelSelector 
  { 
    get 
    { 
      // put the single tick marks in to prevent an error with a null LabelText
      return new ByChained( ItemsContainer, 
      new ByJQuery.ByJQuerySelector("label:contains('" + LabelText + "')", true)); 
    } 
  }
  public String LabelText { get; set; }

  public RadioButton( By itemsContainer, string labelText )
  {
    ItemsContainer = itemsContainer;
    LabelText = labelText;
  }

  [Test]
  public void TestRadioButton() 
  {
    IWebDriver driver = new FirefoxDriver();
    RadioButton myRadio = new RadioButton( 
      By.CssSelector("div[data-form-item-property=MyDataGrouping]");

    // The following two lines work
    driver.FindElement(myRadio.ItemsContainer).Click();
    driver.FindElement(myRadio.LabelSelector).Click();

    // The next line does not work
    driver.FindElement(myRadio.InputSelector).Click();
  }

I've verified that Selenium can find the ItemsContainer selector and the LabelSelector without failing. However, it is having trouble with the InputSelector. LabelText is set to "My Groups" NUnit returns the following:

OpenQA.Selenium.NoSuchElementException : Cannot locate an element using By.Chained([By.Chained.CssSelector: div[data-form-item-property=MyDataGrouping].OpenQA.Selenium.By]),By.XPath: /../input])

Obviously, I would use the value attribute of the input element if I was guaranteed that number would always remain the same. But I'm not. So, I need to first identify the label, then XPath select the input (because I have to travel back up the tree).

Further attempts resulted in my changing the getter for InputSelector to:

public By InputSelector { get { return new ByChained(ItemsContainer, new ByJQuery.ByJQuerySelector(".radio:contains('"+LabelText+"')",true)); } }

While this didn't fail, it also didn't click the input element like I expected.

The equivalent SeIDE function that does work. click css=div[data-form-item-property=MyDataGrouping] div.radio:contains(My Groups) input

Any thoughts?

Answer 1

Okay, my note at the end about changing the InputSelector actually did work. I forgot to add "input" at the end of the selector text.

public By InputSelector 
{
  get
  {
    return new ByChained(
      ItemsContainer, 
      new ByJQuery.ByJQuerySelector(".radio:contains('"+LabelText+"') input",true)); 
  } 
}

However, I'm still curious to know why my first method failed. Any thoughts?