Mobile Testing 简明教程

Mobile Testing - UI

假设我们正在使用一个移动应用程序，你碰巧碰到以下情况：

Suppose we are using a mobile application, and interestingly, you experience the following situation −

  1. Button alignment is missing.

  2. Text is getting trimmed.

  3. Calendar control is getting cut.

的确，对于任何用户来说，这都是一种令人不快的体验。为了确保我们为用户提供良好的体验，强烈建议进行移动 UI 测试。

Indeed this is an unpleasant experience for any of the users. To make sure that we provide excellent experience to our users, Mobile UI Testing is highly recommended.

测试计划中要探索的第一部分是用户界面。作为测试人员，你的任务是确认你的应用程序是否满足某些期望，例如：

The first area to explore in your test plan is the user interface. It is your job as the tester to confirm that your application meets certain expectations, such as −

  1. Overall color scheme/theme of the device

  2. Style and color of icons

  3. Progress indicators when pages are loading

  4. Menus and how they are invoked and the typical items they contain

  5. Overall responsiveness of applications on this device

让我们更多地讨论移动 UI 测试的基础知识。

Let’s discuss more on the basics of Mobile UI Testing.

Screen Orientation / Resolution

网络内容需要在各种设备和网络条件下看起来都很棒。在常见的屏幕分辨率下测试你的网页通常是个好主意，这样你就可以确保你的页面可用。

Web content needs to look and feel great across a wide variety of devices and network conditions. It’s generally a good idea to test your webpage under the commonly used screen resolutions so that you can be sure that your page is usable.

如果你使用的是多列布局，你可能还想检查你的列是否对齐正确，并且在你访问者分辨率较低时仍可视。了解标准屏幕分辨率也很重要：

If you have a multi-column layout, you may also want to check that your columns align correctly and are still viewable when your visitor has a lower resolution. It is also important to know the standard screen resolutions −

  1. 640 × 480

  2. 800 × 600

  3. 1024 × 768

  4. 1280 × 800

  5. 1366 × 768

  6. 1400 × 900

  7. 1680 × 1050

Available Tools

市场上有不少工具可以让移动 UI 测试变得更加流畅和简单。例如：

There are quite a few tools available in the market to make mobile UI testing smoother and simpler. For example −

  1. Google chrome extension

  2. Screenfly

  3. Browser Stack

让我们进一步了解这些工具及其用途。

Let’s understand a little more about these tools and their usefulness.

Google chrome extension

这是 Google Chrome 网络浏览器的一个免费功能。我们在这里给出了使用 Google Chrome 扩展程序测试移动网络的分步说明：

It’s a free feature available with Google chrome web browser. We have given here a step-by-step explanation of how to test mobile web with Google Chrome Extension −

Step 1 −在“Google Chrome 网络浏览器”中打开要测试的网站。

Step 1 − Open the website under testing in “Google Chrome Web browser”.

Step 2 - 按 F12。它将打开开发者工具窗口，如下图截图所示。

Step 2 − Press F12. It will open the Developer tool window, as shown in the following screenshot.

developer tool window

Step 3 - 点击移动设备图标。请参阅以下屏幕截图。

Step 3 − Click the mobile device like icon. Refer the following screenshot.

mobile device icon

Step 4 - 选择要用来测试网站的移动设备。你可以选择不同的可用设备来执行用户界面验证。

Step 4 − Select the mobile device with which you want to test the website. You can choose the different available devices in order to do the UI verification.

ui verification

Screenfly

Screenfly 是一款免费且易于使用的工具。要使用此工具，只需在网络浏览器中键入 Quirktools 即可。你会看到以下画面。

Screenfly is a free and easy-to-use tool. To use this, you just need to type in Quirktools in your web browser. You will see the following screen.

screenfly

输入受测网站，然后点击 Go 。选择你想在其中查看网站的移动设备。

Enter the website under test and click Go. Select the mobile device in which you want to view the website.

select mobile device

BrowserStack

这是执行移动用户界面测试的另一个好工具。它提供了令人惊叹的结果。尽管这是一款付费工具，但你可以通过使用有效电子邮件地址在 BrowserStack 上注册来获得免费试用版。

It’s another great tool for performing mobile UI testing. It provides wonderful results. Although it is a paid tool, you can avail a free trail by registering on BrowserStack with a valid email address.

Touch Screens

Multi-Touch vs. Single Touch Screens

如果你的设备和应用程序支持多点触控功能（例如 iPhone 上的捏合缩放效果），请务必制作很多测试用例，这些用例涉及同时用多个手指触摸屏幕，尤其是在软键盘上输入时。

If your device and application support multi-touch features, like the pinch-to-zoom effect on iPhone, then make sure to include lots of test cases involving touching the screen in more than one place simultaneously, especially while typing on the soft keyboard.

Long Touch vs. Short Touch

虽然在触屏设备上没有双击的概念（不过如果你的应用程序中专门实现了双击，则会有这个概念），但有些设备（例如 Android 智能手机）会区分长按和短按。按住某项内容会在屏幕中间调出一个快捷菜单，而短按同一项内容会自动执行该快捷菜单中的第一个操作。

While there is no concept of a double-click on touch screen devices (although there could be, if specifically implemented in your application), some devices, like Android smartphones, distinguish between long touches and short touches. Pressing and holding an item will bring up a context menu in the middle of the screen, while short-clicking the same item will automatically perform the first action in that context menu.

Button Size and Position

确保按钮和图标足够大，并且离屏幕边足够远，这样大拇指可以轻松点击。

Ensure that buttons and icons are large enough and far enough from the edges of the screen to be easily clicked by a large fingertip.

Soft & Hard Keys

Soft Keyboards

通常，对于最终用户来说，有各种对他们很重要的特殊情况和边缘情况。

Often, there are various special cases and corner cases that are important to the end-users.

  1. Does the soft keyboard automatically appear if the user’s main action is to enter some text?

  2. Does the first layer of the soft keyboard include shortcut "@" and ".com" keys if the highlighted field is for entering email addresses?

  3. Can the soft keyboard be dismissed and re-displayed easily?

  4. Can the soft and hard keyboards be used interchangeably (if the device has both)?

Hard Keys

请务必制作很多围绕设备可用硬键盘（例如开始、主页、菜单和返回）的使用进行的测试。所有这些都应与你的应用程序进行交互，类似于它们与设备的原生应用程序进行交互的方式。

Make sure to include a lot of testing around the use of the device’s available hard keys such as Start, Home, Menu, and Back. These should all interact with your application similarly to how they interact with the device’s native applications.

Trackballs, Track wheels & Touchpads

如果你的设备没有触摸屏，那么验证用户屏幕导航尽可能省力就更加重要。在这些情况下，用户可能依靠轨迹球、滚轮或触控板在各个对象之间移动。

If your device doesn’t have a touch screen, it is even more important to verify that the screen navigation is as painless as possible for the user. In these cases, the user may rely on a trackball, track wheel, or touchpad to move from object to object.