Hello,
I looked at the forum but did not found any answers so I try to ask the question here !
I am experiencing an issue with one of my test suite.
I try to fill a text box during a test with the Fill Text keyword.
It appears that keyword returns without error , but at the end, text is not filled.
If I use a horrible Sleep 1s before Fill Text, then it goes well
Here is the element I try to fill :
In my test I use : Fill text css=[name=“name”] MyName
Sorry Here is the element I try to fill <input type="text" formcontrolname="name" placeholder="Add a name to the action" name="name" class="form-control ng-pristine ng-valid ng-touched">
The classes on your input element hint that your application is using AngularJS, these “Web Frameworks” often do weird things and the input html element is not what the user actually interacts with and the javascript could be interfering with your input.
My first suggestion is to open the page manually in a browser then open the browser’s dev tools (usually F12) and use the inspect tool to click the field in the page that you would expect is this form input and check it actually is the same element?
If dev tools gave you the input element you expected, then the next thing to try is on the console tab of dev tools enter the following:
$x('//*[@name="name"]')
Does this return multiple results? if so is the field you are trying to update the first result?
As a bit of explanation the //*[@name="name"] is the xpath equivalent of your css selection the rest is just the way you can test an xpath in a browser.
I’m guessing what might be happening is there is another html element (possibly a ,
or ) that also has the name=“name” attribute and before the input and so fill text is trying to input text into that element.
If i’m right try:
$x('//input[@name="name"]')
and see if that brings back only 1 result?
if so then this might solve your problem:
Fill text css=input[name=“name”] MyName
But I don’t normally use the css selector so i’m not sure I got that right, I normally just use the xpath selector because I can easily check my xpaths in dev tools
Good. True. Thanks for asking. I’ve had the same problem, also with Angular/JS 7 app. It’s horrible. The developer told me to hook into the OnUpdate handler or some such ridiculous nonsense. The whole thing is just unreliable. In my case, attempting to fill text in a Search TextBox.
I get the element and then use Selenium keyword:
Input Text ${element} ${text}
but it did NOT work. I know you are looking for an answer and not my rant (too late) but this behavior spells doom, in my opinion, because we must bend over backwards for something as simple as setting the text property of a searchbox, that is a strong signal that we are using the wrong tool for the job.
Perhaps such tests really do belong in the JUnit work of Java invoked unit tests. Bottom Line: the automation does NOT work like you clicking around a browser.
In Selenium Library, I experimented, so excited to find a “Clear” argument to the Input Text because my code needed to clear-out the previous search term. I thought it was wonderful and that I had found the solution, but no such luck. It is a completely awful attribute of Angular/JS and the difference between a real human interacting via browser vs. our Robot automation.
My element has no name. Understanding selectors from among the Angular jumble has been a recurring nightmare for me. No names, no ids.
I tried console commands to interrogate, but not hits by “name”, yielded exactly nothing “[]” every time
$x('//*[@name="_ngcontent_koq-c13"]')
Here is the selector (for the Search box). I changed the Placeholder to express my feelings:
<div class="mat-form-field-infix"><input _ngcontent-koq-c13="" class="search-input mat-input-element mat-form-field-autofill-control cdk-text-field-autofill-monitored ng-pristine ng-valid ng-touched" matinput="" id="mat-input-0" placeholder="Search by major irritant" aria-invalid="false" aria-required="false"><span class="mat-form-field-label-wrapper"><!----><label class="mat-form-field-label ng-tns-c15-3 mat-accent ng-star-inserted" id="mat-form-field-label-1" for="mat-input-0" aria-owns="mat-input-0"><!----><!----><span class="ng-tns-c15-3 ng-star-inserted">Search by major irritant#</span><!----><!----></label></span></div>
Although I was able to Console-interrogate by matching the Placeholder text:
$x("//input[@placeholder='Search by major irritant']")
[input#mat-input-0.search-input.mat-input-element.mat-form-field-autofill-control.cdk-text-field-aut…]
but what does all this get me?
I was merely trying to Clear the text before entering. I gave up on that Selenium Clear argument and abandoned what I was doing and finessed pass the entire situation by ignoring it.
SeleniumLibrary . Input Text ${entitySearchPage_SearchTextBox_Input}, ${entitySearch_Value}
if at all possible can either of you give me a link to the page with the field you are having trouble with? it would make things a lot easier for me to try things for you.
Steve;
In your case I suspect that you need to replace the text in this span and then the javascript will update your input. <span class="ng-tns-c15-3 ng-star-inserted">Search by major irritant#</span>
I guess you could try a
Input Text //span[@class="ng-tns-c15-3 ng-star-inserted"] ${entitySearch_Value}
This may not work because selenium might not recognise it as an input, so you might need to do something like:
click element //span[@class="ng-tns-c15-3 ng-star-inserted"]
press keys //span[@class="ng-tns-c15-3 ng-star-inserted"] ${entitySearch_Value}
If the Javascript is set up the way I expect, the click element step should trigger the javascript to clear the field for you.
Actually on further investigation, I may be wrong about entering text into that span:
I found an angularjs demo site (Angular Formly Example) it looks like you can just interact with the inputs (see example below)
*** Settings ***
Library SeleniumLibrary
*** Variables ***
${AJS_SITE_1} https://output.jsbin.com/kunaho/47
${TextString} I want to enter some text here
*** Test Cases ***
AJS Site 1
Open Browser ${AJS_SITE_1} Chrome
Input Text css:[name="vm.form_input_text_0"] ${TextString}
@Sebplais Unfortunately Browser library is misbehaving on my machine, so I wasn’t able to test this example but try and see if it works for you:
*** Settings ***
Library Browser
*** Variables ***
${AJS_SITE_1} https://output.jsbin.com/kunaho/47
${TextString} I want to enter some text here
*** Test Cases ***
AJS Site 1
Open Browser ${AJS_SITE_1} chromium
Fill Text css=[name="vm.form_input_text_0"] ${TextString}
Hi Dave,
Thanks for you inputs,
I tried your suggestion in console and only got back 1 element
$x(’//*[@name=“name”]’)
[input.form-control.ng-pristine.ng-invalid.ng-touched]
unfortunately still got the issue using css=input[name=“name”]
It is strange , just using a sleep 10ms before fill text will solve the issue but I hate that solution
Unfortunately, I can not share the site as it is internal to my company,
Also … (bad luck) I can not test you sample as my company block the website used in the test
Then the script will only wait as long as it needs to, 1 or 2 ms if the page loads quickly and up to 10 sec (the default) if it loads slowly if 10ms is enough of a wait now then there should be no need to increase beyond the default.
This will also give you some history on how long the page takes to load for that time when the application starts being really slow (sorry that’s the performance tester in me)
Well,
by default (this is the power of Browser Lib) it is done by the keyword Fill Text itself, it wait for element to be visible before trying to fill text.
What is really weird, is that if I do a
Fill text css=[name=“name”] My text
get text css=[name=“name”]
it will pass and return My text, although nothing is filled in the UI
I’m not 100% sure but I think from reading the documentation that Fill Text is actually only waiting for the state of “attached” not “visible” and there can be a time difference between the 2 (I’ve been caught by this before)
You might need to play with different Element States to see which one works best for you.
