Develop Reference

Trying to drag an element to an element that is inside of an iFrame (using Webdriver-io)?

I am currently using Webdriver IO, Chimp JS and Cucumber JS, and I'm having a bit of a hard time dragging an element to another element that's inside of an iframe. I've been able to locate the element I want to move, as well as the element in the iframe after using client.frame(0); however I haven't found a way to click on the element, switch to the iframe to locate the element I want to move to, then move the element.
To make it easier, here's a picture. I want to move element 1 to element 2. But element 2 is in an iframe:
Looking through the docs, I see a lot of potentially helpful actions like hold, release ext. But I am working on desktop, and so I can't use any of the mobile actions.
With this limitation, it looks like the only drag and drop function available to me is dragAndDrop, but there doesn't seem to be a way to drag and drop an object into an element in an iframe in the javascript version of Webdriver. Am I correct in thinking this? Is there someway to do this solely using Cucumber JS? I feel like I'm missing something huge here, but I can't seem to figure it out :\

The selenium standalone driver I used is selenium-server-standalone-2.50.0.jar(selenium-release.storage.googleapis.com/index.html?path=2.50/) and chrome driver I used is ChromeDriver 2.29 (https://sites.google.com/a/chromium.org/chromedriver/downloads)
var webdriverio = require('webdriverio'),
dragAndDrop = require('html-dnd').codeForSelectors,
should = require('should');
// a test script block or suite
describe('Title Test for Web Driver IO - Tutorial Test Page Website', function() {
// set timeout to 10 seconds
this.timeout(10000);
var driver = {};
// hook to run before tests
before( function () {
// load the driver for browser
driver = webdriverio.remote({ desiredCapabilities: {browserName: 'chrome'} });
return driver.init();
});
// a test spec - "specification"
it('should be load correct page and title', function () {
var sectionId = "";
// load page, then call function()
return driver
.url('http://localhost:9000') //your url
.pause(7000)
.moveToObject('#element1')
.buttonDown()
.moveToObject('#element2')
.buttonUp()
.pause(2000)
.end()
});
// a "hook" to run after all tests in this block
after(function() {
return driver.end();
});
});

theintern test framework - testing iframes

im creating a platform to user automated tests to verify if a widget is functional. I already made the tutorials and the saw the examples but still i can figure out what's happening.
the widget that im trying to test is made with iframes without src attribute and with im trying to find a element inside of that iframe without src attribute.`define(function (require) {
var registerSuite = require('intern!object');
var assert = require('intern/chai!assert');
registerSuite({
name: 'index',
'greeting form': function () {
return this.remote
.get(require.toUrl('localhost:3000'))
.findById('iframeId')
.switchToFrame('iframeId')
.findById('buttonID');
}
});
});`
With this code it happens that the intern runner returns a error saying that it wasn't unable to find the element. But when i try to run the same code on a iframe with a "src" attribute it finds the correct element and doesn't returns any error.
anyone could help ??

In the above code, you should clear the search context before trying to find an element in the iframe, like:
return this.remote
.get(require.toUrl('localhost:3000'))
.findById('iframeId')
.end()
.switchToFrame('iframeId')
.findById('buttonID')
This is assuming the findById call is to wait for the iframe to be added to the page. If you don't need to do that, just leave out the findById('iframeId') call and you should be good.

Protractor/Jasmine test browser.isElementPresent not working when looking for a class

So i'm trying to run some tests with jasmine but i'm fairly new to the whole thing. I've spent way more time than i'm willing to admit trying to work out why my my webdriver is closing the browser before it has a chance to check the '.detailsColumn' element for expected results. After a while I've worked out that i can use browser.wait to make the browser stay alive long enough for the element to be ready.
My latest version of the test is below. The error I get is an invalidSelectorError and no info about which line the error was thrown on. I'd hazard a guess that the invalidSelectorError points to either my declaration or use of the detailsColumn variable though.
Can anyone see why this wouldn't work? I'm at a loss.
I'm using protractor/jasmine to do my tests, and using selenium for my web driver.
it('Should display result summary correctly when searching for multiple articles only', function () {
var TrackID= ExpectedArticle1Details.TrackingID + ', ' + ExpectedArticle2Details.TrackingID;
landingPage.get();
landingPage.setTrackID(TrackID)
landingPage.clickTrackButton();
expect(resultPage.allElementsofLandingPageAreVisible()).toEqual(true);
expect(resultPage.allHeadersofResultsPageAreVisible()).toEqual(true);
browser.wait(function () {
var detailsColumn = protractor.By.css('.detailsColumn.status:eq(0)');
return browser.isElementPresent(detailsColumn).then(function (result) {
expect(result).toBe(true);
return result;
console.log(result);
});
}, 10000);

JQuery index-related selectors like eq() are not supported by selenium webdriver.
You probably want to use nth-child instead:
.detailsColumn.status:nth-child(1)
Or, you may even replace it with element.all() plus first():
element.all(by.css(".detailsColumn.status")).first();
Additionally, if you have to use browser.wait(), I think you can replace the whole browser.wait() block you currently have with:
var EC = protractor.ExpectedConditions;
var detailsColumn = element(by.css('.detailsColumn.status:nth-child(1)'));
browser.wait(EC.presenceOf(detailsColumn), 10000);

Why must I use browser.sleep while writing protractor tests

My first run at E2E tests. I'm trying to digest someone else's protractor tests.
Problem: There are a lot of browser.driver.sleep and this seems fragile.
Goal: not to use browser.driver.sleep
Question: What is a better approach to browser.driver.sleep? Something less fragile like a promise or something I dont know about lol?
var config = require('../../protractor.conf.js').config;
describe('this Homepage Body Tests', function(){
browser.driver.get(config.homepageUrl);
it("should open find a clinic page", function(){
// page loads :: want to fix this random wait interval
browser.driver.sleep(2000);
browser.ignoreSynchronization = true;
var string = 'clinic';
var main = '.search-large-text';
var link = element(by.cssContainingText('.submenu li a', string));
link.click().then(function() {
// page reloads :: want to fix this random wait interval
browser.driver.sleep(3000);
var title = element(by.cssContainingText(main, string));
expect(title.getText()).toBe(string);
});
});
});

Since there is an ignoreSynchronization turned on, you cannot use waitForAngular(), which would be a solution in case of an angular-site testing.
A better solution here would be to set a page load timeout:
browser.manage().timeouts().pageLoadTimeout(10000); // 10 seconds
See also these relevant threads on explicit waits and timeouts:
Use protractor to test login on non-AngularJS page (Leo's answer is very detailed)
Protractor : How to wait for page complete after click a button?
Timeouts

jquery programmatic popup window

I'm new to Jquery, so please bear with me. I'm trying to create a function that will programmatically open popup windows. I'm running the following code in Firefox, and it seems to work except that the popup windows disregards the toolbar/menubar/scrollbars/resizable/location parameters (they are still visible/functional and I would like to disable all of them):
wparams[0] = {windowURL:"site.html",height:100,width:100,left:500,top:500,toolbar:0,menubar:01,scrollbars:0,resizable:0,location:0}
var launchWindow = function(p)
{
$('.popup').popupWindow(wparams[p]).trigger("click");
}
var begin = function()
{
launchWindow(0);
}
I would like the popups I'm using jQuery-swip popup plugin (http://swip.codylindley.com/popupWindowDemo.html), am wondering what's wrong with the above code.
Also, when I try to run this code in chrome/safari (typing begin(); in the console) it returns undefined, whereas in Firefox it runs. I'm also confused as to why this is happening.
Thanks.

I didn't understand 'when' you want to open the popup, if when the page complete loading, so it should be
$(document).ready(function() {
launchWindow(0);
});
Also can you explain to me why use trigger(click)??? As of the plugin documentation, this should work like that
var launchWindow = function(p)
{
$('.popup').popupWindow(wparams[p]);
}

Does this work?
wparams[0] = {windowURL:"site.html","height:100,width:100,left:500,top:500,toolbar:0,menubar:01,scrollbars:0,resizable:0,location:0"}

That's a weird way to define the "wparams" array - what happens if you do this:
var wparams = [
{windowURL:"site.html", height:100, width:100, left:500, top:500, toolbar:0, menubar:01, scrollbars:0, resizable:0, location:0}
];
It's not really clear why you're setting that up as an array; I guess maybe there might be other popup configurations stored in it. If that's the case, you'd just write them inside those square brackets, separated by commas.