Having issues executing multiple javascript lines in chrome console - javascript

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'.

Related

How do I make a Google Chrome bookmarklet that fills a spot in a URL?

So there's a website I have to frequently interact with. The interface is kind of a pain so I'm trying to figure out a way around that by just changing the URL to what I want to input. I think I've almost got it... although I'm not the best at Javascript and it's been a while.
Example:
www.examplewebsite.com/status/[spot I want to enter something]/blahblahblah/
What I've got so far is able to fill in the blank spot, but I'm not sure how to go about keeping the stuff that goes after it, cause it freaks the website out if it's gone.
Here's what I've got so far:
javascript:void(location.href='URL goes here'+window.prompt("enter search",""));
I tried
javascript:void(location.href='URL goes here'+window.prompt("enter search","")+href='URL continues here');
but that didn't work.
Try
javascript:void(location.href='URL goes here'+window.prompt("enter search","")+'URL continues here');
Consider a custom search engine instead of a bookmarklet.
Right-click the Chrome address bar and select "Edit search engines...".
In the "Other search engines" area, click "Add".
Give your "search engine" a name and an easy-to-type keyword, like pain.
The URL of your new search engine is www.examplewebsite.com/status/%s/blahblahblah/.
"Add" it.
Now you can type pain mysearchterm directly into the address bar and you'll be taken to www.examplewebsite.com/status/mysearchterm/blahblahblah/.

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 :)

jQuery.trigger("change") not work in PhantomJS

I'm writing an automatic testing tool. I use PhantomJS to make some action on a website. Currently, I have a problem like this: When I want to select an option from a select element, I use this sentence:
$(query).val(value);
$(query).trigger("change");
But it does not work. The website does not respond correctly. However, if I open the website by a browser and type that sentence in console, it work.
So I don't know what happen here. Have anybody meet this situation before? Can you recommend me some method to solve this.

Perl Using WWW::Mechanize to set a radio button that has no value

I have to say I am new to Perl, maybe made about 3 or 4 scripts so far, and I find Perl decently easy to understand and use.
Anyways, I have a problem with my current script. I have been stuck on this problem for a while and just can't seem to find a fix for it.
After traversing a certain website I come to a page that has me click between two radio buttons and hit a download button.
I need to get my script to select either button and hit download, but the source of the page does not give me a value to set the radio button to when using WWW::Mechanize.
Here is a little bit of the web page source.
<input type='radio' onclick="url('URL GOES HERE')">
That is pretty much it for the two buttons. I noticed that when I did choose one and looked at the source, the code changes to
<input type='radio' checked onclick="url('URL GOES HERE')">
Yet I can't have WWW::Mechanize set one automatically because I have no idea what to put in the value. I have tried on, checked, onclick, true, checked onclick, select, selected, but to no avail.
Here is the line of code that pertains to this
$mech->set_visible([radio => 'checked onclick']);
Any help would be appreciated, first time here as well.
I forgot to mention that I am working with a computer at work that has a lot of restrictions for now. So I can't get Firefox or Selenium Server on the computer.
Edit
I believe the problem that I might be having also is that this stuff might be in JavaScript. I don't have much knowledge in HTML but the source code looked like it was until I saw JavaScript somewhere in the heading? Anyways, I remembered that WWW::Mechanize doesn't really support JavaScript and so maybe this is the problem.
Thanks for the replies guys, I really appreciated it. But after a ton of digging around and careful inspection, my boss and I sort of realized that all the download links are very similar, and all I really need to do is make the script custom create the links to the downloads instead of going through the hassle of taversing multiple web pages. Wish I saw this sooner.
HTML::Form does not offer an API to activate unnamed radio buttons. You can read the distinguishing attribute by digging into the innards. This should work (mostly untested):
use WWW::Mechanize qw();
my $w = WWW::Mechanize->new;
$w->get('file:///tmp/so11767998.html');
for my $input (($w->forms)[0]->inputs) {
$input->check if q{url('URL GOES HERE')} eq $input->{onclick}
}
You need to find what's happens after you select your radio button in the browser GUI. There are two ways for this:
you can check url() Javascript subroutine
or you can record your browser request after you submit target form.
I recommend to use Firefox's HTTPFox extension for this. So you just select you input, start the session in HTTPFox and submit the form. Next you check what data was POSTed (or GETed) and just replicate same fields
in your Mechanize script. Something like:
$mech->submit_form(
form_name => "form_name",
fields => {
input1_name => "value1",
input2_name => "value2",
.....
},
);
I had this issue too , and resolved it by calling a Javascript to click Radio Button.
$mech->eval_in_page('document.getElementById("id_radiobutton").checked = true;');
This worked for me.

JQuery tool to show selected DOM elements in real time

I was recently on CodeSchool's website and took the JQueryAir course that features a web-based text editor that shows - in real time - what elements of the DOM are being selected as you write your JQuery code. It does this by highlighting the selected elements of the html page in light gray.
Does anyone know of text editor (or plugin) that can recreate that functionality? I'm mainly looking to use it for practice purposes. Or if you know of a website that would allow me to do they same thing, that would be great too.
Here is a screenshot to give you an idea of what I mean:
As the JQuery in the bottom panel changes, the html above is highlighted.
Any advice appreciated - thanks!
A simple way to do this (although perhaps not quite as dynamic as you would like) is to use FireBug's console (or similar in Chrome, IE9 etc.). After loading a page containing a jQuery reference in FireFox, go to FireBug's Console tab and paste this.
$("p").css("background-color", "gray");
Hit Enter. You can change the selector to see the results, though they will be additive until you refresh the page. Use the up arrow to bring back your most recent selector to edit.
EDIT: OK, this was before you added the screenshot showing the desired HTML source highlighting. Still, perhaps this method will come in handy at some point.

Categories