测试的基础知识+常见的html标签+项目实战（对外部项目进行功能测试）

测试的基础知识

一、认识软件及测试

什么是软件

软件是控制计算机硬件工作的一种工具

什么是软件测试

使用技术手段验证软件是否满足使用需求

软件测试的目的

减少软件缺陷，保障软件质量

---

二、测试主流技能

1.功能测试

验证程序的功能是否满足需求

2.自动化测试

利用代码或工具代替手工，对项目进行测试

3.接口测试

利用代码或工具验证程序中的接口是否访问正常

4.性能测试

模拟多人使用软件，查找服务器缺陷

---

三、常见的测试分类

1. 按测试阶段分类

单元测试

• 针对程序源代码进行测试

集成测试

• 部分源代码，针对程序接口进行测试，即针对各模块之间的地址访问进行测试

系统测试

• 针对程序的功能、非功能进行测试，即整个系统进行测试，包括系统的兼容、功能、文档等

验收测试

• 使用不同用户进行测试（内测、公测）

2.按代码可见度分类

黑盒测试

• 不关注源代码，针对程序UI功能进行测试

灰盒测试

• 针对程序部分代码进行测试（接口测试）

白盒测试

• 针对程序源代码进行测试

---

四、测试模型

质量模型

衡量一个优秀软件的维度

• 功能、性能、兼容性、易用性、安全性、可靠性、可维护性、可移植性

---

五、测试流程

需求评审、计划编写、用例设计、用例执行、缺陷管理、测试报告

需求评审

• 参与人员：产品经理、开发人员、测试人员
• 目的：确保各部门对需求的理解一致，知道被测项目有哪些功能模块

计划编写

• 编写测试计划：测什么、谁来测、怎么测

用例设计

• 设计测试用例：有等价类划分法、边界值分析法、判定表法、场景法（流程图法）、错误推荐法

六、测试用例

1. 什么是用例

用户使用的案例

2. 什么是测试用例

针对测试项目设计的执行文档

3. 测试用例的作用

1. 防止漏测
2. 实施测试的标准

4. 用例设计的编写格式

用例编号： 项目_模块_编号
用例标题： 预期结果（测试点）
项目/模块：所属的项目/模块
优先级：表示用例的重要程度或影响力P0-P4（P0最高）
前置条件：要执行此条用例，有哪些前置操作
测试步骤：描述操作步骤
测试数据：操作使用的数据，没有的话可为空
预期结果：期望达到的结果

---

七、用例设计

能对穷举场景设计测试点—等价类划分法（验证类型、规则）

1. 说明

在所有测试数据中，具有某种共同特征的数据集合进行划分

2. 分类

• 有效等价类：满足需求的数据集合
• 无效等价类：不满足需求的数据集合

3. 设计用例步骤

1.明确需求
2. 划分有效等价和无效等价
3. 提取数据，编写测试用例

4. 适用场景

• 针对：需要有大量数据测试输入，但是无法穷举测试的地方
  输入框、下拉列表、单选复选框
• 典型代表:页面的输入框类测试

注意：通常和边界值分析法联合起来使用，边界值法验证长度，等价类验证类型和规则

能对限定边界规则设计测试点—边界值分析法（验证长度）

1. 边界范围节点

• 上点：边界上的点（正好等于）
• 离点：离上点最近的点（刚好大于、刚好小于）
• 内点：范围内的点（区间范围内的数据）

2. 设计用例步骤

1. 明确需求
2. 划分有效和无效等价
3. 确定边界范围值
4. 提取数据编写测试用例

3. 用例优化

7个点优化为5个点

• 上点：必选
• 离点：开内闭外（开区间选内部离点，闭区间选外部离点）
• 内点：必选

4. 使用场景

• 在等价类的基础上，针对有边界范围的测试数据输入的地方（重点关注边界）
• 常见词语描述：大小、尺寸、重量、最大、最小、至多、至少等
• 典型代表：有边界范围的输入框类测试

案例1—验证QQ号码的合法性

需求：验证QQ号码的合法性
要求：6~10位自然数

1. 方法

等价类划分法+边界值分析法

2. 步骤

3. 用例设计

4. 用例优化：开内闭外（开区间选内部离点，闭区间选外部离点）
此题为闭区间，选外部离点5和11位，去掉7和9位

案例2—验证标题长度的合法性

需求：验证标题长度的合法性
要求：标题长度大于0，小于等于30个字符

1. 方法

等价类划分法+边界值分析法

2. 步骤

3. 用例设计

4. 用例优化

能对多条件依赖关系设计测试点—判定表法

1. 使用场景

• 有多个输入条件，多个输出结果，输入条件之间有组合关系，输入条件和输出结果之间有依赖（制约）关系
• 判定表一般适用于条件组合数量较少的情况（比如4个条件以下）

2. 定义

是一种以表格形式来表达多条件逻辑判断的工具

3. 组成

• 条件桩：条件
• 动作桩：针对各条件的操作
• 条件项：条件对应的取值
• 动作项：各条件项、各种取值情况下应该采取的动作操作

4. 规则

• 判定表中贯穿条件项和动作项的一列就是一条规则（用例）
• 假设有n个条件，每个条件的取值为0或1，则全组合有2的n次方种规则（用例）

5. 设计用例步骤

1. 明确需求
2. 画判定表
   1.列出条件桩、动作桩
   2.填写条件项
   3.根据条件项的组合确定动作项
   4.简化、合并相似规则（有相同的动作）
3. 根据规则编写用例

案例—验证用户主被叫

验证 “若用户欠费或关机，则不允许主被叫”功能的测试

1. 步骤

2. 用例设计

案例—订单

规则：

1. 如果金额大于500元，又未过期，则发出批准单和提货单；
2. 如果金额大于500元，但过期了，则不发批准单和提货单；
3. 如果金额小于等于500元，则不论是否过期都发出批准单和提货单；
4. 在过期情况下，不论金额大小还需要发出通知单。

1. 步骤

2. 用例设计

案例—文件修改规则

规则：

1. 输入的第一列字符必须是A或B
2. 第二列字符必须是一个数字
3. 如果第一列字符不正确，则给出信息L
4. 如果第二列字符不正确，则给出信息M
5. 如果两列字符输入正确，则修改文件成功

1. 步骤

2. 用例设计

能对项目业务设计测试点—场景法（流程图法）

说明：

• 场景法也叫流程图法，是用流程图描述用户的使用场景，然后通过覆盖流程路径来设计测试用例。

意义：

• 用户使用角度：用户平时使用的不是单个功能，而是多个功能组合起来进行使用
• 测试人员角度：平时测试的都是单个功能点进行测试，容易忽略多个功能的组合测试

注意：

1. 覆盖业务测试，需要使用流程图法
2. 先测试业务，再测试单功能、单模块、单页面
3. 业务用例是根据流程图来梳理的，需要先了解流程图

流程图：使用标准图形和箭头来表达程序或业务的走向

• 流程图对测试人员的作用：
  1.能够看懂流程图，设计业务用例
  2.当需求文档信息不全时，能够根据需求，梳理出流程
• 网页版工具：https://processon.com/
• Windows工具：visio

适用场景

• 根据实际的应用场景，来测试业务用例，可以使用场景法

画流程图练习

1. 用户名为admin\密码为：123456，输出：登录成功

2. 登录、搜索商品、添加购物车、去结算、支付，如果支付成功，则提示下单成功，否则提示支付失败
   

案例—ATM机取款流程

1.画流程图

2. 根据流程图，编写案例
   
   

错误推荐法

• 定义：通过经验推测系统可能出现的问题
• 应用场景：当项目用例都执行完毕，且BUG修复完成，离上线还有一段时间，在这段时间中可以用错误推荐法复测主要业务或测试未覆盖的功能。

---

八、缺陷管理（提交、验证、关闭）

1. 缺陷介绍

缺陷定义

软件中存在的各种问题都叫缺陷，简称bug。

缺陷判定标准

多功能、少功能、功能错误、缺少隐性功能或错误、易用性

缺陷产生的原因

需求文档、架构设计、编码、运行环境（软硬件环境）

• 需求阶段：需求描述不易理解，有歧义，错误等
• 设计阶段：设计文档存在错误或缺陷
• 编码阶段：代码出现错误
• 运行系统：软硬件系统本身故障导致软件缺陷

缺陷的生命周期

需求文档的建立—>架构设计—>编码—>测试—>缺陷分类—>缺陷隔离—>缺陷解决

• 注意：解决了缺陷A，可能同时还会注入缺陷B
• 回归测试：
  1.常规项目回归：项目新增了模块，要测新增模块及新增模块关联的旧模块
  2.非常规项目（银行、部队、航天）：新增功能，必须全部复测
• 回归bug：上一个版本发现的缺陷，开发修复完毕，在下个版本进行重新验证

缺陷的分类

功能错误、UI界面错误、兼容性、数据（数据库）、易用性、改进建议、架构设计

2. 缺陷编写

缺陷报告示例

缺陷跟踪流程

缺陷管理流程：提交、验证、关闭

提交缺陷的信息

指派人、缺陷描述（缺陷编号、缺陷标题、前置条件、复现步骤、预期结果、实际结果、附件备注）、缺陷严重程度、缺陷优先级、缺陷类型、状态

缺陷提交注意事项

• 可重现：缺陷可以复现
• 唯一性：一个缺陷上报一个问题
• 规范性：符合公司或项目要求
• 发现缺陷后，首先怎么办？：确定缺陷可复现，确定是bug，提交时，要检查缺陷是否已存在

如何写缺陷标题？

测试点+预期结果（实际执行结果）

3. 缺陷管理工具—禅道

1. 地址：https://demo.zentao.net/user-login.html
2. 特点：

• 国产、免费、开源、简单、轻量级
• 三管融合（产品管理、项目管理、质量测试管理）

• 登录
  
• 提交bug
  
  
• 关闭bug
  

---

九、常见的html标签

1.HTML介绍

前端三大核心：

• HTML:负责网页的架构，将文本显示在页面上
• CSS：负责网页的样式、美化（大小、颜色、位置）
• JS：负责网页的行为

什么是HTML?

• 超文本标记语言，由一套标记标签组成
• 标签：
  • 单标签：<标签名 />
  • 双标签：<标签名>
  • 属性：描述某一特征 示例：

2. html骨架标签

DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>幸运星啦啦啦title>
	head>
	<body>
		编写代码区域
	body>
html>

1.html：根标签，所有的内容都应该放在html标签中
2.head：头部标签
3.body：身体标签（代码编写区域）

3. html常用标签

注释

• 作用：描述的内容不会被浏览器执行
• 说明：解释程序给程序员看
• 快捷键：ctrl+/

测试点：前端页面上线之前检查注释描述或去除注释

标签

• 标题：h1~h6
  • 说明：h1最大，h6最小
  • 示例：

<h1>标题h1h1>
<h6>标题h6h6>

• 段落：p
  • 特点：独占一行（换行作用）、语义化（浏览器知道你是段落）
  • 示例：

<p>段落内容p>

• 超链接：a
  • 说明：点击文本跳转到指定页面
  • 语法：< a href=“https://www.baidu.com” target=“_blank”>文本< /a >
  • 属性：
    1. href：点击文本要跳转的地址或文件
    2. target：打开窗口模式 （新窗口：target=“_blank”）
• 图片：img
  • 说明：在页面中插入一张图片
  • 属性：
    1. src：图片路径
       1. 相对路径：相对当前执行文件所在位置作为起点
          • 上一级：../
          • 同级：./
       2. 绝对路径：不推荐
    2. title：悬停显示的文字
    3. width：图片的宽，如100px，px：像素
    4. height：图片的高
    5. alt：图片未加载时显示的内容
  • 示例：

<img src="1.jpg" title="图片1" width="100px" height="200px" alt="此处有一张图片"/>

测试点：必须有title属性（悬停和未加载时显示）

• 换行与空格：
  和  
  • 换行：
    
  • 空格： ；
  • 示例：

<body>
	幸运星<br/>啦啦啦
	幸运星 软件测试
body>

• 布局标签：div和span
  • 说明：页面布局使用，常用div和span
    • div：大盒子，独占一行
    • span：小盒子，一行可以放多个
  • 示例

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>啦啦啦啦title>
    <style>
        .d1 { background:red;}
        .d2 { background:green;}
        .s1{background:aqua}
        .s2{background:yellowgreen}
    style>
head>
<body>

    
    <div class="d1">大盒子1div> <div class="d2">大盒子2div>
    <span class="s1">小盒子1span> <span class="s2">小盒子2span>
    <p>测试<span class="s2">开发span>p>
body>
html>

• script：js标签
• style：css标签
• link：外部加载css标签

• 列表标签：li（ol为有序列表，ul为无序列表）
  • 说明：列表标签常用li元素（分为：有序和无序）
  • 示例：

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>啦啦啦啦title>
head>
<body>
    
    <ol>
        <li>安徽li>
        <li>宿州li>
    ol>
    
    <ul>
        <li>浙江li>
        <li>宁波li>
    ul>>
body>
html>

• input标签：
  • 文本框：
  • 密码框：
  • 单选按钮：
    • 单选效果：
      1. 相同一组的radio才能做单选
      2. 设置相同（组名）name属性值为一组
  • 复选框：
  • 按钮：
    • 普通：type=“button”
    • 重置：type=“reset”
    • 提交：type=“submit”

按钮测试点：统一使用value进行赋值来确定按钮提示字，因为每个浏览器出现的按钮提示字可能不一样
提示：普通按钮默认没有执行效果，需要配合JS来实现

• 表单标签：form
  • 说明：页面提交输入信息需要使用表单标签
  • 作用：将页面输入的数据提交到后台或指定页面
  • 属性：
    • action：指定将数据提交到哪个页面
    • method：提交参数的方法（get、post）
      • get：查询使用
        1. 参数url明文显示
        2. 提交速度快
        3. 提交参数有长度限制
      • post：提交数据、登录、注册
        1. 非明文显示
        2. 提交速度慢
        3. 提交参数的长度无限制
  • 示例：

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>由云打开~嘻嘻title>
    <style>
        .d1{width:1000px; height:800px; background-image: url(嘻嘻.jpg)}
        .d2{background-color: aliceblue;}
    style>
head>
<body>
    <div class="d2">
        <form method="post" action="suprice.html">
            你的名字：<input type="text"/> <br/>
            密码：<input type="password"/> <br/>
            性别：
            <input type="radio" name="one"/>男
            <input type="radio" name="one"/>女
            <br/>
            你的爱好:
            <input type="checkbox"/>吃
            <input type="checkbox"/>玩
            <input type="checkbox"/>睡
            <input type="checkbox"/>学习
            <input type="checkbox"/>乒乓
            <br/>
            <input type="submit" value="提交有惊喜"/>
            <input type="reset"/>
            <input type="button" value="点我试试" onclick="alert('点我干啥？')"/>
        form>
    div> 
    <div>
        <img src="嘻嘻.jpg" title="嘻嘻"  height="500px" >
        <img src="哈哈.jpg" title="哈哈"  height="500px" >
        <img src="哈哈哈哈.jpg" title="哈哈哈哈"  height="500px" >
    div>
body>
html>

---

十、项目实战

项目一、登录模块

• 登录页面：
  

• 登录需求1：

  • 1.1 登录效果图
    
  • 1.2 登录效果图
    
  • 1.3 登录效果图
    

• 登录需求2：
  

• 根据需求，测试点提取：
  

• 用例设计：
  
  

项目二、发布文章模块

• 发布文章页面：
  
  
  
• 测试点提取：

• 用例设计：