Skip to main content

Creating mobile web tests

Eva Ferreira
  • Updated

Once you decide on your testing strategy for mobile web, you can use the mabl desktop app to train tests on an emulated mobile device in your Chrome browser. That way you can create a dedicated test that validates the user experience on a given mobile device like the iPhone. You can then run that very same test on other devices and screen orientations where you expect the application experience to be similar.

mobile_web_test.png

Choosing a mobile device to emulate when training a mabl browser test.

To train a test with an emulated mobile device setting, you can either create a new test or update the setting for an existing test. To create a new mobile web test, follow these steps.

  1. Create a new browser test: New test > Browser test
  2. Give the test a name
  3. In the Core settings section, click on the Mobile web tab.
  4. Select an application, plan, or application URL to associate the test with.
  5. In the Mobile web viewport section, select a device and orientation.
  6. Click the Create test button to start a training session with an emulated Chrome browser experience based on the specified device configuration.
  7. Add desired steps for your test case such as clicks, assertions, and more.
  8. Save your test changes.
Screen resolution requirements

When training a mobile test, your screen resolution should be at least 120px greater than the height of the device size. For example, if you need to test iPhone 13 Pro Max [926x428], your screen resolution needs to be at least 1146px height (926px +120px).

You are now ready to run your test. See our guide for running mobile web tests to learn more.

A note on menu and hover differences

Menu navigation and hover actions are something to watch for when running tests across desktop and mobile devices. It is likely for the navigation to be collapsed in a hamburger menu on certain devices. There are also no hovers actions on touch input devices such an iPhone.

Updating test device setting

When you go to edit steps of an already created test, mabl will use the configured test device setting to launch a training session that emulates the respective desktop or mobile device experience in your local Chrome browser. You can change the device setting for a test by following these steps:

  • Go to the test details page
  • Click on the pencil icon button to edit the test info
  • Choose your new device setting
  • Save your changes
Updating the default device setting for a test.

Updating the default device setting for a test.

Related articles