protractor not clearing contents of input field - javascript

when my page loads up it has a lot of fields containing information about customers (written by somebody else). in the first name field 'Jerry' appears. I want protractor to remove this and then write my name in and expect it to be there. so far i have got this:
var firstName = element(by.css('#cust04'));
firstName.clear();
firstName.sendKeys('John');
expect(firstName.getAttribute("value")).toEqual("Johns");
at the moment it says Expected JerryJohn to equal Johns. any idea why it wont work? p.s. i am aware it is to equal Johns not John at the moment.

are you trying this on protractor 2.0 because I got a similar issue and the resolve for this issue was below. I do not know why it worked for me but it did.
var firstName = element(by.css('#cust04'));
firstName.click().clear().sendKeys('John');
expect(firstName.getAttribute("value")).toEqual("John");
if you have issues with the expect happening before the text gets entered then you can do this before the expect. I've only had a few instances where I've had to do the extra wait before the expect.
var usernameHasText = EC.textToBePresentInElementValue(firstName, 'John');
browser.wait(usernameHasText, 5000, "Failed to type in the username");

Try this code:
firstName.clear().then(function(){
var firstName = $('#cust04');
firstName.sendKeys('John');
expect(firstName.getAttribute("value")).toEqual("John");
});
clear() - returns promise, so you need to resolve it.
And in addition you assert wrong value(for the lastName) in your code.
Also I would recommend you use:
browser.ignoreSynchronization = false;
flag, in this case you do wont need to use .then block here, because protractor in this case will wait until promise will be resolved.

Related

Javascript checks if any text was entered on form submit is just not working

I know this is a very basic JS question and I apologize. I am very new to this. I must be making a mistake somewhere. Here is what I am working with:
HTML Form
<div class='nameinput'>Please enter your name:</div>
<input id='name1' placeholder='Name...' type='text'>
<input type='submit' value='Connect' class="submitForm">
</div>
Javascript Code
function store() {
name = $("input#name1").val();
}
function init() {
$('.submitForm').on('click', function(){
if (name === '') {
alert("Please Enter Name");
}
else
store();
$(".login_page").animate({
'opacity': '0' });
I am not sure what I am missing here. The name = $("input#name1").val(); works fine but I can't seem to get the if to work right. Could someone kindly explain my issue here?
The variable name is undefined in the scope. You need to get it when the button is clicked. Change your code to something like this:
function init() {
$('.submitForm').on('click', function() {
var name = $("#name1").val();
if (name === '') {
alert("Please Enter Name");
}
// rest of the code
}
Also, you don't need the function store if you're using it only to initialize the variable name. Additionally, the selector input#name1 can be simplified to #name1 as all elements in the page should have unique IDs.
I am still new and learning JavaScript in many ways, so don't worry.
First, you should always try to debug the problem as much as possible. One easy way to do that is simply putting in test console.log() statements printing out relevant values so you 1) know what is firing and when, and 2) what values they are working with. That'll get you out of a lot of problems like this.
Second, your if statement (if (name === '') {) I believe is the problem. You should look at this and ask yourself why isn't it working? Is your logical comparison written wrong? are you comparing the right things? What values are you comparing?
Your problem is: where is name defined? You use it in store(), but it pops up for the first time in init in that if statement. It's not defined prior to that.
So the first time it fires, that can't be true, and it goes to the else clause and then store() fires.
In this case, you've lost track of scope; where your variables are being defined.
The easiest solution is to add another statement to extract the value of the input you are trying to check and making sure it's not null/empty. For that matter, I don't think you need store() at all, unless you had some specific purpose for it.

JavaScript runtime error: '[MethodName]' is undefined

I'm trying to use jQuery and AJAX to validate that users entered a number in a particular field and that they didn't leave it blank and I'm a little confused as to why I can seem to do one, but not the other.
I'm doing this in a jQuery change() function so any time they change the value in that field, it updates it in the database without refreshing the whole page and it works fine until I try to use isNull() to validate.
I'm saving their input to a variable called UserInput and first checking to make sure it's a number with this:
if (!isNaN(UserInput))
which works perfectly. I'm also trying to check and make sure it isn't empty by using this:
if (isNull(UserInput))
Intellisense completes isNull() for me just like it did for isNaN() and all appears well in Visual Studio, it compiles without error. I've also tried isNullOrUndefined() here with a similar result, intellisense completes it for me and all seems well. Right up until I change the value in the field, at which point it promptly gives me this error:
JavaScript runtime error: 'isNull' is undefined.
I'm not sure why it's undefined (especially since intellisense is completing it for me) or how to go about defining it.
I also tried this because it seemed like it covered all the bases, not just isNull():
https://stackoverflow.com/a/5515349/8767826
and I put an alert() inside the if and I didn't get an error, but my alert didn't fire either.
The end goal is to get it to change to a zero on the client side if they leave do leave it blank.
Anyway I'm kind of stumped and I appreciate any help anyone can offer.
Thanks
There's no need for an isNull function; you can check
if (UserInput === null)
isNaN exists because NaN, unlike every other value in JavaScript, is not equal to itself.
But null doesn't mean the field is blank! If the field is blank, its value will be the empty string. Check for that instead:
if (UserInput === '')

Google Apps Script - Retrieving username

This will hopefully be an easy one for you experienced developers. I'm trying to use the Google Apps Script service to get the username of the logged in user for my Google Site. I can get the email to display fine, however when I try to use the substring method to shorten to the username I get the follow error.
TypeError: Cannot find function substring in object email#email.com. (line 4, file "getusername")
I understand why I'm getting this error but not sure how to fix it. Below is my code
function doGet() {
var userEmail = Session.getEffectiveUser();
var username = userEmail.substring(0, userEmail.indexOf("#"));
var HTMLString= "<body> <h2> Logged in as " + userEmail +",</h2></body>";
HTMLOutput = HtmlService.createHtmlOutput(HTMLString);
return HTMLOutput
}
I'm guessing that because the variable userEmail is dynamic depending on the logged in user, the variable username is unable to see the email address until it has executed ?
Any help would be greatly appreciated.
Complete Javascript newbie here.
Thanks
Jack
Change:
var userEmail = Session.getEffectiveUser();
to:
var userEmail = Session.getEffectiveUser().getEmail();
If you look at the documentation for Session.getEffectiveUser(), you'll see what the "return" is. I never paid much attention to that for a long time. But, you need to always know what is returned. Some return types are: string, or an object, or an integer, or a Class. Depending upon what is returned, that will determine what you can further do. Lots of beginners notice that there is a period in between things, and are able to figure out that they need to patch things together with a period. But they don't really know what that period is for. That period is called a dot operator, and every place there is a "dot operator" is basically another step in a process. You're "chaining" multiple operations together. In the code: Session.getEffectiveUser().getEmail() there are two periods (dot operators) and two separate things happening, each with a different returned value. The getEmail() method returns a string. The documentation states that getEffectiveUser() returns a "User" But if you go to the documentation for "User" you'll see it described as a "Class". To understand what a "Class" is, you'll need to do some research.

Protractor - TypeError: undefined is not a function

This question serves two purposes, to try to solve this specific error and to try to understand protractor best practices. So, I have the following failing code for the test:
var newRow = element.all(by.repeater("employee in ec.employees")).last();
newRow.then(function(row) {
row.findElements(by.tagName("td")).then(function(cells) {
expect(cells.get(0).getText()).toBe("9988776655000");
expect(cells.get(1).getText()).toBe("Test name");
expect(cells.get(2).getText()).toBe("Test surname");
});
});
The reason:
TypeError: Undefined is not a function
and it's pointing to the 2nd row of code newRow.then(...).
My relevant HTML:
<tr ng-repeat="employee in ec.employees">
<td>{{employee.jmbg}}</td>
<td>{{employee.name}}</td>
<td>{{employee.surname}}</td>
</tr>
Now, I've already seen dozens of posts for this error on SO, but all are specific and as far as I could find there wasn't one similar to my case.
So, other than the question of why my code doesn't work, I wanted to ask was it better to use ElementFinder.findElement/s function, or is there an alternative?
The element.all(...).last() returns an ElementFinder, so you cannot use it like a promise. Change your code to find the elements directly on the newRow variable. Here's how -
var newRow = element.all(by.repeater("employee in ec.employees")).last();
newRow.findElements(by.tagName("td")).then(function(cells) {
expect(cells.get(0).getText()).toBe("9988776655000");
expect(cells.get(1).getText()).toBe("Test name");
expect(cells.get(2).getText()).toBe("Test surname");
});
Hope this helps.
Since you are using bindings in the tags I would recommend looking for those instead of grabbing the rows themselves. This way if you change the order of the rows in the future or add additional ones the tests are less likely to break. Try something like the following:
var newRow = element.all(by.repeater("employee in ec.employees")).last();
newRow.then(function(row) {
expect(row.element(by.binding('employee.jmbg'))).toBe('9988776655000');
expect(row.element(by.binding('employee.name'))).toBe('Test name');
expect(row.element(by.binding('employee.surname'))).toBe('Test surname');
});
If you have an Angular directive, binding, repeater, model or a specific css path that you can target you should try and utilize them in your selectors to make your tests more reliable. I would also look into creating PageObjects for your tests to reduce the amount of repeated code that can appear in your tests.

Passing variable to getElementById()

I must be overlooking something simple here. I cant get getElementById() to act on the variable passed to it.
function newforminput() {
var jsonstring = JSON.parse(document.getElementById('jsonobj').innerHTML);
var numfields = jsonstring.tracelog.fields.length;
for (var i=0; i<numfields; i++){
var field = i+jsonstring.tracelog.fields[i].name;
if (jsonstring.tracelog.fields[i].dependantfield != "---"){
document.getElementById(field).readOnly = true;
}
console.log(field);
}
}
console.log returns the correct ID of the div i want to affect, but the console tells me document.getElementById(field)... is null. Why is it not receiving the variable?
I'v seen a lot on this, but nothing seems to be working for me.
console.log(field) renders "1SectionName" - or whatever else its required to. If the element wasnt created yet, wouldn't the error be document.getElementById(1SectionName)... is null? That is, if the variable was being passed.
you were so right. A syntax error was prohibiting the id of the element from being created, so no element of that id existed hence the null error. Sorry for wasting your time due to a syntax error, but your input certainly helped me analyze my code more intelligently. Thanks for not ridiculing seemingly simple mistakes (as i often witness elsewhere) and providing meaningful insight for us newbies. thanks again!!!

Categories

Resources