Selenium wait until textbox value change - selenium-webdriver

I came across a situation, on selecting combobox value textbox value changes. I need to wait until textbox change to a particular value. I have tried wait.Until, please help me in solving this issue.

If you already knows the value, which going to reflect in the text box after the combo box change. Then you could create a xPath like.
//*[contains(text(),'Expectedvalue']
Then create a method for checking whether that xPath is available or not.
public boolean isElementPresent(String xPath)`
{
try
{
this.driver.findElement(By.xpath(xPath);
return true;
}
catch()
{
return false;
}
}
Then you can check using while loop
`//Do the code for changing combo box value
while(isElementPresent("//*[contains(text(),'Expectedvalue']")
{//do the necessary actions}`

//Assume the Combo box is edited also the Text box is visible
while(! driver.findElement(By.xpath("textboxXpath")).getText().equalsIgnoreCase("expected value"))
{
System.out.println("waiting for text to be loaded");
}
end of this loop, the text box must be loaded with expected value
Caution:
This may lead you to infinite execution. implement with a limitation.

while(! driver.findElement(By.id("id_of_combo_box")).getAttribute("value").equals("Expected Value"))
{/*Loops till value is written*/}
Here we loops till the value of the combo box equals expected value.

Related

How to set the value a second time in a text box using selenium if it doesnt get set properly the first time?

On the application I work , after tabbing out of every field, there is an AJAX call , some blue spinner at the bottom . If we enter text in a field while the spinner is present , field doesnt retain its value , is it possible to to write some while loop or something ...
which checks whether value has been set properly or not otherwise re enter it
Thanks
I have tried
Send Keys
Javascript Executor
But they dont work
Try this:
if(element.getAttribute("value").isEmpty() == true) {
((JavascriptExecutor) driver).executeScript("arguments[0].value='someInputText';", element);
}

spanlabel component does not display all the text

I'm trying to show text with SpanLabel, but this component does not display all the text if there is line break. I then try it with TextArea and Label UIID, but the result is the same. Can someone help me on this issue? Thanks
I am having the same problem here. I use the SpanLabel inside a Dialog and the last one or two lines are always cut off.
It only happens when I use the setPreferredW property:
spanLabelDialog.setPreferredW(Display.getInstance().getDisplayWidth()-300);
Is this intended?
Somehow the setMargin property doesn't work for the dialog, neither hard-coded, nor in CSS.
Here is my code:
private void dialolg () {
String longText = "'There should be the whole text displayed here, but it seems the last one or two lines always get cut off'";
spanLabelDialog.setText(longText);
dialogExplain.add(BorderLayout.CENTER, spanLabelDialog);
spanLabelDialog.setUIID("SpanLabelDialog");
spanLabelDialog.setTextUIID("SpanLabelDialog");
spanLabelDialog.setPreferredW(Display.getInstance().getDisplayWidth()-300);
dialogExplain.show();
}

Is there an easier way to get the (first) Parsley.js focusedField element after validation?

Is there an easier way to get the (first invalid) Parsley.js focusedField element after validation?
My code below works, but I am looking for an easier/better way to retrieve that element.
When form:error occurs, the Parsley formInstance._focusedField object contains this information, but console.log(formInstance._focusedField) always returns undefined.
My issue: I have some semantic ui dropdown (styled select boxes) which are not receiving focus() because they are hidden. (i.e. The form does not jump to the first error field if the select is hidden)
Each ui dropdown auto generates an input element for user searching, so if the element is('select:hidden'), I focus on the next closest input.
For this example i have data-parsley-focus="none" set on the form.
window.Parsley.on('form:error', function(formInstance) {
for (var i = 0; i < formInstance.fields.length; i++) {
var field = formInstance.fields[i];
if (true !== field.validationResult && field.validationResult.length > 0 && 'undefined' === typeof field.options.noFocus) {
var focusedField = field.$element;
if ($(focusedField).is('select:hidden')) {
$(focusedField).parent().find('input').focus();
} else {
$(focusedField).focus();
}
\\focus on first invalid element
break;
}
}
});
Direct answer:
You could listen to form:validate, and clear a variable firstField, and set that variable on field:error if it's not already set.
Better answer:
The actual problem is that focus() on the hidden field doesn't work. I'd suggest you fix that instead of hacking parsley... Find these hidden inputs, listen for focus on them and "redirect" the focus correctly.
Ultimate answer:
Fix the problem for everyone. Since Semantic UI replaces an input with a different UI element, it would make sense (in my mind at least), if it did the focus redirection itself... If you make a PR, let me know and I'll +1 it!

ng-options creates an empty option at the end when listbox group heading is clicked

I am stuck on this particular issue with ng-options. I am creating a listbox with option grouping:
<select ng-model="selTemplates" size="3" style="width: 150px"
ng-options="template.Name group by template.Type for template in userTemplates">
</select>
When I click on a group heading (Type1 or Type2), Chrome creates an empty option at the end and marks it selected. I believe it has something to do with the selection because it may not find anything 'selected' when a header is clicked, but an empty value at the bottom is not desired.
Please see the fiddle here.How can i fix it?
(The code works fine in IE9, although not sure why the fiddle doesn't)
ng-options adds empty option if case if value currently bound by ng-model doesn't exist in list of options. This prevents from overwriting value due bounding to empty select (this is an often problem in for example knockoutjs).
Clicking option group clears selection and empty option added.
You can see it if add debug <div>{{selTemplates}}</div> below select list.
Also even static select with size or multiple attribute specified clears its selection on clicking option. If size is omitted (for regular dropdown) clicking optgroup doesn't clears selected value.
I'm not sure if this browser inconsistence or expected behavior (if you said it works in IE) but consider replacing select with custom HTML emulates list selection.
Looks like inconsistent browser implementation is the reason. On clicking option header, Chrome clears out the selection whereas IE doesn't, that's why Chrome inserts a new empty row at the bottom.
As a workaround, I am saving last selected value in a variable, and in case user clicks on header (which will make selection null), I am restoring the last selection. See fiddle. Not exactly pretty, but gets the work done.
$scope.checkSelection = function() {
if ($scope.selTemplates == null) {
$scope.selTemplates = last;
}
else {
last = $scope.selTemplates;
}
}
Add ng-init="selTemplates=userTemplates[0]" in your <select>
You can remove "$scope.selTemplates = ***" in your controller

ExtJS 4 ComboBox AutoComplete

I have an extjs combobox used for auto-complete having following configuration:
xtype:'combo',
displayField: 'name',
valueField:'id',
store: storeVar,
queryMode: 'remote',
minChars:2,
hideTrigger:true,
forceSelection:true,
typeAhead:true
There are two issues being faced by me:
a. If a user chooses a value from the list returned from server, but later wants to remove that value and keep combo-box empty, then also the old values re-appears on blur, not allowing combo-box to remain empty. How can I allow empty value in this combo-box in such a case? I understand it could be due to forceSelection:true, but then I need to keep it true as otherwise user can type any random value.
b. When the server returns an empty list, I want to display a message - No Values Found. I tried doing this, by putting this value in the displayField entity, i.e., {id:'', name:'No Value Found'}. But then in this case, the user is able to choose this value and send it to server which is not what is expected. Thus, how can I display the message for empty list?
Could someone please throw light on this?
For the issue related to forceSelection in the question above, following is the hack created which can serve the expected purpose:
Ext.override(Ext.form.field.ComboBox,{
assertValue: function() {
var me = this,
value = me.getRawValue(),
rec;
if (me.multiSelect) {
// For multiselect, check that the current displayed value matches the current
// selection, if it does not then revert to the most recent selection.
if (value !== me.getDisplayValue()) {
me.setValue(me.lastSelection);
}
} else {
// For single-select, match the displayed value to a record and select it,
// if it does not match a record then revert to the most recent selection.
rec = me.findRecordByDisplay(value);
if (rec) {
me.select(rec);
} else {
if(!value){
me.setValue('');
}else{
me.setValue(me.lastSelection);
}
}
}
me.collapse();
}
});
This needs to be included after library files of extjs have been included.
For the other issue of message to be shown at No Values Found - emptyText - works fine as suggested by Varun.
Hope this helps somone looking for something similar.
I've done this for Ext JS 3.3.1. I don't know if they apply to Ext JS 4, though I guess they should.
For the first problem, set autoSelect : false. autoSelect is by default set to true. This will work only if allowBlank : true is set. From the docs
true to select the first result gathered by the data store (defaults
to true). A false value would require a manual selection from the
dropdown list to set the components value unless the value of
(typeAheadDelay) were true.
For the second problem, use listEmptyText. From the docs
The empty text to display in the data view if no items are found.
(defaults to '')
Cheers.

Resources