Javascript button click not working in selenium webdriver - javascript

I am trying to automate hitting a javscript button using a python script and web driver however no matter how I try to refer to the element it doesn't seem to activate the javscript. Here's an excerpt from the website I am trying to hit the button on:
<li>
<a href="javascript:;" data-blogid="19079" id="picture-trigger">
<i class="glyphicon glyphicon-picture light-red"></i >
<span> Picture </span >
</a >
</li >
I've tried selecting by CSS selector, by XPATH and while I see the element being selected (doted line around it when running), nothing happens.
I've also tried both .click() and .submit() neither one seems to work. Here's my most recent attempt:
element = mydriver.find_element_by_id("picture-trigger")
element.click()
I think perhaps the issue is the javascript:; isn't being triggered when called from web driver the same way it is when an interactive user hits it but I'm at a loss for how else to automate clicking it.
Does anyone with more web driver experience know why this isn't working or how I can get this working?
Thanks
Brad
Here's what I see when I run the code:
Here's what it looks like when I manually click on the button:

I think the issue lies in the fact that the site is using jquery. I was able to work around this using the following:
time.sleep(3);
mydriver.execute_script("$('.light-red').click();")
time.sleep(3);
mydriver.execute_script("$('.uploadbutton').click();")
There may be a better way than using time.sleep but I spent so much time fighting with trying to get the div to unhide that its good enough for now.
Hopefully this helps someone else out in a similar situation. Thanks to everyone for all the help.

Here is how I find my way to click on an element using XPath:
Browse in the target page where the button is located(Tried with
FireFox).
Right click on the button and select Inspect elements.
Right click on the HTML code of the button and in Copy select XPath.
Now you have the XPath copied to your clipboard.
Now you just have to call this line:
document.getElementByXPath("PASTE THE XPATH HERE").click()

Related

Having issues executing multiple javascript lines in chrome console

I have been trying to do some manipulation on webpages using JavaScript. So I started with the basic Google page(https://google.com).
I ran the command
document.getElementById('lst-ib').value = 'search_term';
Then after that tried running
document.getElementsByName('btnI')[0].click();
which is the I'm feeling Lucky button.
It is showing undefined on doing so.
But when I try only click on the I'm Feeling Lucky button without changing the content of the search bar, it works.
The target is to click the Search Button, it is also not working.
So I used the I'm Feeling Lucky button for testing to see if anything can be clicked.
The Same is happening in YouTube search bar as well
Any help or guidance would be much appreciated.
Also please note that I am N00b and trying to learn as I go :(
TLDR; The Idea is to simulate all the operation a user can do on the browsers using JavaScript.
document.getElementById('lst-ib').value = 'search_term';
document.getElementById('tsf').submit();
(or document.querySelector("form").submit();)
I'm not entirely sure what you're trying to achieve, but did you consider just using the queryparams? google.com?search=search_term ?
I found this ID simply by going to google.com, rightclicking on the input field, choose 'inspect element' and search for the first ancestor that is a 'form'.

Nodejs nightmare library button click

Hello im trying to click button with nightmare library but that button has not any name so im litte confused.There button(first one is too important to me right now),
<button aria-disabled="false" type="button" class="container_t8ohbe-o_O-container_rounded_tid9r1-o_O-container_notBlock_qxxhsy-o_O-container_sizeRegular_9l8x45-o_O-container_1ekx8mc" data-reactid="28"><span class="text_1rqeqtn-o_O-text_sizeRegular_1purd5i-o_O-text_uw47i3" data-reactid="29"><span data-reactid="30">Accept</span></span></button>
and this one,
<button type="button" class="btn btn-primary btn-large btn-block"><span>Start</span></button>
Even i did try something like that(doesn't matter how ridiculous is) but not worked.
.click('class="container_t8ohbe-o_O-container_rounded_tid9r1-o_O-container_notBlock_qxxhsy-o_O-container_sizeRegular_9l8x45-o_O-container_1ekx8mc"')
Really want to learn nightmare library but examples are soo few and most of it just include exact same examples.How i can click this button can anyone help ? Also if anyone can provide detailed tutorials about click/type on different examples i am willing to read.
You can use the css path to click the button as long as it is unique to that button. What I like to do is go to developer tools and right click the element then select copy selector like this
Of course make sure to test it with jquery in the console $('css_selector') and see if it returns the element you want to click on.
Here's a snippet from one of my nightmarejs projects
nightmare
.goto('https://home.cunyfirst.cuny.edu/oam/Portal_Login1.html')
.insert('#cf-login', user)
.insert('#password', pass)
.click('#login-form > form > input[type="image"]')
I also had this issue once where the clicking wasn't working, but this library helped me fix that maybe it helps you to. It simulates a real mouse click , I'm not sure what that even means, but it works.
Also this is incorrect:
.click('class="container_t8ohbe-o_O-container_rounded_tid9r1-o_O-container_notBlock_qxxhsy-o_O-container_sizeRegular_9l8x45-o_O-container_1ekx8mc"')
You can test to see if you have a proper selector for the .click() by putting in the console like I said earlier heres an example of that:
I hope this advice helps you!

jQuery, Ajax and iOS Issues

Has anyone ever experienced any specific problems relating to the use of jQuery, Ajax events and iOS?
I'm working as a web analyst and on our site we are having issues with iOS in the checkout, we are using jQuery and Ajax events to handle the shopping basket in the background, carry the product information from page to page etc and I'm just taking a stab in the dark because I'm pretty sure it's not the html or css that is causing the issue.
The continue buttons that take you to the next page in the checkout use this href:
Continue
From a little research I found out that a # href just takes the scroll position back to the top, and this does occur on iOS, the html seems to be working, but then the jQuery is supposed to kick in when it detects a click of a href with this class, but it doesn't, scroll position goes back to the top and then nothing happens.
Look I know it's really difficult to make any suggestions without seeing any code, I'm just taking a stab here in the hope someone might go "Oh yeah it could be this".
Try changing href="#" with href="javascript:void(0);"
Add event binding code inside document ready function like this
$(document).ready(function(){
//Event binding code
});

Selenium clicking button with no name or id

I've been struggling with trying to automate this page. After I login, I'm at this page where I'm supposed to click a button before I redirects me to the next page. The problem is that this button does not have a name or an ID which is making it very difficult to find this element. I've tried mechanize and splinter both. And finally tried selenium but that didn't help either. Really struggling with this. Just need to click this damn button! Any help would be really really appreciated. Love python and automation, but this time nothing seems to be working for me. Please find below a snapshot showing the the code shown when I click on "inspect element". Also, I can't type here the page source code as it is >300000 characters, so you can probably take a look at the page (you'll need to login which takes just 10 seconds). The page I'm referring to is right after you login - http://www.160by2.com/Index
[!Snapshot showing the code I get when I click "inspect element"
[]1
There is class name:
driver.findElement(By.className("da-sms-btn").
Also you can open application in Chrome and copy CSS or XPATH in browser:
Open application in Chrome
Inspect element
Right click on highlighted area
Copy CSS or XPATH
You can try first getting the form by the id, then getting the button by the class name:
wd.find_element_by_id("frmDashboard").find_element_by_class_name("da-sms-btn").click()
You can try to find the element through its xpath. Selenium does a good job of this:
webdriver.find_element_by_xpath("element xpath").click()
You can easily find the xpath by going to the inspect element sidebar on Chrome and right clicking on the element you want. The right click drop down menu should have an option "copy xpath".
I would write a cssSelector as follows and try that.
button[onclick*='aSMS']
Notice, I am doing a partial search with *
Thank you so much for your replies! I was actually able to make it work using splinter instead of selenium! Here's what I did-
1) I just executed the js which was being executed on the onclick event of the button.
jsstring="window.parent.openPage('SendSMS?id="+id+"', 'aSendSMS', 'aSMS', 'ulSMS')"
br.execute_script(jsstring)
2) Subsequently, I was faced with the problem that on the next page, everything was embedded inside iframe, and so find_by_name and all were not able to find elements. For that, splinter provides a nice method (Which is documented REALLY bad, so had to figure it out myself with help from stackoverflow)
with br.get_iframe('iframe_Name') as iframe:
iframe.fill("Element_to_fill_Name","Text_to_fill")
iframe.find_by_tag("TagName")[Index_number].fill("Text_To_Fill")
Worked out brilliantly! Thanks everyone :)

How can I figure out the function/programming behind the toggle navigation in the Dashgum Bootstrap Theme?

I'm making a system using the Dashgum Free Bootstrap theme.
I have it locally but I can't find any programming behind the toggle navigation function, and I need to take a look at it. I'd guess javascript but there's no id related to the element, and even when you delete all attributes, as long as you don't delete the div and there's something inside it (like something written ) it still works.
What kind of sorcery is this? I need to see the code behind scenes!
You can check the code by inspecting the navigation element in the link above. I pasted my own here too, but I don't think it helps, does it? I can't share the system I'm making :(
<div class="sidebar-toggle-box col-lg-2 z-padding">
<div class="fa fa-bars tooltips " data-placement="right" data-original-title="Encolher/Expandir Menu"></div>
<b>eCategory</b>
</div>
Thank you very much.
You could try to inspect the element with Google Chrome. Press F12 then click on the magnifier, position on the element. On the side menu you are going to find Event Listeners, it means all events attached to that element.
You might be able to find the function that runs on click this way.
You can also look in the code for code selecting the element (i.e. ".sidebar-toggle-box").

Categories