When it comes to excellent team performance and consistent high quality output there’s no doubt that automated testing is a vital part of achieving that.
In this post I want to share with you a simple 4-step system you can use to ensure the automated tests created by your testers are ready for your responsive UI’s.
1. Capture automation points on an average sized screen
When you are first capturing automation points we’ve found it best to use an average-sized device for your first round of capturing.
The most common screen resolution is 720×1280 but you can use any device with a resolution close to that.
The reason for this is simple, it helps with the responsive sizing calculations when it comes to bigger or smaller devices.
Examples
If you capture your automation points on an average device that’s 500x1000, then you run it on a device that’s 750x1500, we will adjust the automation point on the larger device by 1.5.
However, if you capture on a small device, like 300x600 and you then run on a larger device like 750x1500, we have to make a more than 2x adjustment to the automation points.
This will make the responsiveness less accurate.
This is where the responsive automation point positioning comes in.
2. Adjust automation points for the largest device in the test pool
When you run your app on a larger device, with TestSweets enabled, you might notice that some of the automation points are not where they are supposed to be.
This is common, based on the reasoning provided in the example above.
What you can do when you see this is long-tap on the out-of-place automation point and drag it into position. TestSweets will create a new position against the device’s screen size, which ensures that it won’t affect the original captured position for that screen size.
The cool thing about doing this is that, every screen size in between the original capture and the larger device will automatically be more accurate when doing the responsive position placement.
3. Adjust automation points for the smallest device in the test pool
The same issue that exists with the larger devices exists with the smaller screens.
You’ll see that some automation points are not on the intended UI elements that you wanted to target.
You’ll repeat the same process for those automation points affected, and adjust them for this specific screen size.
When you complete this process you would have covered majority of the device sizes which means you are now have a fully responsive automated test suite.
4. Adjust the automation points for different orentations
This new functionality allows you to also adjust positions for the automation points based on the orientation.
If you have a layout that appears different when it’s in the opposite orientation then this would be a good step to take.
Put your app in the orientation, and if there are any automation points that are out of it’s intended position, or should be in a completely different position, you can long-tap and move them into place.
With this functionality it means you can adjust positions for different screen sizes, orientations and by definition, different form factors like tablets or watches.
Good luck with your test automation.
Let’s work together
If you’re a company working with Flutter, with revenue higher than $3m per year, we have an enterprise offer for you.
We will write and maintain all your automated tests for you and your team.
Reach to automation@filledstacks.com if you want to work with a team focused on team performance through automation.
If you want to start automating your quality process yourself, here’s a 7-day free trial to try out TestSweets.
