浏览器兼容性或跨浏览器测试是评估当最终用户从不同浏览器访问您的 Web 应用程序时 Web 应用程序的功能是否保持一致的过程。它还用于验证桌面和 Web 应用程序的浏览器兼容性。
在跨浏览器测试中，您将验证网站的样式、字体和其他 UI 元素。所有这些东西在每个浏览器中都应该看起来相似。
在不同浏览器版本中测试的重要性
首先，并非所有人都使用相同的浏览器。
您可以在维基百科上查看所有浏览器、桌面浏览器、移动浏览器和平板电脑浏览器的使用份额的最新统计数据。
现在让我们看看其他场景……
你听说你父母想要的产品有一些销售。您打电话给他们并建议检查在线商店，以便他们找到一些他们一直在寻找的东西。过了一段时间，他们给你回电话，说很难导航。在问了几个问题之后，您了解到他们使用的是不同的浏览器，这就开始了一个全新的问题，即如何下载另一个浏览器 — 您正在使用的浏览器。
在这种情况下，企业只是冒着失去客户的风险，因为一个浏览器版本看起来很糟糕。在 21 世纪，当您打开某个 Web 应用程序并发现它看起来很糟糕时，您只需返回 Google 并打开另一个应用程序，直到找到一个好看的 Web 应用程序。
HTML 、 CSS 、 JavaScript 的每一部分在不同浏览器中都是独一无二的；有些东西可以在一个浏览器中支持，但在另一个浏览器中不支持。通过执行此类测试，您可以帮助开发人员确定出现这些问题的浏览器及其版本。
浏览器测试分析了哪些特性？
当测试阶段到来时，产品团队（大部分时间是与 QA 相关的工作）创建一个测试规范文档，在其中指定要测试的功能列表，以及在哪些浏览器/版本/平台上满足测试场景。我们可以把它分成下面给出的部分。
1. 基本功能：确保简单的东西适用于大多数浏览器-操作系统组合
- 所有输入字段及其验证
- 对话框和菜单按预期工作
- 在移动设备上输入触摸
2. 设计：确保字体、样式、图像和布局符合设计师发送的要求
3. 响应性：在更改浏览器的分辨率/方向后，验证设计是否可靠并且在某些层中没有损坏
如何选择浏览器？
有两种简单的方法可以从各种浏览器中进行选择
1.基于流行度：选择能够克服全球统计5%障碍的浏览器。因此，例如，在 2020 年，您将选择 Google Chrome、Safari、Mozilla Firefox、Microsoft Edge 和 IE。关于IE，有点棘手，因为这个浏览器的版本很多。我们的建议是只支持 IE 10，原因是 IE 8 和 9 太旧，难以支持。
2. 基于分析：如果您有一些分析工具（Google Analytics 等）可以跟踪所有流量统计数据，您将充分了解您的客户正在使用什么，这将是一个容易做出的决定。如果没有，您可以尝试通过创建一些民意调查等来更好地了解您的客户。是否值得支持不同浏览器的所有版本？这取决于您是否同意每次开发和测试的时间都会更长。无论哪种方式，从长远来看，您都将不得不牺牲对旧版本的支持。
选择哪种浏览器和平台取决于业务团队和营销团队。
如何计划和运行测试？
在计划何时以及执行哪些测试之前，您应该确保满足以下条件：
- 您的测试用例是最新的。
- 设计和模型是根据要求进行的。
- 您拥有测试所需的所有工具和设备。
- 您应该在每个浏览器中至少运行一次回归测试。这将使您了解产品及其瓶颈。
在您计划时，不要忘记提及谁将负责哪种浏览器/平台组合，并将要执行的测试用例分配给负责人。
用于浏览器兼容性测试的工具
- 如果您没有机会在您的项目中使用物理设备，您可以使用某种模拟器/模拟器/虚拟机。对于移动设备，请考虑以下选项：
- 您可以使用 Google Chrome 或 Mozilla Firefox 中默认的开发人员工具模拟设备。
- 如果您需要调试或重现移动设备的问题，Fiddler/Android studio/Xcode。
- 作为 VM 的示例，您可以使用虚拟框或任何您喜欢的相关内容。
- 对于不同的浏览器，您可以使用一些付费云服务，这些服务将为您提供各种浏览器/平台组合。
但是，请不要忘记，当您的预算有限时，模拟/仿真非常有用，但没有什么能与在真实物理设备上进行测试相比。
手动与自动跨浏览器测试
让我们谈谈手动与自动执行。
手动测试需要人工测试人员来执行场景，这意味着存在人为错误的空间。从项目开始，人工测试人员的工作量只会增加，这反过来又会增加资源和时间。
当每次都执行一定范围的测试时，最好将其自动化。建立涵盖大部分测试的完整自动化流程需要很长时间。所以，这对一个长期项目有好处。
在现代世界中，大多数项目在一个项目中同时拥有手动和自动化测试人员。手动测试人员正在进行探索性测试以找到 UX 中的痛点（也就是说，如果我们只讨论 FE 测试部分），而自动化人员则将每次运行的场景自动化。
执行跨浏览器测试时的常见问题
1. Internet Explorer：是的，你没看错！作为一个单独的类别，我把IE。这是最痛苦的浏览器测试。每个 QA 测试人员都知道，当他打开 Internet Explorer 时，他会发现一些错误。与前端相关的一切都可以在这里打破。您需要牢记这一点，不要忘记在 IE 中检查您的应用程序。
2. 布局：这是你能找到的最明显的问题。基本上，它都与 CSS、Canvas 或 DOM 相关。各种错误的范围从错误的文本或图像位置到诸如看起来错误的字体之类的小问题。也不要忘记这里的负面测试，例如通过单击表单外的某处来关闭弹出表单。
3. 触摸和点击：处理各种类型的输入并不容易，尤其是现在平板电脑和手机产生的触摸可能会或可能不会作为鼠标点击。
4. 悬停：如果您有一个通过将鼠标悬停在其上而打开的菜单，也不要忘记检查它。有时悬停永远不会结束，有时悬停事件链接到错误的项目，有时根本不打开。
底线
- 确定您将在哪些浏览器和平台上进行测试。
- 确保您的测试用例和设计是最新的。
- 设置您要测试的设备/浏览器。
- 将测试用例分配给负责人。尽量不要指派同一个人连续多次测试同一个平台/浏览器组合。
- 将带有测试结果的文档分享给将要修复错误的人。