How to wait in protractor till the element is enabled - javascript

Protractor is failing when trying to click a button. Initially the button will be in disabled status (after sometime it will be enabled) and protractor thinks that the button is ready and clicking on the button and failing.
So i want the protractor script to wait till the button is enabled. I have tried below, but it didn't work. Can someone please post the complete code to wait for the element to be enabled?
expect(browser.wait(function(){return browser.driver.isElementPresent(by.id('paynow-info-btn'))}, 10000));

There is a very much suitable Expected Condition - elementToBeClickable - it would wait for an element to be both visible and enabled:
var elm = element(by.id('paynow-info-btn'));
var EC = protractor.ExpectedConditions;
browser.wait(EC.elementToBeClickable(elm), 5000);
elm.click();

Related

Selenium test - OK/Cancel popup disappearing immediately

Odd one here. When testing this manually I click the delete button, wait for the popup
Then I click OK and the record is removed as expected.
But when I try to do the same in Java/Selenium it goes like this->
WebElement element = _driver.findElement(By.id("btnDeletePatient"));
JavascriptExecutor executor = (JavascriptExecutor)_driver;
executor.executeScript("arguments[0].click();", element);
or
_driver.findElement(By.id("btnDeletePatient")).click();
Both have the same response, the OK/Cancel popup will appear and then immediately vanish.
This is the code for the button
<input type="submit" name="ctl00$cpContentLeft$btnPatient"
value="Delete User" onclick="return userDelete();"
id="ctl00_cpContentLeft_btnPatient"
tabindex="81" class="btn btn-outline-primary btn-sm mr-3">
And this is the code for the function userDelete
function userDelete() {
if (confirm("Are you sure you wish to delete this user?")) {
return true;
}
else {
return false;
}
}
Also I have now tried the same in Edge, same thing so this does not appear to be a Chrome issue.
Anyone got any ideas what is causing this please?
Further tests as follows.
I place a breakpoint just at the point the script will click the delete run and run the script. The page loads as expected and I get to the problem point.
I manually click the Delete button, the popup appears and then stays until I click cancel.
Using this code I step through and the popup appears and then instantly disappears.
_driver.findElement(By.id("ctl00_cpContentLeft_btnDelete")).click();
Using this code the response is the say as 2.
_driver.findElement(By.id("ctl00_cpContentLeft_btnDeletePatient")).sendKeys(Keys.SPACE);
Then I try a double click and nothing happens.
On all tests I see no errors in the console.
I hope you are clicking the delete button before page loads completely, that is why pop is disappearing suddenly. please add wait before clicking delete button.
Steps:
Load the page completely (add wait here)
Click the delete button
click Okay button.
please add some more codes here and screenshots too. that would be more helpful
This looks like a java script alert. In selenium, we have specific way to handle alert. You do not need to click on ok. You can first wait for alert to be present. If it is present, then switch to that alert.
Then, We have specific methods to handle alerts in selenium.
alert.accept() clicks on ok.
alert.dismiss() clicks on cancel.
Sample code from selenium documentation:
driver.findElement(By.linkText("See a sample prompt")).click();
//Wait for the alert to be displayed and store it in a variable
Alert alert = wait.until(ExpectedConditions.alertIsPresent());
//Type your message
alert.sendKeys("Selenium");
//Press the OK button
alert.accept();
//Press the Cancel button
alert.dismiss();
//Store the alert in a variable for reuse
String text = alert.getText();
Ok found it
The issue was within the chromedriver, this line fixed it
chromeOptions.setCapability("unexpectedAlertBehaviour", "ignore");
Now the popup remains until actioned in the script.
We live and learn, thanks for all your help.

Protractor wait for modal-dialog

How do I get Protractor to wait for a modal-dialog pop up?
Background: After clicking a button protractor should wait for a modal dialog to pop up (and get the time right when the button is clicked and when the dialog pops up). How can I do that? With browser.wait()?
The reason is, I have to do End-to-End tests and measure the time the user experiences between clicking the button and getting a feedback from the website.
When I do the test manually, it can take between 5 and 30 seconds for the website to give a feedback. How do I get protractor to wait and then read out the dialog that shows up at the top of the page?
So, you need to measure the time difference between the clicking of button and the time the modal-dialogue window comes up.
Get the Time after button click
//you can use any selector for clicking the button
element(by.buttonText("button_text_for_thebutton").click();
//getting the time
var buttonClickTime = new date();
Use the expected conditions inside of your browser.wait() to wait for the modal-dialog to pop up
//you can use any other locator for modal window
browser.wait(EC.presenceOf(element(by.css('css_locator_formodal'))), 1000, 'Unable to find the modal-popup');
//get the time post Modal dialog appearance
var ModalDialogTime = new date();
Then get the difference between buttonClickTime and ModalDialogTime using
var timeDifference = ModalDialogTime.getTime() - buttonClickTime.getTime();
Note : Expected conditions code is taken from #alexce answer in this SO post.
After hours of research, I found a very useful script: waitReady.js.
This is my working solution now.
I also added functionality that the script also prints out the text of the modal-dialog.
it('Should wait until modal-dialog pops up', function() {
var dialog = element(by.className('modal-dialog'));
expect(dialog.waitReady()).toBeTruthy();
var dialogtext = element(by.className('modal-body-content'));
expect(dialogtext.waitReady()).toBeTruthy().then(function () {
dialogtext.getText().then(function (text) {
console.log('Button Text: ' + text);
});
});
});

Trouble getting to Angular app after logging in on non Angular page

I’m trying to create a simple test where I click on a button in my Angular app. However, when I navigate to my Angular app it first redirects me to a non Angular login page.
So a user’s experience is as follows: The user navigates to https://test.com and then is redirected to a login page where they enter a username and password and click the Submit button. Then the app page loads which contains a button which they can click.
I’ve got my code working to the point where when I run protractor, I see a chrome window open, I see the login page appear and I can see text filling into both the ‘Username’ and ‘Password’ fields. However, right after that the chrome browser closes. I do not see my app page loads which contains the button I want to click.
The code I’m using to try and login is as follows (NOTE: username and password text were changed to something fake so I could post my question)
describe('Go to Test site', function() {
it('and login', function() {
browser.get('https://test.com');
browser.ignoreSynchronization=true;
element(by.name('login')).sendKeys('username');
element(by.id('cred_password_inputtext')).sendKeys('password');
element(by.id('cred_sign_in_button')).click();
//browser.ignoreSynchronization=false;
});
});
What is the next step? Should I be using “browser.ignoreSynchronization=false;”? Do I need to find the button element on the next page?
At this point I would be happy just to see my app page load so I can even see the button in the test browser. It closes so fast. This is my first question so I apologize if it's confusing. Thank you.
As mentioned by #Batajus you don't have any code, so the test execution has finished.
If you only need to logon once you can place the code in a beforeAll() and even make a method for it that holds all the logon logic, something like this
function logon(username, password) {
var EC = protractor.ExpectedConditions;
browser.get('https://test.contracts365.com');
browser.ignoreSynchronization = true;
// Wait for the url to be changed to the logon page
browser.wait(EC.urlContains('login.microsoftonline.com'), 5000);
// Do the logon magic
element(by.name('login')).sendKeys(username);
element(by.id('cred_password_inputtext')).sendKeys(password);
element(by.id('cred_sign_in_button')).click();
browser.ignoreSynchronization = false;
// Wait till you are back on the page
browser.wait(EC.urlContains('test.contracts365.com'), 5000);
}
describe('Go to Test site', function() {
beforeAll(function() {
logon('john#doe.com', 'Welcome123')
});
it('should do some tests', function() {
// do some tests
});
});
And then add your tests
Hope it helps
your browser closes, because the test execution has finished. So your next step is to find a button or another element on your next loaded page.
I recommend to use browser.wait(...) methods with Expected Conditions to wait until your next page is fully loaded and your elements become interactable.
I hope this solves your problems, otherwise please tell me so i provide another solution ;-)

Protractor is unable to click the links which are associated with $timeout

I am trying to click a link which is associated with $timeout, which will be displayed only for few seconds. After clicking it opens a pop up and adds new message to list.
But as i went through https://github.com/angular/protractor/issues/169, it says protractor waits for $timeout to finish. So can anyone help me to resolve this issue.
You have to turn the sync between Angular and Protractor off and wait until you see the desired text. Something along these lines:
browser.ignoreSynchronization = true;
var EC = protractor.ExpectedConditions;
# navigate to a page here
browser.wait(EC.textToBePresentInElement($("#myid"), "some text"), 5000);

wait for a click and then autoclick a button after 500 ms in javascript

I'm new to JavaScript.
I'm writing a simple code to add it in a chrome extension call it Shortkeys.
I just want the code to make a simple action:
Wait for a click of the mouse and then click a button in certain positions of the screen after 500 ms...
This is what I have written until this moment but is not working:
document.addEventListener('click', TimerThenPlay);
function TimerThenPlay(e) {
setTimeout(500)
document.elementFromPoint(1175, 85).click();
stop(TimerThenPlay);
clearTimeout(TimerThenPlay);
return;
};
What I'm doing wrong?
EDIT:
I have an APP running on Chrome...
I need to Click a Link and wait 500 ms to click a button... i can do that manually but sometimes dsnt work and i have to try again..
I realize that chrome has an extension that you can inject to the page a javascript code when u press a key in your keyboard. Thats why im using Shorkeys (if u know a better extension for this, just tell me).
Well... i have assign the < key to run the code...
What i need, is that everytime that i hit the < key... Chrome waits for a click (so i have time to look for the link that i want to open with de button)...
And when i click the link, it waits 500 ms and then click the button in the position that i select ( i cant use the Button ID cause it changes every minute).
I have tried the codes above and it works for the first time.. then, i dnt know why is keeping clicking 500 ms after a make a mouse click in the next pages... How can i stop that loop in the next page?
function TimerThenPlay(e) {
setTimeout(function(){
document.elementFromPoint(1175, 85).click();
stop(TimerThenPlay);
clearTimeout(TimerThenPlay);
},500)
}
SetTimeout method takes two arguments. First is function to execute after second argument time passes.
Hope this helps
Your setTimeout syntax is wrong.
Syntax of setTimeout:
setTimeout(function(){}, time)
you need to update your setTimeout function
function TimerThenPlay(e) {
setTimeout(function(){
document.elementFromPoint(1175, 85).click();
stop(TimerThenPlay);
clearTimeout(TimerThenPlay);
return;
},500)
};

Categories