<input type="text" class="form-control input-lg" id="name" placeholder="Insert Your Name Here" ng-model="form.Name" required>
I have a model called as above. I'm trying to validate the text after it's inputted. I've seen other similar examples but nothing is working for me. I'm trying to test it with this setup. I end up getting
Expected null to equal 'Your Inputted Text'
In Page Object File.
this.formInput = element(by.model('form.Name'));
In Testing File.
setup.formInput.sendKeys('Jim');
setup.formName.click().then(function () {
expect(setup.formInput.getAttribute('form.Name')).toEqual('Jim');
});
How can I capture / confirm the text that was entered?
setup.formInput.getAttribute('value')
Not tested. But I am hoping that will return you the text you want
Related
I need to locate and input text into the text field with the following HTML with Selenium:
<input slot="input" class="form-control" id="abc-gib-input-38303-70ft6l7k2g" aria-invalid="false" aria-required="true" aria-labelledby="label-abc-gib-input-38303-70ft6l7k2g label-abc-form-38302-42pti7lz8z" aria-describedby="help-text-abc-gib-input-38303-70ft6l7k2g feedback-abc-gib-input-38303-70ft6l7k2g feedback-abc-form-38302-42pti7lz8z help-text-abc-form-38302-42pti7lz8z" type="text" placeholder="" name="login" autocomplete="off">
The problem is each time page reloads the id changes - this part remains the same "abc-gib-input-38303-".
How to select this element?
I tried:
await driver.findElement(By.xpath('//*[contains(#id,"abc-gib-input"]'))
and it does not work.
You are missing a closing bracket ) in your XPath expression.
Instead of
await driver.findElement(By.xpath('//*[contains(#id,"abc-gib-input"]'))
It should be
await driver.findElement(By.xpath('//*[contains(#id,"abc-gib-input")]'))
I am new to selenium. And I wanted to select checkboxes in my webpage using selenium webdriver, by getting the data from a local excel sheet. I achieved this for all the radio buttons, but these checkboxes I wanted to select has no 'id' attribute. They are distinguished only by 'value'.
The HTML code is:
<input type="hidden" value="1" name="%%Surrogate_Competitors"/>
<label>
<input type="checkbox" title="Competitors" value="HP (Servers)" name="Competitors"/>
HP (Servers)
</label>
<br/>
<label>
<input type="checkbox" title="Competitors" value="Sun (Servers)" name="Competitors"/>
Sun (Servers)
</label>
<br/>
<label>
<input type="checkbox" title="Competitors" value="HP (Storage)" name="Competitors"/>
HP (Storage)
</label>
<br/>
............
............
I tried using this code to select those checkboxes:
String Competitors=sh.getCell(column,1).getContents();
String delims = "[,]";
String[] Competitor = Competitors.split(delims);
for(int i=0;i<Competitor.length;i++) {
//to select competitors
driver.findElement(By.cssSelector("input[value="+Competitor[i]+"]")).click();
}
when I run this code, an error message is getting generated as below:
The given selector input[value=HP (Storage)] is either invalid or does
not result in a WebElement.
Please let me know how to overcome this, and get the check boxes selected.
please check the css identifier, you may need to add quote for the value:
driver.findElement(By.cssSelector("input[value='" + Competitor[i] + "']"))
This stack post must be helpful
I have a form made with angular, one of the inputs is autocompleted with google maps. The problem is that if I write "Mad" and the autocomplete fills it with "Madrid" when the form is sent there is only "Mad" instead of "Madrid" and the same for longer addresses.
I had a similar problem autofilling the latitude and longitude obtained with the place of the autocomplete, but I solved it. I tried the same with the autocomplete input and is not working.
This is part of my form:
<fieldset class="form-group">
<input ng-model="newCtrl.event.formatted_addres" type="text"
ID="location-placheholder" class="form-control"
placeholder="Where will be the event?"
title="Location" required />
</fieldset>
<fieldset ng-show ="false" class="form-group">
<input ng-model="newCtrl.event.longitude" type="float"
ID="location-longitude" class="form-control"
title="Location-longitude" required />
</fieldset>
<fieldset ng-show ="false" class="form-group">
<input ng-model="newCtrl.event.latitude" type="float"
ID="location-latitude" class="form-control"
title="Location-latitude" required />
</fieldset>
and this is the autocomplete function for the formatted_address field:
function setupAutocomplete(){
var input = $('#location-placheholder')[0];
var autocomplete = new google.maps.places.Autocomplete(input);
autocomplete.addListener('place_changed', function(){
var place = autocomplete.getPlace();
var infowindow = new google.maps.InfoWindow({
});
if (place.geometry.location) {
$("#location-longitude").val(place.geometry.location.lng().toFixed(7));
$("#location-longitude").trigger('input');
$("#location-latitude").val(place.geometry.location.lat().toFixed(7));
$("#location-latitude").trigger('input');
$("location-placeholder").val(place.formatted_address);
$("location-placeholder").trigger('input');
map.setCenter(place.geometry.location);
createMarker(place.geometry.location, place.formatted_address);
} else {
alert("The place has no location...?")
};
});
};
When I do
$("#location-latitude").val(place.geometry.location.lat().toFixed(7));
$("#location-latitude").trigger('input');
The input of latitude fills correctly and is sent correctly, but if I do:
$("location-placeholder").val(place.formatted_address);
$("location-placeholder").trigger('input');
It keeps sending only the part of the address that I have already written, not the rest of the address filled with the autocomplete.
Thanks
I add a fiddle with my code, I've been trying to make it work without the $http requests, but I couldn't. So I hope this is enough to evaluate my code.
http://jsfiddle.net/sjc7jtbp/1
Finally I solved it, for some reason ajax was not targeting the input. So I created a new input hidden with ng-show="false" and I labelled it as class="autofill".
So later I aimed at it as $('.autofill') and it worked. The rest is submit this input and not the original one. Maybe it is not an elegant solution, but it works.
I need a form to show an error when it is dirty and is invalid according to a regex pattern how ever this does not seem to work. even though the invalid class is there when checked from inspect element
<form name="billingAddress">
<input type="text" ng-model="billingAddress.firstName" name="firstName" ng-pattern="nameRgx" required/>
<label ng-show="billingAddress.firstName.$invalid && billingAddress.firstName.$dirty">Invalid</label>
</form>
plunkr
please check this plunker i fixed your problem.
you need different form name like,
<form name="billingAddressx">
<label ng-show="billingAddressx.firstName.$invalid || billingAddressx.firstName.$error.required">Invalid</label>
here billingAddressx.firstName.$invalid check invalid state of the input by considering
form name = billingAddressx
input name = firstName
I am trying to check the name of the file before the user hits submit. Can I get the filename like we get the content of the input field?
Something like:
<input name="posterTitle" type="text" ng-model="posterTitle">
{{posterTitle}}
Similarly in:
<input name="posterFileName" ng-model="posterFileName" type="file" />
Using Angularjs you might need to use an onchange event to bind the input name inside controller. see the example :
<input name="posterFileName" type="file" onchange="angular.element(this).scope().fileName(this)"/>
Inside controller
$scope.fileName= function(element) {
$scope.$apply(function($scope) {
$scope.posterTitle= element.files[0].name;
});
};
Hope this will help.
a couple of links I've found that may help a bit:
http://api.jquery.com/file-selector/
jQuery: get the file name selected from <input type="file" />
for example, sing name or ID attribute:
$('input[type=file]').change(function(e){
$in=$(this);
$in.next().html($in.val());
});