Cannot simulate real typing into ASP.NET MVC and jQuery Kendo drop down filter

5 posts, 1 answers
  1. Yan Jun
    Yan Jun avatar
    36 posts
    Member since:
    Jan 2019

    Posted 04 Nov 2019 Link to this post

    Hi all,

    I am currently facing issue to automate selecting drop down option after entering text into Kendo drop down filter for ASP.NET MVC and jQuery.

    In recording the test case, I successfully entered text into the drop down list filter and select filtered option accordingly.

    However, when I executed the test case, the options will not be filtered based on the entry and the option is not selected as per recorded.

    So I tried to turn on the "SimulateRealTyping" setting in the test step.

    When I executed the test case again, there were no texts entered into the drop down filter at all.

    The problem is found in AUT. To reproduce the issue, I tried it on the Kendo Demo page.

     

    Please find in the attachment is the recorded test case with the following scenarios:

    1. Click on drop down list and enter "chang" into the filter with NO "SimulateRealTyping"

    2. Click on drop down list and enter "aniseed syrup" into the filter WITH "SimulateRealTyping"

     

    I tried to see if I do keypress "Down" after entering text into filter will help to select filtered option correctly, but it still failed to do so.

    Is this issue related to the translators available in Test Studio at the moment?

    Can anyone help to solve or advise on this issue?

    Thank you in advance.

    Regards,

    Yan Jun

  2. Yan Jun
    Yan Jun avatar
    36 posts
    Member since:
    Jan 2019

    Posted 04 Nov 2019 in reply to Yan Jun Link to this post

    Yan Jun said:

    Hi all,

    I am currently facing issue to automate selecting drop down option after entering text into Kendo drop down filter for ASP.NET MVC and jQuery.

    In recording the test case, I successfully entered text into the drop down list filter and select filtered option accordingly.

    However, when I executed the test case, the options will not be filtered based on the entry and the option is not selected as per recorded.

    So I tried to turn on the "SimulateRealTyping" setting in the test step.

    When I executed the test case again, there were no texts entered into the drop down filter at all.

    The problem is found in AUT. To reproduce the issue, I tried it on the Kendo Demo page.

     

    Please find in the attachment is the recorded test case with the following scenarios:

    1. Click on drop down list and enter "chang" into the filter with NO "SimulateRealTyping"

    2. Click on drop down list and enter "aniseed syrup" into the filter WITH "SimulateRealTyping"

     

    I tried to see if I do keypress "Down" after entering text into filter will help to select filtered option correctly, but it still failed to do so.

    Is this issue related to the translators available in Test Studio at the moment?

    Can anyone help to solve or advise on this issue?

    Thank you in advance.

    Regards,

    Yan Jun

    UPDATE: Tried to execute test step using "blind" keyboard typing as per suggested in the documentation and it successfully typed into the filter box and select drop down items accordingly.

    Can this issue be solved without using code? If every drop down in the AUT needs code to select options, the test case will be very hard to maintain.

    Please kindly advise.

    Thank you.

    Regards,

    Yan Jun

  3. Answer
    Plamen Mitrev
    Admin
    Plamen Mitrev avatar
    174 posts

    Posted 07 Nov 2019 Link to this post

    Hi Yan Jun,

    I analyzed the sample test, against the demo application and I got it to work by changing some test step properties. Please find more details, on what I did, below, along with the attached modified test.

    • You had the right idea to enable SimulateRealTyping for the Enter text step, which triggers the events in this control. In this particular case, the application under test has a static header and when the test scrolls the input field to the top of the page, it is actually under that header. The way around this issue is to change the ScrollToVisibleType property for that step to "ElementBottomAtWindowBottom" and that will try to scroll the input to the bottom of the page.
    • After the text is successfully entered, there is some load time and the execution delay is perfect for this scenario. I found that even 2 000 msec is enough for the filtering.

    Another way to select an item from the dropdown list, is to record a click against against that element. This might require your to adjust the element's find expression, because it has dynamically changing ID. I found that using the TextContent is stable and does not require your to enter text in the filter.

    Please check the above suggestions and the attached test, which automates this scenario without using a coded step. If you need any additional help or details, do not hesitate to contact us again.

    Regards,
    Plamen Mitrev
    Progress Telerik

     
    The New Release of Telerik Test Studio Is Here! Download, install,
    and send us your feedback!
  4. Yan Jun
    Yan Jun avatar
    36 posts
    Member since:
    Jan 2019

    Posted 07 Nov 2019 in reply to Plamen Mitrev Link to this post

    Hi Plamen,

    Thanks for the detailed explanation. I have tried option 1 by setting ScrollToVisibleType to "ElementBottomAtWindowBottom" when enabled SimulateRealTyping, it works for the AUT and successfully chose the wanted option. However, I noticed that, upon test step of keyboard entry "enter" after entering text "aniseed syrup" into the filter, the drop down list will be closed and it take 2 to 3 seconds to change from "Chai" to "Aniseed Syrup". Is this behaviour expected and considered normal? Will this somehow cause wrong selection at one point if there is no execution delay in the test case?

    As for option 2, the AUT has quite a lot of drop down lists and there are quite some options in the drop down list (e.g. a drop down list to select available users in the system, so there might be a lot of users). To us, it seems like it is the fastest and easiest way to select the exact correct option through the filter. Previously I have sent in a feature request to have "data driven" feature for jQuery Kendo drop down just like what is available now for Angular Kendo. Probably this feature request will offer better help instead of always editing into all drop down options on Text Content?

    Also, would like to ask if all the keyboard entry (e.g. enter, up and down) can only be added into test case through recording? I find myself not able to add keyboard entry (e.g. enter and down) on a specific element through Step Builder. Will there be an option to do this through Step Builder in the future?

    Thank you.

    Regards,

    Yan Jun

  5. Plamen Mitrev
    Admin
    Plamen Mitrev avatar
    174 posts

    Posted 08 Nov 2019 Link to this post

    Hello Yan Jun,

    I am happy to know that the suggested approach and configurations work for you as well. 

    The dropdown actually collapses after any action inside or outside of the application/browser. It is expected to see it close after the keyboard entry "enter" from my perspective. In addition to that, it might need some time for the Java Script to update the selected dropdown value. You are absolutely correct that you might need to add an execution delay step, if that causes the test to fail or misbehave. Although, if the next steps are against another element that already exists on the page, there should be no issues.

    I understand that selecting an element with click action might not be applicable for every scenario and application. I recorded a simple scenario that toggles the dropdown and click on one of the listed items. The important note here is that you need to verify that the element's find expression will identify the correct element in a unique way (see attached screenshots). Here comes the option to data drive the find expression, which is a possible workaround for you. Otherwise, the feature request is valid and I agree with you on that.

    The keyboard actions are not actually executed against a specific element in the application. They are desktop commands that Test Studio sends to the active browser instance. Such actions can be added in a coded step at any point in your test and here are more details on how to invoke keyboard typing.

    I hope the above information is helpful to you and you can continue optimizing your tests and make them more stable.

    Thank you for your feedback and cooperation in this discussion.

    Regards,
    Plamen Mitrev
    Progress Telerik

     
    The New Release of Telerik Test Studio Is Here! Download, install,
    and send us your feedback!
Back to Top