How to use vertical scrolling using robot frame work - robotframework

Which method or keyword is used for vertical scrolling using robot framework
I tried
Execute javascript window.scrollto(document.body.scrollheight, 0)

I hope you might be in trouble of running "Set Focus To Element" SeleniumLibrary command with Firefox browser. Please try following ways to scroll according to your requirement. There are few others ways to do the same with javascripts and also using xpath if theres no clear attributes like IDs, Classes in the DOM.
Execute JavaScript window.scrollTo(0, document.body.scrollHeight)
Execute JavaScript document.getElementById("${ElementID}").scrollIntoView()
Execute JavaScript document.getElementsByClassName("${ElementClass}")[0].scrollIntoView()

Related

Change not-allowed cursor on drag in React

When I drag an image in react that has draggable set to true, I get not-allowed / no-drop cursor. I can't figure out how to target it with CSS to overwrite. The way I handle the drag is onDragStart then onDragEnd.
Without some reproducable code i just can try a shot in the dark: You have to call at the beginning of your drag handler e.preventDefault();.
I faced the same issue back when I was working on one of my React projects, so I did some research and tested several methods that I found, but nothing worked for me. You see there is a property named DataTransfer.effectAllowed that specifies the effect that is allowed for drag operation, and there is a limitation to this API as you can read here -
https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/effectAllowed
Changing the styles or attaching an eventListener won't work, you have to use a different backend for this. Use react-dnd and react-dnd-touch-backend or react-dnd-html5-backend npm packages as a custom backend.
https://www.npmjs.com/package/react-dnd
https://www.npmjs.com/package/react-dnd-touch-backend
https://www.npmjs.com/package/react-dnd-html5-backend

Nightwatch Cannot Find/Click on Dropdown Option

I'm a backpacker and a programmer, trying to use the second skill to find openings in a full campsite. Rather than crawling fro scratch, I'm using the end-to-end testing framework nightwatch.js to navigate for me.
I've hit a roadblock, because nightwatch is having difficulty finding a specific element using css selectors.
Here are the elements and page:
Here is my test code:
Previous Attempts
My test code will click on the selection box with #permitTypeId. It will see that #permitTypeId option is visible. It will not see or click on any of the options when more specific values are specified. The five .click()'s are all css selectors I've already tried. None of the options are set to display:hidden or display:none. I have also tried all of the above without the .waitForElementToBeVisible() just in-case the waiting causes the dropdown to hide.
I've successfully clicked options from different dropdown menus on this website without any problem. Just this one is causing a headache.
The tests are running with the most current Selenium server and Firefox on Mac Yosemite.
tl;dr
Nightwatch.js/Selenium won't click on something from a dropdown menu.
The Path...
Cory got me thinking about jQuery and native DOM manipulation. Tried going that route and was successful selecting the correct option using Selenium's .execute() function:
.execute('document.getElementById("permitTypeId").options[1].selected=true')
However, it was not triggering the onchange event.
Saw this post which made me start thinking about using key-strokes and this one which suggested using arrow-keys to navigate down a <select> element to the option, then hitting enter.
...to the Solution
.click('select[id=permitTypeId]')
.keys(['\uE015', '\uE006'])
I've found that this is an issue with Firefox. Chrome and PhantomJS operate well clicking <option> tags.
you should be able to click like this way
browser.click('select[id="permitTypeId"] option[value="1451140610"]')
Additionally I was able to add a .click event for the specific option once I did a .click for the select. see my example below:
.click('select[name="timezone"]')
.pause(1000)
.click('option[value="America/Chicago"]') //selects the option but doesn't click
.pause(5000)
.keys(['\uE006']) //hits the enter key.
another solution:
.click('select[id="permitTypeId"]')
.waitForElementVisible("option[value='1451140610']")
.click("option[value='1451140610']")
Very simple way is to use .setValue('#element', 'value of option')

Checking that CSS has been updated using capybara

I'm currently writing a web app that updates it's pages CSS based on user input. I've got it all working fine, but I'm having trouble getting my automated tests to confirm that the CSS has actually been updated.
Basically, I just want to verify that the contents of a <style> tag in the document <head> have been updated to a certain value. I'm using capybara (with the selenium driver) for my tests, with this code:
styles = page.all('style')
styles.length.should == 1
styles[0].text.should == style
It all works as expected, until the final line, which fails as it seems that styles[0].text is always "". I've also tried .value but it is always nil. I'm pretty sure the CSS is actually being updated, as I can see the changes in the firefox window that the tests are running in.
So, is there a way to get at the contents of the <style> tag using capybara?
It seems Capybara (with Selenium at least, I didn't try any other drivers) won't show you this, I presume because the style content is wrapped in an HTML comment so it gets ignored e.g.:
<STYLE type="text/css">
<!--
.newfont { color:red; font-style:italic }
-->
</STYLE>
You do, however, have access to the page's source with page.source, so you can use that to get at the style content. The source is just a big string, so one way to dig into it is to parse it with Nokogiri (which is required by Capybara so you'll have it already):
page = Nokogiri::HTML.parse(page.source)
page.css('style').first.text
# => "\n<!--\n.newfont { color:red; font-style:italic }\n-->\n"
If you're asserting against customisable styles, and you're using Selenium anyway, an alternative solution could involve using Javascript to determine the calculated style of an element, there seems to be no shortage of information on doing this. You could use Capybara's page.evaluate_script method to invoke a piece of Javascript that would tell you what a particular element actually looks like, and that may well be more robust than comparing the CSS text (e.g. if it gets minified by the app).
page.should have_css ".selector", :text => "Some Text"
page.should have_css ".selector", :value => "Some Value"
page.should have_css ".selector", :count => 1
Or
find('.selector').value
find('.selector:nth-child(1)').value
There are a couple ways to about what you are trying. I'd take a closer look at the documentation.
Also, one thing to note, if you are trying to access these changes after a javascript event, you'll need to run this in Selenium (or equivalent). Or you could try to use Jasmine.js for this as well.

How to use seleniumRC in Junit framework on dynamically changing elementids

I am trying to automate a work flow process .In this,I need to click on a link positioned in any of the rows of table.Thing is all links available in all rows have same element ID and in the source code I have a java script like " ("Element ID" # Onclick..java script****:).....SO here after clicking it is connecting one form to another form by inputting some value in java script code and also one value in java script dynamically changes.How do I click on that link now?Is there any solution using xpath or so...to exactly click on that link based on CSS classID or so...Please help me out..Main problem is...all links in rows have same element ID and dynamically changing java script .
I am trying to use selenium.focus() and selenium.clickAndwait().But these are helpless.as it is not able to identify link ID only.
The best way to do this would be with xpath.
Something like //*[#onclick='javascript'] will work but this can make the tests extremely flaky because if the inline javascript changes or if its removed in preference of addEventListener to the element.
something like //*[#class='cssClass'] will work. I think that you will need to speak to the developers and ask them to help make it more testable.

jQuery syntax while using master Page

I am using master page where i need to move value of one listbox to the other with the help of jQuery I tried many ways but wasn't able to hit the nail.
The methods I tried are as follows:
$("[id$='ModuleMasterListBox option:[#selected]']").appendTo($("[id$='ModuleSelectListBox']"));
$("[id$='ModuleMasterListBox option:#selected]'").appendTo($("[id$='ModuleSelectListBox']"));
var module = $("[id$='ModuleMasterListBox']").val();
module.appendTo($("[id$='ModuleSelectListBox']"));
These are the methods I tried which failed - please help me out....
You should be able to do it like this:
$("[id$='ModuleMasterListBox'] :selected").appendTo("[id$='ModuleSelectListBox']");
From your markup and the # sign it looks like you're using an outdated version of jQuery, you may want to consider upgrading. In the above we're using the attribute-ends-with selector to get the <select> the using :selected to grab the selected <option> before moving it.
Keep in mind since it looks like you're using ASP.Net this will by default throw validation errors on the server-side, you'll have to disable page validation for it to allow items it didn't bind.

Resources