哈Ha
测试移动Web有点类似于测试桌面Web。 一方面，这些是我们曾经看到过的相同的HTML，CSS，JavaScript和其他魅力。 相同的问题区域和典型的错误。 另一方面，存在差异。
在本文中，我整理了一份清单，列出了对于在Mobile Web项目上进行测试非常重要的那些功能。 该列表并不声称是完整的，因此请在注释中添加您的段落。 我只会很高兴。 唯一的规则是该项目应仅适用于移动网络，而不适用于所有网络。
首先，我们有至少两种方法来测试Mobile Web项目。 第一种是使用Chrome DevTools（或开发人员工具中的其他浏览器）模拟移动浏览器，但这是一种不太流行的方式。 第二个是使用真实的移动浏览器在真实的设备上进行测试。
无需设备即可检查大部分功能，但并非全部。 因此，我将检查分为两个大部分-我们在PC上进行的检查以及仅在手持移动设备上进行的检查。
Chrome DevTools
因此，如上所述，可以在PC上进行移动测试，而无需使用移动设备。 Chrome浏览器可以在移动模式下运行。
行动模式
为了切换到移动模式以查看网页，您必须打开Chrome DevTools并单击以下符号：
Web应用程序将在我们面前打开，就好像它是通过移动设备打开的一样：
我们可以从列表中选择设备的类型以及与之进行仿真的工作：
用户代理
重要的是要记住，除了屏幕大小外，某些Web应用程序还面向
User Agent 。 这种在移动模式下的应用可能在视觉上与我们在真实设备上看到的有所不同。
为了正确执行所有操作，您需要通过设置移动用户代理在Chrome DevTools中另外配置网络条件：
然后重新加载页面并获得所需的结果。
网络节流
使用Chrome，您可以在慢速Internet上和完全脱机的状态下测试应用程序。 为此，在相同的“网络条件”选项卡上，可以选择网络限制参数：
如果用户经常在Internet状况较差的情况下（例如导航器）使用该应用程序，则这一点很重要。
并不是所有的Chrome DevTools都有。 这是用于桌面Web和移动Web的出色工具。 Google提供了许多出色的文档
，当然都是英语 。
我们开设了为期两周的在线课程，内容涉及俄语的Chrome DevTools。 个人资料页面上的所有信息。 继续前进。 :)
使用Chrome DevTools测试移动网络具有多个优势。 它简单，快速，不需要实际设备，并且使您能够识别最明显的应用程序错误。 但是，a，不是全部。
性能表现
您应该拿起移动设备的第一个原因：需要在较弱的设备上测试应用程序。
各种动画，客户端的复杂计算等等，使得现代Web应用程序超负荷运转。 如果在桌面上所有这些东西都可以流畅，美观地运行（尽管并非总是如此），则某些三星J-line（例如J2）可能会有所滞后。
移动浏览器
第二个原因是移动浏览器。 它与系统内置的默认浏览器有关。 许多人都在使用它们，而不必费心安装移动Chrome。
这种浏览器的代表之一是三星Internet浏览器。 值得检查您的Web应用程序的操作。 特别是如果没有统计数据显示“您的用户坐在一起”。 如果有这样的统计数据，并且声称没有人从这些浏览器访问该应用程序，则很可能没有必要对其进行测试。 虽然...如果因为它刚坏而没有输入怎么办？ :)
值得考虑。
在后台工作
移动Web应用程序在移动浏览器中工作，这是合乎逻辑的。 同时，安排了移动设备，以便应用程序既可以处于活动模式，也可以处于后台。 例如，如果我们切换到另一个应用程序，或者有一个来电。
现在假设由于某种原因，我们的用户将具有打开的应用程序的浏览器移到了后台。 然后回来。 以下是一些可能出错的示例。 例如，我们有一个聊天应用程序，并且通讯的整个历史都丢失了。 现在需要重新加载页面。 不好吗 当然可以！ 或者我们有一个笔记本应用程序。 当用户被来电打扰时，他没有时间添加一些东西。 回来后，他发现自己写的东西被抹掉了。 现在，您必须重新编写一遍。 还是最好不要使用这样的应用程序？
确保在后台运行后检查应用程序的关键功能如何工作。
电子琴
大多数情况下，移动Web用户使用电子键盘输入文本。 碰巧，当它出现时，应用程序的布局就会中断。 通常，此问题与屏幕的比例如何计算以及它们如何影响此布局有关。
值得特别注意的是应用程序中那些用户必须填写大量数据的页面：注册页面，一些调查表等等。
屏幕方向
移动应用程序具有两种类型的屏幕方向：纵向和横向。 你可以
在这里阅读。
如果我们“将设备放在侧面”，则大多数移动应用程序将“重绘”到新的屏幕比例。 这也适用于移动浏览器。 此时，我们的Web应用程序的布局也可能在最不可预测的地方中断。
Chrome DevTools可以模拟两种模式，但是翻转和进一步重画Web应用程序的过程与在真正的移动浏览器上发生的过程不同。
重绘后我们的应用程序的外观绝对值得一试。 并且，优选地，在两个方向上：从肖像到风景以及从风景到肖像。
本机应用程序中的网页
另一个常见情况：应用程序同时具有移动Web版本和本机应用程序。 在这种情况下，可能会发生某些页面未传输到本机应用程序，而只是将它们显示为WebView的情况。
WebView是允许您将网页嵌入应用程序中的组件。 内置浏览器只是在应用程序中呈现我们在移动Web上看到的内容。 通常，这可以节省开发本机应用程序的时间。
在这种情况下，不仅要在浏览器中而且还要在本机应用程序中检查Mobile Web的更改。 当然，没有移动设备是没有办法的。
丝锥加工
与桌面Web（仅需单击鼠标）不同，在移动应用程序中，有多种与界面进行交互的方式：触摸，点击，轻拂等。 例如，
这里有很多地方可供阅读。
Chrome DevTools可以模拟其中一些操作。 但是，首先，不是全部。 其次，仿真期间的结果并不总是与使用真实设备时的结果相同。
即使您的移动网络应用程序不是针对特殊操作量身定制的，还是值得至少通过点击来检查界面的交互性。 尤其是菜单或某种开关之类的地方。 最重要的是，分接头不会落入任何特定的坐标。 它击中了整个区域。 如果您的控件在附近，则点击可能会同时影响多个元素，并给用户带来不便。
合计
我谈到了测试移动Web项目的主要功能。 如果您来自测试Desktop Web，则此列表可能会派上用场。 当然，关于这个问题，这还不是全部。 如果要补充列表，请确保在注释中写下您所做的检查。
谢谢您的关注。