Kendo UI MVVM

11 posts, 0 answers
  1. Wayne Hiller
    Wayne Hiller avatar
    47 posts
    Member since:
    Sep 2005

    Posted 10 Oct Link to this post

    I am using Kendo UI MVVM in my site. I am building tests with the Testing Framework.

    I find the HtmlInputControl and assign the Value, I can see it fill in on the page.

    I then call input.InvokeEvent( ScriptEventType.OnBlur ); to try and force the Kendo MVVM to assign the value to the model.

    It does not seem to work for plain inputs (type=text) or textarea's. Kendo UI ComboBox, Autocomplete, NumbericInput do work with the above process.

    Any ideas?

     

     

     

     

     

  2. Wayne Hiller
    Wayne Hiller avatar
    47 posts
    Member since:
    Sep 2005

    Posted 10 Oct in reply to Wayne Hiller Link to this post

    Well as is always the case I figured it out 2 seconds after I created this post lol. In needed a change event too.

                input.InvokeEvent( ScriptEventType.OnChange );
                input.InvokeEvent( ScriptEventType.OnBlur );

     

  3. Elena Tsvetkova
    Admin
    Elena Tsvetkova avatar
    654 posts

    Posted 12 Oct Link to this post

    Hello Wayne,

    Great to know you managed to resolve this on your own and sharing what you have found. In case of any further questions do not hesitate to contact us again! Thanks! 

    Regards,
    Elena Tsvetkova
    Progress Telerik
     
    Quickly become an expert in Test Studio, check out our new training sessions!
    Test Studio Trainings
     
  4. Wayne Hiller
    Wayne Hiller avatar
    47 posts
    Member since:
    Sep 2005

    Posted 12 Oct in reply to Elena Tsvetkova Link to this post

    Well it turns out my code only works in Firefox when working with Kendo DropDownLists. I changed to the code to:

     

    public static KendoInput SetKendoInput( this Browser browser, HtmlFindExpression expression, string cls, string value ) {
                var control = browser.Find.ByExpression<HtmlControl>( expression );
                Assert.IsNotNull( control, $"Element \"{expression}\" not found" );

                do {
                    control = control.Parent<HtmlSpan>();
                } while( !control.CssClass.Contains( cls ) );

                KendoInput input = null;
                if( control != null ) {
                    input = control.BaseElement.As<KendoInput>();
                }

                if( input != null ) {
                    input.InputValue = value;
                    input.InvokeEvent( ScriptEventType.OnChange );
                    input.InvokeEvent( ScriptEventType.OnBlur );
                }

                return input;
            }

     

    I can see the value get assigned to the DropDown when running a test but when I do Validation client side before posting I get a "Required" validation error like the value was never assigned to the "original html" input.

    Should I be calling the Onchange/OnBlur on something else? 

     

     

  5. Wayne Hiller
    Wayne Hiller avatar
    47 posts
    Member since:
    Sep 2005

    Posted 12 Oct in reply to Wayne Hiller Link to this post

    Actually I just noticed that my Validation error is happening server side. So the code I listed above is not forcing the Kendo MVVM to post the value from the control to the model. Should I call the OnChange/OnBlur on the original input maybe?
  6. Elena Tsvetkova
    Admin
    Elena Tsvetkova avatar
    654 posts

    Posted 17 Oct Link to this post

    Hi Wayne,

    Thanks for sharing all your findings. 

    Have you tried to invoke the events on the original input? Did this change the behavior? 

    Regards,
    Elena Tsvetkova
    Progress Telerik
     
    Quickly become an expert in Test Studio, check out our new training sessions!
    Test Studio Trainings
     
  7. Wayne Hiller
    Wayne Hiller avatar
    47 posts
    Member since:
    Sep 2005

    Posted 17 Oct in reply to Elena Tsvetkova Link to this post

    The only way I could get the things working was to use the HtmlInput.Text field and then fire the Onchange & Onblur events and only in Firefox. The Kendoxxxx.InputValue will not trigger the binding to assign the value to the model. The Kendoxxxxx.TypeText() works in some cases on some browsers but not all. I have my tests working in finrfox but unfortunately it is the slowest browser, wish we could use the new Developer version, much faster.

     

    It seems like posting the events that force the bindings to assign the value to the model when assigning to the InputValue should be built into the KendoXxxxxx wrappers. I like assigning the value directly because then the mouse is never involved and it is faster.

     

     

  8. Elena Tsvetkova
    Admin
    Elena Tsvetkova avatar
    654 posts

    Posted 20 Oct Link to this post

    Hi Wayne,

    Thank you for getting back. 

    It seems that the controls are different in the different browsers. Obviously OnBlur and OnChange are working fine in Firefox but in Chrome probably the JavaScript events are not the same. This is the reason for the observed behavior.

    Though using the desktop actions are working fine as you have mentioned at the beginning. I understand it is not the optimal speed for execution but the approach is unified for all browsers and works as expected. 

    I hope this will be helpful to you. Thanks! 

    Regards,
    Elena Tsvetkova
    Progress Telerik
     
    Quickly become an expert in Test Studio, check out our new training sessions!
    Test Studio Trainings
     
  9. Wayne Hiller
    Wayne Hiller avatar
    47 posts
    Member since:
    Sep 2005

    Posted 20 Oct in reply to Elena Tsvetkova Link to this post

    Ok that makes sense.  I have it working pretty well in Firefox for what I need on my dev machine. When running on the automation machine I can set it to use the TypeText method instead. Even when using the TypeText method I had problems with the KendoNumericTextBox not working (Not posting the value to the model) when running in InternetExplorer.

     

    I also have some issues with the DialogMonitor not working every time.  Is there an example somewhere that shows how it should be used?

    I will keep on testing things.

     

  10. Wayne Hiller
    Wayne Hiller avatar
    47 posts
    Member since:
    Sep 2005

    Posted 20 Oct in reply to Elena Tsvetkova Link to this post

    Actually it was pretty simple to solve.

    input is a KenoInput.

    input.InputValue = value;

    input.CallMethod<string>( "trigger('change')" );

  11. Elena Tsvetkova
    Admin
    Elena Tsvetkova avatar
    654 posts

    Posted 24 Oct Link to this post

    Hello Wayne,

    Thanks for sharing the solution. I am glad to know that works now for you! 

    Regards,
    Elena Tsvetkova
    Progress Telerik
     
    Quickly become an expert in Test Studio, check out our new training sessions!
    Test Studio Trainings
     
Back to Top