跨浏览器测试
本模块重点介绍跨不同浏览器测试 Web 项目。我们探讨如何识别目标受众(例如,您最需要关注哪些用户、浏览器和设备?)、如何进行测试、不同类型代码面临的主要问题以及如何缓解这些问题、哪些工具最有助于帮助您测试和修复问题,以及如何使用自动化来加快测试速度。
先决条件
在尝试使用此处详细介绍的工具之前,您确实应该首先学习核心 HTML、CSS 和 JavaScript 语言的基础知识。
指南
- 跨浏览器测试简介
-
本文作为本模块的开篇,将概述跨浏览器测试这个主题,并解答一些问题,例如“什么是跨浏览器测试?”、“您会遇到哪些最常见的问题类型?”以及“测试、识别和修复问题的常用方法有哪些?”
- 执行测试的策略
-
接下来,我们将深入探讨如何进行测试,包括识别目标受众(例如,您应该确保哪些浏览器、设备和其他细分市场都经过测试)、低保真测试策略(获取各种设备和一些虚拟机,并在需要时进行临时测试)、更高级的策略(自动化,使用专用测试应用)以及与用户组进行测试。
- 处理常见的 HTML 和 CSS 问题
-
在奠定基础之后,我们将专门研究在 HTML 和 CSS 代码中常见的跨浏览器问题,以及可以用来防止问题发生或修复已发生问题的工具。这包括代码检查、处理 CSS 前缀、使用浏览器开发者工具追踪问题、使用 polyfill 为浏览器添加支持、解决响应式设计问题等等。
- 处理常见的 JavaScript 问题
-
现在,我们将探讨常见的跨浏览器 JavaScript 问题以及如何修复它们。这包括如何使用浏览器开发者工具追踪和修复问题、使用 polyfill 和库解决问题、使现代 JavaScript 功能在旧版浏览器中也能正常工作等信息。
- 处理常见的无障碍访问问题
-
接下来,我们将注意力转向可访问性,提供关于常见问题、如何进行简单测试以及如何使用审核/自动化工具查找可访问性问题的信息。
- 实现特性检测
-
特性检测涉及确定浏览器是否支持某一段代码,并根据其是否支持(或不支持)运行不同的代码,以便浏览器始终能够提供正常的体验,而不是在某些浏览器中崩溃/出错。本文详细介绍了如何编写自己的简单特性检测、如何使用库加快实现速度以及
@supports
等特性检测的原生功能。 - 自动化测试简介
-
每天多次在多个浏览器和设备上手动运行测试可能会变得乏味且耗时。为了高效地处理这个问题,您应该熟悉自动化工具。在本文中,我们将介绍可用的工具、如何使用任务运行器以及如何使用 Sauce Labs 和 Browser Stack 等商业浏览器测试自动化应用的基本方法。
- 设置您自己的测试自动化环境
-
在本文中,我们将教您如何安装自己的自动化环境,并使用 Selenium/WebDriver 和 selenium-webdriver 等测试库(针对 Node)运行自己的测试。我们还将探讨如何将您的本地测试环境与上一篇文章中讨论过的商业应用集成。