Selenium: Unable to click on menu item - selenium

I'm not able to click on the menu item (Create Defect...) as shown in the figure while testing my webapplication and getting below error
**org.openqa.selenium.ElementNotVisibleException: Cannot click on element**
the below code clicks on the image (hand image) as shown in the figure
driver.findElement(By.xpath("//div[#id='divToolbar']/div/table/tbody/tr/td[2]")).click();
and then the menu opens. Now I would like to click on the menu item.
I'm using below code for this
driver.findElement(By.xpath("html/body/div[10]/div/div/div/div/div/ul/li[1]")).click();
but I got the above mentioned exception
This what I have in the html:
<div class="mmenu" style="display: block; left: 49px; top: 37px;">
<div class="mmenu-content">
<div class="mmenu-border" style="width: 231px;">
<div class="mmenu-inset" style="width: 231px;">
<div class="mmenu-group first-child last-child">
<div class="mmenu-column first-child last-child">
<h3>
<ul>
<li id="liemx360120335239.81635" class="link" menuuid="emx360120335239.81635">
<span class="icon">
<span>Create Defect...</span>
</li>
<li id="liemx172704021676.66638" class="link" menuuid="emx172704021676.66638">
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
Can you please suggest?

have you tried driver.findElement(By.xpath("//span[contains(text(),'Create Defect...']")).click();

I think your problem is that the second menu is invisible, and WebDriver throws ElementNotVisibleException if he operates on a locator which is not visible.
I think you have to keep the first menu open, as the second one to be visible when you try to click it.
I use Actions class.
Try to do following :
new Actions(getWebDriver()).moveToElement(driver.findElement(By.xpath(...))).perform();
and right after try to click the second locator. If you still have problem, try to chain both commands in the same action.

Related

Use VB script to automate click(expanding) plus sign within internet explorer

Using a VB script (via Excel), I am working on automating some data entry into an IE web page. I have successfully been able to use ".getElementById("WhateverID").Click" in most instances. However, there is a plus sign button that has not been responding to the Click command. Here is what the button ("btnAddAction") looks like:
Add Action
Upon clicking the Add Action button, two new buttons appear ("btnSaveAction" and "btnCancelAction"):
Save Action & Cancel Action
Any suggestions on how to get this Add Action button to respond with this code:
objIE.document.getElementById("btnAddAction").Click
Here is the web inspection code:
<section class="placement-update" id="DecisionUpdate">
<div style="display: block;">
<nav class="navbar navheading blueBar">
<h5 class="heading"> Decision Update</h5>
<div class="ml-auto crd_save">
<img tabindex="-32768" class="pointer" id="btnSaveAction" style="display: inline;" src="/images/save.svg">
</div>
<div class="edit">
<img tabindex="-32768" class="pointer" id="btnAddAction" style="display: none;" src="/images/add.svg">
<img tabindex="-32768" class="pointer" id="btnCancelAction" style="display: inline;" src="/images/cancel.svg">
</div>
</nav>

Vue - Nested Click Event Bubbling Issue

I have a menu button with a click event in Vue. When the button is clicked, it's supposed to activate the menu itself. This is the parent element which when clicked activates the menu (the toggleMenu function makes menuIsActive true). This part works fine:
<div class="navbar-item has-dropdown #click="toggleMenu">
<div class="navbar-link"></div>
<app-navmenu :class="{'is-active': menuIsActive}"/>
</div>
And this is the app-navmenu component that gets rendered:
<div class="navbar-dropdown" #click.stop>
<div class="container is-fluid">
<div class="column">
<h1 class="title">Title</h1>
<router-link class="navbar-item" :to="route" exact>
<div class="navbar-content">
<p class="has-text-info">info</p>
<small>meta info</small>
</div>
</router-link>
</div>
</div>
</div>
The problem I am running into is that I don't want the menu to disappear when I click on the actual navbar-dropdown div element, hence why I have a #click.stop. However, I do want the menu to disappear when I click on a router-link element, but since I have #click.stop in the navbar-dropdown element, the menu persists. If I don't have a #click.stop event on the navbar-dropdown element, then the menu disappears as soon as the navbar-dropdown element is clicked on, which I don't want.
How can I have the menu persist when clicking on the dropdown body, but also have it disappear when I click on a router-link? I've tried other click methods like .self and .prevent, but those don't seem to do what I need.
I am exactly not sure with your requirement, but following your comment, you can use something like this:
This will even push to the router link:
<router-link class="navbar-item" :to="route" exact
#click.native.prevent="callYourMethod">
This will prevent to go to the router link:
<router-link class="navbar-item" :to="route" exact
#click.native.prevent="callYourMethod" event="">
This is what I ended up doing to fix my issue. First, I moved the click function in the parent to one of its children:
<div class="navbar-item has-dropdown">
<div class="navbar-link" #click="toggleMenu"></div>
<app-navmenu :class="{'is-active': menuIsActive}"/>
</div>
This lets the body of the menu stay active even when I click on the body without having to use a #click.stop. Then in the menu itself, I did this so that links will close the menu:
<div class="navbar-dropdown" #click.stop>
<div class="container is-fluid">
<div class="column">
<h1 class="title">Title</h1>
<div #click="toggleMenu">
<router-link class="navbar-item" :to="route" exact>
<div class="navbar-content">
<p class="has-text-info">info</p>
<small>meta info</small>
</div>
</router-link>
</div>
</div>
</div>
</div>
One strange behavior I noticed is that if I put the #click="toggleMenu" function in the <router-link/> element itself, it doesn't get called on, even if I use .prevent. Hence the need for the div wrapper around the router-link element.

Selenium webdriver: clicking not working for xpath

I'm trying to get the webdriver to click on the text "Breaking Things" through xpath/css selectors to no avail. Here is the HTML
<div class="org-option" ng-repeat="Org in Organizations" aria-label="Select Breaking Things Organization" ng-click="Org.SelectOrg()" role="button" tabindex="0">
<div class="data">
<div class="data-relative">
<!---->
<div class="image-wrapper" ng-show="Org.HasImage" ng-if="Org.HasImage" aria-hidden="false">
<img class="onboard-logo" ng-src="/apiimage/organizations/f1544944fac34442998a05890c400338-0" src="/apiimage/organizations/f1544944fac34442998a05890c400338-0">
</div>
<!---->
<div class="image-wrapper ng-hide" ng-show="!Org.HasImage" aria-hidden="true">
<div class="image-placeholder">
<div class="center-icon gicon-panorama"></div>
</div>
</div>
<div class="name-wrapper">
<div>Breaking Things</div>
Here is what I'm doing with the driver:
chromeDriver.findElement(By.xpath("//div[#class='name wrapper']//[text()='Breaking Things']")).click();
However it never clicks, what am I missing? I've also tried implicit waits etc with no results.
You should specify exact node name div or wild-card for "any node" - * in this part
//[text()='Breaking Things']
like below:
"//div[#class='name-wrapper']//div[text()='Breaking Things']"
or
"//div[#class='name-wrapper']//*[text()='Breaking Things']"
The class name is name-wrapper. The - is important
chromeDriver.findElement(By.xpath("//div[#class='name-wrapper']//[text()='Breaking Things']")).click();
In #class='name wrapper' you are actually telling the driver to look for an WebElement with two classes, name and wrapper.

Click dynamic div of menubar which is loaded via jquery

Im using Selenium 2.44 library with IE 9 browser
The menubar is loaded dynamically via js.I tried to locate the element via findElement - used Xpath. It ends up in throwing nosuchElement exception. below is snippet of Dom element
<html><body class="page">
<div id="dynamicMenu" style="display: block;">
<ul class="sf-menu sf-js-enabled sf-shadow">
<li sequence="7">
<a class="sf-with-ul" href="UserContentStart.aspx?category=17">Type
<span class="sf-sub-indicator"> »</span></a>
<ul style="display: none; visibility: hidden;">
<li sequence="0">
Brochure
</li>
<li sequence="1">
Direct mail
</li>
<li sequence="2">
E-mail
</li>
<li sequence="3">
Flyer
</li>
<li sequence="4">
Poster
</li>
<li sequence="5">
Presentation
</li>
<li sequence="6">
Letter
</li>
</ul>
</li>
</ul>
</div>
</body></html>
Do I need to execute the javascript before finding the element.
I dont have access to source code.All I inspect is via DOM element source from F12 dev tool.
Thanks !
//li[#sequence='5']/a should work for you. And, before that you have to make sure the element is visible.
Below Code will find the 5th element and will wait untill it gets visible for 20 sec .
Once its visible it will click the element.
In your case 5th element is the link to 'Presentation' which is in 'a' tag.
WebDriverWait Test = new WebDriverWait(driver, 10);
WebElement Fifth_Link = Test.until(ExpectedConditions.elementToBeClickable(By.xpath("//a[contains(text(),'Presentation')]")));
Fifth_Link.click();
Let me know if it does not works.

Click on button without id

How click button in webdriver without any id, values. Class of button is changing dynamically.
Sample:
<div class="d-k-l d-y-r-c g-h-f-Ck b-Qb" role="button" style="-moz-user-select: none;" tabindex="0" aria-haspopup="true">
<div class="d-k-l d-y-r-c-ha">
Мои круги
</div>
<div class="d-k-l d-y-r-c-Qa"></div>
</div>
Thx.
Show more HTML please. So that we can find something useful in the context.
Currently the only possible way is to use XPath' text()
.//*[#role='button']/*[contains(text(), 'Мои круги')]
If you are sure relevant elements are div, you can use
.//div[#role='button']/div[contains(text(), 'Мои круги')]