I'm running a proof of concept using TestCafé for automating browser testing an web app we're developing. Our web app uses the KnockoutJS framework for handling and displaying the data, whereas a server on the back-end is used for persistency, validations, etc.
Currently I'm implementing a test that fills out one of the forms in our application. This form consist of multiple pages, transitions between which are enable through a button ('Next'). Some of the fields in this forms contain validations. These validations are handled in the back-end and are therefore submitted on refresh. This refresh is triggered once the field is left.
Unfortunately, I'm experiencing an issue while running the test. It seems that the test keeps hanging once the 'Next' button is clicked after filling a field with a validation, whereas I would expect that the test navigates to the next page in the application. I'm using these commands in sequence:
The test does continue, and succesfully completes, if I click the 'Next' button twice after filling a field that contains a validation. This, however, does not feel good to be as they are unnecessary test actions. I ran the test in debugging mode and noticed in the network traffic that during the test the
handleEvent action for validation of the field is triggered only on button click, whereas it is handled directly if performing the scenario manually. This probably has to do with the speed of the test. Altering the speed, however, did not do much for the test. In the test, the
handleEvent action representing the button click is only performed after the second button click.
What seemed to work was to first click outside the field (for example on the
h1 on the page) before clicking the 'Next' button. This workaround, however, did not seem to be too elegant to me either. I was therefore wondering if there is any other way in which I can get outside a field (after the
typeText action but before clicking the 'Next' button) in order to trigger the
handleEvent action for the validation of the field before continuing navigation in the application.