On this page, we shall explain the procedure for creating and running tests in the local PC environment.
Table of Contents
- View the procedure in video form
- Creating test cases
- Specifying the target OS/app
- Acquiring screen captures
- Creating test procedures
- Running test cases
- Tests across multiple screens
1. View the procedure in video form
We are preparing a video that will enable you to understand the series of steps. The first part of the video explains tests using the iOS simulator. The Android instructions are in the second half of the video.
The procedure within the video is explained below.
2. Creating test cases
Figure 1 “Edit test case” button
First, create the test case. Then, click the “Edit test case” button in Figure 1 to move to the “Test case” edit page in Figure 2. On this page, we will create the detailed content of the test case.
Figure 2 “Test Case” edit page
3. Specifying the target OS/app
First, launch the app and acquire information, such as screen captures, etc. To do this, it is necessary to specify the target OS and app in the pop-up in Figure 3, and connect to the device.
Figure 3 Specifying the target OS and app
Here, we will explain how to specify the iOS test when using the simulator. For Android, we describe the Android real device + apk file test and Android real device + installed app test methods.
For iOS, set "Target OS" to "iOS" in the popup shown in Figure 3, and specify the full path of the app file in “App file path”. You can acquire the full path of the app file using the following method.
- Right-click the app file
- When the pop-up appears, press the option(alt) key
- Click to select the item called “Copy "********" as Pathname” that appears, as shown in Figure 4
Figure 4 “Copy as Pathname” of the app file
- Return to the browser, right-click the input area of “App file path”, and select “Paste”
Then, we can specify the full path of the app file.
4. Acquiring screen captures
If you specify the target OS and app file path, click the button to “Connect” to the device (Figure 5), which is on the top-right of the test case Edit page.
Figure 5 Button to “Connect” to the device
Click this and select “Open MagicPodDesktop” when the browser confirmation dialog box shown in Figure 6 is displayed.
Figure 6 Browser confirmation dialog box
MagicPodDesktop will then launch, as shown in Figure 7. The first time, enter the e-mail address and password, and click “Authenticate”.
Figure 7 MagicPodDesktop
After a short wait, MagicPodDesktop will launch the iOS simulator on the PC, and the app will be installed and launched (Figure 8).
Figure 8 Image of app launching on the iOS simulator
Once the connection is made, you will be able to click the “Capture UI by desktop app” button.
Click this to acquire a screen capture. Once you click this button, the capture upload and scan will start, and after a short amount of time, the test case Edit page in Figure 9 will be displayed.
The screen capture can be directly dragged & dropped, and uploaded to the test case Edit page. However, in this case, the function to edit automatically-recognized screen names, which will be described later, will not be available, so this is not recommended at this time.
Figure 9 Screen capture displayed on the test case Edit page
At this point, we have acquired the screen capture.
More precisely, the app UI tree information has been uploaded in addition to the screen capture.
5. Creating test procedures
As we have uploaded one capture, we can perform a simple test using just one screen. By selecting, and dragging & dropping elements on the capture, you can easily create a test procedure as shown in Figure 10.
See here for “Element Detection Mode”, which enables you to easily create tests in real time.
Figure 10 Test procedure
The content of the commands can be changed freely, as shown in Figure 11. A wide variety of commands are provided, so check the Command list page for detailed information.
Figure 11 Command switchover
Additionally, the element name is automatically generated using AI, but in case the generated name is inappropriate, you can change the name by clicking on the relevant area on the screen capture (Figure 12).
Figure 12 Changing the element name
MagicPod, in addition to the element name, also holds the system information of the element, which is used to identify elements during test execution. See here for the detailed mechanism.
6. Running test cases
Once the test procedure is created, click the “Run” (Figure 13) button at the bottom of the test case Edit page.
Figure 13 “Run” button
As shown in Figure 14, you can see that the app is launched and automatically operated by the iOS simulator. The test execution log is displayed in real time on MagicPodDesktop for each step.
Figure 14 Image of test Run
If the test succeeds, “Success” is displayed for the Execution button, as shown in Figure 15.
Figure 15 Image of successful test
Here, if you click the "Back" link on the test case Edit page and select the "Test runs" tab on the test case page, you can confirm the test run history (Figure 16) . And, further, if you click the number you want to see details, you can see the Screenshots, the Test run log, the Appium log and the Test run information(Figure 17) .
Figure 16 Test execution history page
Figure 17-1 Screenshots
Figure 17-2 Test run log
Figure 17-3 Appium log
Figure 17-4 Test run information
7. Tests across multiple screens
When creating tests across multiple screens, it is necessary to acquire screen captures for each screen.
For example, when configuring the screen for the iOS test app, as shown in Figure 18, just now, as ① the main screen capture has already been acquired, it is necessary to acquire the capture screens for the ② Completion of registration screen and ③ Alert.
Figure 18 Test app screen settings
To acquire the captures in ② and ③, first operate the app, open the screen in ② with the iOS simulator, return to the browser, and click the “Switch to new capture” button shown in Figure 19.
Figure 19 “Switch to new capture” button
If you do this, the “Capture UI by desktop app” button will be displayed again (Figure 20), so click this to capture the screen in ②.
Figure 20 “Capture UI by desktop app” button
You can capture other screens while waiting for the scan, so switch the iOS simulator screen to ③ during the scan and, on the browser once more, click on the “Switch to new capture” button -> “Capture UI by desktop app” button, to capture the screen in ③.
Once the scan is complete, you can create a test while switching the screen capture using the “Switch screen capture” button (Figure 21).
Figure 21 “Switch screen capture” button
In this way, you can create multiple screen tests. (Figure 22)
Figure 22 Testing the multiple screens you have created