So just a brief overview, I'm unable to send keys to a edit text field for android. I've successfully sent keys to this element via browser but in order to test the mobile application fully, I'd like to run e2e tests on a device using Appium.
I've successfully got Appium to click button elements but am having a hard time getting it to send keys to an edit field element.
Am I able to find elements by model when testing with android as I have set in my forgot-pin-page.js?
pin-reset-page.js
var pinResetPage = function() {
describe('The Reset Pin Flow', function () {
forgotPinPage = forgotPinPageBuilder.getForgotPinPage(),
describe('The Forgot Pin Page', function () {
it('should allow the user to enter their MSISDN and continue',
function () {
forgotPinPage.enterMsisdn('123123123');
forgotPinPage.doForgotPin();
expect(securityPage.isOnSecurityPage()).toBe(true);
});
});
}
forgot-pin-page.js
'use strict';
var ForgotPin = function () {
var forgotPinPageContent = element(by.id('forgot')),
msisdnInput = element(by.model('data.msisdn')),
return {
enterMsisdn: function (msisdn) {
return msisdnInput.sendKeys(msisdn);
}
};
module.exports.getForgotPinPage = function () {
return new ForgotPin();
};
The error i'm getting is
? should allow the user to enter their MSISDN and continue
- Error: Timeout - Async callback was not invoked within timeout spe
cified by jasmine.DEFAULT_TIMEOUT_INTERVAL.
Not sure if this is the correct solution but it worked for me. I downgraded jasmine2 to jasmine and that seemed to resolved the async timeouts I was having.
Related
I am using Protractor for e2e testing. The tests should first enter too short username and passwords and because of Angular validators when clicked on a submit button (which is disabled) get rejected and stay put (this works!), then it should enter an username of correct length with also a password of a correct length, click on the submit button and NOT get redirected, because it's a false login. This fails... The last test requires to input correct login details and click on submit and should get redirected to the dashboard.
According to this answer https://stackoverflow.com/a/21785088/12360035 is all it would take to solve my problem that seems to throw the
- Failed: script timeout
(Session info: chrome=79.0.3945.130)
(Driver info: chromedriver=79.0.3945.16 (93fcc21110c10dbbd49bbff8f472335360e31d05-refs/branch-heads/3945#{#262}),platform=Windows NT 10.0.18362 x86_64)```
error for both of my tests.
How do I fix this?
My tests are written this way:
it('should enter too short username and password and NOT get redirected => stay put', () => {
element(by.css('#inputUser')).sendKeys('bah');
element(by.css('#inputPassword')).sendKeys('bah');
const btn = element(by.css('#loginSubmit'));
btn.click();
const curUrl = browser.getCurrentUrl();
expect(curUrl).toBe('http://localhost:4200/avior/login');
});
it('should enter incorrect username and password and NOT get redirected => stay put', () => {
const ele1 = element(by.css('#inputUser'));
const ele2 = element(by.css('#inputPassword'));
const btn = element(by.css('#loginSubmit'));
ele1.clear();
ele2.clear();
ele1.sendKeys('bah');
ele2.sendKeys('bahbahbah');
btn.click();
browser.waitForAngular();
const curUrl = browser.getCurrentUrl();
expect(curUrl).toBe('http://localhost:4200/avior/login');
});
it('should enter correct username and password and get redirected to /avior/dashboard', () => {
const ele1 = element(by.css('#inputUser'));
const ele2 = element(by.css('#inputPassword'));
const btn = element(by.css('#loginSubmit'));
ele1.clear();
ele2.clear();
ele1.sendKeys('Chad');
ele2.sendKeys('chadchad');
btn.click();
browser.waitForAngular();
const curUrl = browser.getCurrentUrl();
expect(curUrl).toBe('http://localhost:4200/avior/dashboard');
});
UPDATE
A jwt token is sent as a cookie in response, that might be part of the problem. I can't seem to find info online on how to handle cookies with Protractor..
Waits in Protractor
Wait for the element to Present
this.waitForElementPresent = function (element) {
return browser.wait(() => (element.isPresent()), 30000);
}
Wait for the element to Display
this.waitForElementDisplayed = function (element) {
return browser.wait(() => (element.isDisplayed()), 30000);
}
Sleep Condition
this.sleep = function (sec) {
browser.sleep(sec * 1000);
}
Expected Conditions
this.waitForElementVisibility = function () {
let EC = ExpectedConditions;
return browser.wait(EC.visibilityOf(), 30000);
}
According to this question Failed: script timeout: result was not received in 11 seconds From: Task: Protractor.waitForAngular() - Locator: By(css selector, #my-btn) adding browser.waitForAngularEnabled(false); before the button clicks seems to have solved the errors..
I'm learning protractor and i came across with an issue selecting a given value from an Autocomplete.
How can i click a given string which has following source code using the protractor
I'm practicing in the following URL: https://material.angular.io/components/autocomplete/overview#option-groups
Protractor is only able to interact with elements present in the DOM of the page. The elements for the underlying state options will not be loaded into the DOM until the input box for the State Group has been interacted with.
You can select the Maine option as follows:
app.js
describe('desribe the test', () => {
it('the it', async () => {
await browser.get('https://material.angular.io/components/autocomplete/overview#option-groups');
let statesGroupField = element(by.xpath('//input[#placeholder="States Group"]'));
await statesGroupField.click();
let maineDropdownOption = element(by.xpath('//span[text()="Maine"]'));
await maineDropdownOption.click();
await browser.driver.sleep(5000);
})
})
If you go here: http://ionicframework.com/docs/api/components/infinite-scroll/InfiniteScroll/
Inspect the demo and click the last item on the list:
Then in the console type: $0.scrollIntoView()
Infinite Scroll is never triggered.
Is there a way to programmatically trigger infinite-scroll in protractor context?
The implementation of the scroll in your example rely on the speed/velocity of the scroll which I guess falls far from the expected range when scrollIntoView is called.
One workaround is to simulates a smooth scroll by emitting multiple scroll events over a reasonable time. The idea is to reproduce as close as possible the behavior of a real user.
Some browsers already provides the option via scrollIntoView (supported by Chrome 62) :
$0.scrollIntoView({behavior: "smooth", block: "end"});
Using the accepted answer, in my case, I used ion-infinite-scroll as the argument.
Complete test to check if more content is loaded in Ionic:
describe('Scroll', () => {
it('should load more when reached end', async () => {
let list = getList();
let currentCount = await list.count();
const refresher = element(by.tagName('ion-infinite-scroll')).getWebElement();
let count = 0;
while(true){
browser.executeScript(`arguments[0].scrollIntoView({behavior: "smooth", block: "end"});`, refresher);
browser.sleep(1000); // wait for data to be loaded from api
list = getList();
let newCount = await list.count();
expect(newCount).toBeGreaterThanOrEqual(currentCount)
expect(newCount).toBeLessThanOrEqual(currentCount * 2)
if(newCount === currentCount){
break;
}
currentCount = newCount;
count++;
}
expect(count).toBeGreaterThan(0);
})
});
function getList() {
return element(by.className(pageId + ' list')).all(by.tagName('ion-item'));
}
I am trying to create a UI automation test with intern js , but i m getting problem on waiting until the page is fully loaded. My code starts searching for element before the page is loaded. Can some one help me on this.
My code:
define([
'intern!object',
'intern/chai!assert',
'Automation/ConfigFiles/dataurl',
'Automation/pages/login/loginpage',
'intern/dojo/node!fs',
'intern/dojo/node!leadfoot/helpers/pollUntil'
], function (registerSuite, assert,dataurl, LoginPage,fs,pollUntil) {
registerSuite(function () {
var loginPage;
var values;
return {
setup: function () {
var data = fs.readFileSync(loginpage, 'utf8');
json=JSON.parse(data);
console.log('###########Setting Up Login Page Test##########')
this.remote
.get(require.toUrl(json.locator.URL))
.then(pollUntil(this.remote.findById('uname').isDisplayed(),6000)// here i want to wait until page is loaded
.waitForDeletedByClassName('loading').end().sleep(600000)// here i want to wait until loading component is disappered
values = json.values;
loginPage = new LoginPage(this.remote,json.locator);
},
'successful login': function () {
console.log('##############Login Success Test############')
return loginPage
.login(values.unamevalue,values.pwdvalue)
},
// …additional tests…
};
});
});
I m trying to use pollUntil . But I m not sure weather I should use it or not.
pollUntil is a good thing to use here, but it doesn't look like you're actually waiting for polling to finish. Your setup method needs to return the command chain that includes pollUntil so that Intern will know it needs to wait, something like:
var setupPromise = this.remote
.get(require.toUrl(json.locator.URL))...
values = json.values;
loginPage = new LoginPage(this.remote, json.locator);
return setupPromise;
Alternatively, you could pass your LoginPage class the chain:
var setupPromise = this.remote
.get(require.toUrl(json.locator.URL))...
values = json.values;
loginPage = new LoginPage(setupPromise, json.locator);
In this case Intern won't wait for setup to complete, but your LoginPage code will implicitly wait for the setupPromise to complete before doing anything else. While this will work, the intent isn't as clear as in the previous example (e.g., that Intern should wait for some setup process to complete before proceeding).
When I try to associate my router's public variable this.currentView to a newly created view, the view gets lost, the public variable is null instead of containing the newly created view.
var self=this;
var watchListsCollection = new WatchlistCollection;
watchListsCollection.url = "watchlists";
user.fetch().done(function() {
watchListsCollection.fetch().done(function () {
loggedUser.fetch().done(function () {
self.currentView = new UserView(user, watchListsCollection,loggedUser);
});
});
});
alert(this.currentView); //null
The fetch() calls you do are firing asynchronous AJAX requests, meaning the code in your done handlers are not going to be executed untill the server calls return. Once you've executed user.fetch() the browser will fire off a request and then continue running your program and alert this.currentView without waiting for the requests to finish.
The sequence of events is basically going to be
call user.fetch()
alert this.currentView
call watchListsCollection.fetch()
call loggedUser.fetch()
set the value of self.currentView
You will not be able to see the value of your currentView before the last server request have completed.
If you change your code to
var self=this;
var watchListsCollection = new WatchlistCollection;
watchListsCollection.url = "watchlists";
user.fetch().done(function() {
watchListsCollection.fetch().done(function () {
loggedUser.fetch().done(function () {
self.currentView = new UserView(user, watchListsCollection,loggedUser);
alertCurrentView();
});
});
});
function alertCurrentView() {
alert(this.currentView);
}
You should see the correct value displayed. Now, depending on what you intend to use your this.currentView for that might or might not let you fix whatever issue you have, but there's no way you're not going to have to wait for all the requests to complete before it's available. If you need to do something with it straight away you should create your UserView immediately and move the fetch() calls into that view's initialize().
fetch() is asynchronous, but you check your variable right after you've started your task. Probably these tasks, as they supposed to be just reads, should be run in parallel. And forget making a copy of this, try _.bind instead according to the Airbnb styleguide: https://github.com/airbnb/javascript
var tasks = [];
tasks.push(user.fetch());
tasks.push(watchListsCollection.fetch());
tasks.push(loggedUser.fetch());
Promise.all(tasks).then(_.bind(function() {
this.currentView = new UserView(user, watchListsCollection, loggedUser);
}, this));
or using ES6 generators:
function* () {
var tasks = [];
tasks.push(user.fetch());
tasks.push(watchListsCollection.fetch());
tasks.push(loggedUser.fetch());
yield Promise.all(tasks);
this.currentView = new UserView(user, watchListsCollection, loggedUser);
}