Canvas App Automated UI Testing

Automated UI testing is a must in modern enterprise applications. Regression testing become necessary as your applications increase in complexity and get constantly modified. The good news is, unlike model driven apps that require EasyRepro or Selenium based frameworks to test them, Canvas apps have been built from the ground up with testing in mind.

In this post we’ll have a quick look at how easy it is to set up and run automated UI regression testing for Canvas apps. But here is a video summarising how you can achieve this in less than 60 seconds.

The App

For demonstration purposes we have simple app that takes a text input and populates a label and a toggle that shows/hides the input field. Simple!

Getting Started

To author your test cases, within your click on Advanced Tools on the left navigation followed by Test (experimental)

Once in, the easiest way to start is to record your steps to generate the skeleton code using the record button.

Test Case

Our test will cover the following steps:

1. Type “Test” in the input field
2. Toggle the switch off
3. Toggle the switch on

Enriching your Test Scenario

The recorded steps are a good start and will save you time when building your test case. The next step is to enhance the test and add the assert statements.

First set a variable called InputValue to “Test”.

Set(InputValue, “Test”)

This variable will be used to set the input text field content (instead of coding it in the SetProperty statement) and for the assert statement.

SetProperty(TextInput.Text, InputValue)
Assert(Label.Text = InputValue, “Label text should be ” & InputValue)

Then add 2 assert statements after each toggle to ensure the input field is hiding/show.

Assert(TextInput.Visible = false, “Input field must be hidden”)
Assert(TextInput.Visible = true, “Input field must be visible”)

Your final result will look like the following

…and you are done! Easy! Click on the play button and run your test case.
You can now create more cases within your suite or you can even create more suites all together.

Next Steps

In a future post we will integrate the automation within a DevOps pipeline for automated regression testing.