Clicking outside an element does not work

Question

I am trying to select an element from a list that will update fields upon a clicking outside of the list. The below code works if I only have one event (see picture)

Actions action = new Actions(driver);
EventGrid.FindElement(By.XPath("//div[contains(.,'" + nameToBeClicked + "')]")).Click();
// Forces a click outside element to fire the triggers
EventGrid.FindElement(By.XPath("//html")).Click();

But will not work when I have two events (notice there are two events in the picture now, one new event and the other called buffet breakfast). I pass in the event name to the method which does click the buffet breakfast from the drop down however the click to html only works with the above picture but not the below. Any ideas how to get around this?

Html of the list:

<div id="boundlist-1193" class="x-boundlist x-boundlist-floating x-layer x-boundlist-default x-border-box" tabindex="-1" style="right: auto; left: 100px; top: 97px; height: auto; width: 150px; z-index: 29001;" data-selenium-id="EventGrid-EventClassificationName-list">
  <div id="boundlist-1193-listEl" class="x-boundlist-list-ct x-unselectable" style="overflow: auto; height: auto;" role="presentation">
    <ul class="x-list-plain">
      <li class="x-boundlist-item" unselectable="on" role="option">
        <div>Buffet Breakfast</div>
      </li>
      <li class="x-boundlist-item" unselectable="on" role="option">
        <div>NotMarkedAsPosted</div>
      </li>
      <li class="x-boundlist-item" unselectable="on" role="option">
        <div>Package Afternoon Break</div>
      </li>
      <li class="x-boundlist-item" unselectable="on" role="option">
        <div>Package Dinner</div>
      </li>
      <li class="x-boundlist-item" unselectable="on" role="option">
        <div>Package Lunch</div>
      </li>
      <li class="x-boundlist-item" unselectable="on" role="option">
        <div>Package Morning Break</div>
      </li>
      <li class="x-boundlist-item" unselectable="on" role="option">
        <div>Party Hard</div>
      </li>
      <li class="x-boundlist-item" unselectable="on" role="option">
        <div>Unassigned</div>
      </li>
    </ul>
  </div>
</div>

Looks like you're using Selenium ... have you tried different drivers? or verified that the html element exists within the EventGrid after the first click executes? Perhaps it is there beforehand and not afterward? Another thought ... might want to look into using WebDriverWait inbetween clicks. — Bret, Nov 03 '16 at 14:10
I think this link will solve your problem. http://stackoverflow.com/questions/40220377/how-to-click-on-new-div-which-newly-generates-after-clicking-on-a-button-in/40232966#40232966 — Turgut Kanceltik, Nov 03 '16 at 14:32
When clicking an element, Selenium clicks the center of the element. I would suggest that you click some known location like the Name field in the current line, etc. and see if that helps. — JeffC, Nov 03 '16 at 14:33
@turgat In theory that should work but there are times where we will be testing the same tests with different zooms of the page — Nicole Phillips, Nov 03 '16 at 14:36
@jeffc No luck with this either. I'm clicking all different types of web elements and it has no effect — Nicole Phillips, Nov 03 '16 at 14:42

score 1 · Answer 1 · answered Nov 03 '16 at 14:14

1

You can try to perform click by coordinates after you have selected your option.

action.MoveByOffset(x, y).Click().Perform();

answered Nov 03 '16 at 14:14

ievche

1,735
14
22

What coordinates do I use? – Nicole Phillips Nov 03 '16 at 14:18
You can try 200, 200 for start. – ievche Nov 03 '16 at 14:20
1

Check out the accepted answer here -http://stackoverflow.com/questions/25374013/selenium-click-on-coordinates-not-clicking-where-expected. Looks like it will show where exactly click is performed. – ievche Nov 03 '16 at 14:21
No luck with this – Nicole Phillips Nov 03 '16 at 14:34
Do you actually see where your click happens? – ievche Nov 03 '16 at 14:38
I cannot see anything at all no. I've tried clicking all over I will also run into problems if a user is using a different res which happens often – Nicole Phillips Nov 03 '16 at 14:46
My idea was that click on '//html' was clicking incorrect place, that's why I advised coordinates. Another issue that I can think of is that you have ambiguous match with xpath '//div[contains(.,'" + nameToBeClicked + "')]'. Can you check if it finds uniq element? – ievche Nov 03 '16 at 14:54

score 1 · Accepted Answer · answered Nov 03 '16 at 15:22

I have achieved the click by using the following code. It seems when there are multiple events the html tag falls off and becomes remote. Please review the code below. I also removed the string parameter as when I type the name it only one member of the list returns.

EventGrid.FindElement(By.XPath("//li/div")).Click();
RemoteWebElement element = (RemoteWebElement)driver.FindElement(By.XPath("//html"));
var scrollIt = element.LocationOnScreenOnceScrolledIntoView;
element.Click();

score 0 · Answer 3 · answered Nov 04 '16 at 08:17

From what I understand, Your objective is to get onfocusout event triggered. I had this issue and this solves my problem

driver.find_element_by_tag_name('body').send_keys(Keys.TAB)

what it does is sends tab key event to body,(you can use html as tag if you wish). I use this soution as it's the most prefered behaviour of the actual user.

score 0 · Answer 4 · answered Apr 13 '18 at 08:54

I found the easiest way is just to click something that has no interaction i.e. body attribute...this will always be there.

If you were wanting to mimic user behaviour for your test then you would click or tab to the next fields or user actionable element - but for the sake of just validating a field the below method would suffice.

    Class PageElements {
        public static By body = By.XPath("//body");
}

driver method:

driver.FindElement(PageElements.body).Click();

Clicking outside an element does not work

4 Answers4