Develop Reference

Push javascript to console.log new opened page by link

I need to push my javascript code to new opened page (preferred to console.log)
Here is my function:
(function () {
window.onbeforeunload = function () {
setInterval(function () {
window.location.href = "http://mylink";
}, 1000)
};
});
and I need to run it in new page:
<a href="javascript:(function () {
window.onbeforeunload = function () {
setInterval(function () {
window.location.href=http://mylink;
},1000)
};
});">click</a>
Also I tryed to add the code like this? but it doesn't work too:
<a href="javascript: console.log('(function (){
window.onbeforeunload = function () {
setInterval(function () {
window.location.href=http://mylink;
},1000)
};
});')">click</a>
Could yu help me please

setInterval would not work inside onbeforeunload. It will add event to queue and than simply exit page and never execute.
Edit:
You will see this if you modify code like this:
window.onbeforeunload = function () {
setInterval(function () {
console.log('interval execution');
window.location.href = "http://mylink";
}, 1000)
};
There will be no output on console log.

unit test javascript function that triggers a click on anchor tag

I would like to test the below JavaScript function where I want to trigger Click on the anchor tag(passed dynamically). Could someone provide any code reference to unit test the below function.
var clickTag = function(tagtoClick, htmlEle) {
var anchor = htmlEle.getElementsByTagName("a");
var anchorToClick;
for (var i = 0; i < anchor.length; i++) {
if (anchor[i].textContent.trim() === tagtoClick.trim()) {
anchorToClick = anchor[i];
break;
}
}
anchorToClick.click();
};
I want to test that a click has been triggered,
Below is my unit test
describe("Testing anchor click", function () {
var anchorToClick;
beforeEach(function () {
//also tried adding below callThrough
//spyOn(actionToClick, 'click').and.callThrough();
});
iit("test clickAction should click on the action", function () {
//blah blah code
spyOn(anchorToClick, 'click');
abc.clickTag ("Delete",actionBar);
expect(anchorToClick.click).toHaveBeenCalled();
});
});

execute function on page or not?

I have recursive function as the following :
scope.$watch('settings.egg', function () {
var index = 0;
function inOrder() {
setTimeout(function () {
$(".egg").eq(index).removeClass("maximize")
$(".egg").eq(index + 1).addClass("maximize")
index++;
inOrder();
}, 3000)
};
$(".egg").eq(index).addClass("maximize")
inOrder();
})
My function execute on load page but I don't want that.
I just want to work click on button not on load page.
How can I do ?
Please..

Why not set up a function that's bound to an ng-click of your button then and set your function within that? For example:
scope.buttonClick = function() {
scope.watchFunc = scope.$watch('settings.egg', function () {
var index = 0;
function inOrder() {
setTimeout(function () {
$(".egg").eq(index).removeClass("maximize")
$(".egg").eq(index + 1).addClass("maximize")
index++;
inOrder();
}, 3000)
};
$(".egg").eq(index).addClass("maximize")
inOrder();
})
}
You'd store this in a scope variable so that you could easily call it from another function later on to cancel the $watch. And in your markup:
<button ng-click="buttonClick()">Click me to set the watch</button>

Kill, abort, stop, cancel a previous call/queue to a javascript function

I have a function which will take some time to run on click event.
Following is merely an example and setTimeout is there only to simulate time it may take to run it. How can I ensure when a user click on an item any previous running function(s) is(are) cancelled and only the latest onclick function is fired?
i.e. if a user clicked on it 10 times. I want to only execute the only the 10th click not the 9 clicks before.
I am hoping for a pure/vanilla js solution... NOT jQuery
(function () {
var nav = document.querySelector('.nav__toggle');
var toggleState = function (elem, one, two) {
var elem = document.querySelector(elem);
elem.setAttribute('data-state', elem.getAttribute('data-state') === one ? two : one);
};
nav.onclick = function (e) {
setTimeout(function(){
toggleState('.nav ul', 'closed', 'open');
}, 5000);
e.preventDefault();
};
})();
fiddle: http://jsfiddle.net/6p94p48m/

You need to debounce your click handler.
var button = document.getElementById("debounced");
var clickHandler = function() {
alert('click handler');
}
var debounce = function(f, debounceTimeout) {
var to;
return function() {
clearTimeout(to);
to = setTimeout(f, debounceTimeout);
}
}
button.addEventListener('click', debounce(clickHandler, 5000));
<button id="debounced" href="#">debounced</button>
Or use underscore/lodash https://lodash.com/docs#debounce

Protractor test cases are failing on Jenkins server but they pass on Local machine: Error: Element is not clickable at

I have written as script in which I create one form and then Delete it. While creating and deleting one modal dialogue box appears on the screen and "Create" & "Delete" buttons are present on the Modal Dialogue. When I execute this script in my local machine, test script is running fine but when I run the same on Jenkins server, test script will fail with below message:
[31mUnknownError: unknown error: Element is not clickable at point (370, 24). Other element would receive the click: <div class="modal-backdrop fade" ng-class="{in: animate}" ng-style="{'z-index': 1040 + (index && 1 || 0) + index*10}" modal-backdrop="" style="z-index: 1031;"></div>
(Session info: chrome=37.0.2062.124)
(Driver info: chromedriver=2.9.248315,platform=Windows NT 6.1 SP1 x86_64)[0m
Here is my test script:
describe('Tests Scripts', function () {
var baseurl = `"http://test/index.html"`;
var url = `"/index.html"`;
var driver = browser.driver;
var ptor = protractor.getInstance();
var tabIndex = 1;
beforeEach(function () {
ptor.ignoreSynchronization = true;
});
it('WILL load the page', function () {
browser.get(baseurl);
helper.waitForElementByXpath('//*[#id="xyz"]/ul/li/a/i');
expect(browser.driver.isElementPresent(by.xpath('//*[#id="xyz"]/ul/li/a/i'))).toBeTruthy();
expect(browser.getCurrentUrl()).toContain(url);
});
it('Delete the form', function () {
element(by.xpath('//*[#id="xyz"]/ul/li/a/i')).click().then(() => {
helper.waitForElementById('controlItem');
element(by.id('controlItem')).click().then(()=> {
helper.waitForElementById('modalDialogue');
var form_name = "DeleteForm";
element(by.id('title')).sendKeys(form_name);
browser.wait(function () {
helper.clickByIDAndWait('createbutton');
tabIndex++;
return true;
}, 5000).then(function () {
browser.getCurrentUrl().then(function (curr_url) {
var arr_url = curr_url.split(':');
var instance_id = arr_url[arr_url.length - 1];
helper.clickByXpathAndWait('//*[#id="windowTab-1"]/a');
helper.waitForElementById('form-control');
var xp = '//*[#id="Forms-' + instance_id + '"]/td[2]';
expect(driver.isElementPresent(by.xpath(xp))).toBeTruthy();
element(by.id('deleteForm-' + instance_id)).click().then(()=> {
helper.waitForElementById('DeleteFormModal');
browser.wait(function () {
helper.clickByIDAndWait('modal-deleteForm-btn');
return true;
}, 5000).then(function () {
helper.waitForElementById(form-control');
expect(driver.isElementPresent(by.xpath(xp))).toBeFalsy();
});
});
});
});
});
Here are the functions used in above code:
var clickByIDAndWait = function (btnId) {
var returnVal = false;
browser.wait(function () {
if (!returnVal) {
element(by.id(btnId)).click().then(function () {
returnVal = true;
});
}
return returnVal;
}, 30000);
};
var waitForElementById = function(elementId){
browser.wait(function(){
return browser.driver.isElementPresent(by.id(elementId));
},30000);
};

I have found the solution.
Test cases are working fine on jenkins now after making some changes in the test cases. I think the problem was, once the focus is at the bottom of the page it was not going up automatically to click on the element, I restructured the test cases in such a way that my list will not be too long and focus will not go at the bottom of the page. Also, I am resetting the window size before every test case by using below line of code in beforeEach function:
beforeEach(function () {
ptor.ignoreSynchronization = true;
browser.driver.manage().window().setSize(1280, 1024);
});
I am not sure whether my assumptions are correct and resolution will work for everyone but its working fine for me. you may want to give a try and see.