当前位置: 首页 > article >正文

简易的微信聊天网页版【项目测试报告】

文章目录

  • 一、项目背景
  • 二、项目简介
    • 登录功能
    • 好友列表页面
    • 好友会话页面
  • 三、测试工具和环境
  • 四、测试计划
    • 测试用例
    • 部分人工手动测试截图
    • web自动化测试
      • 测试用例
      • 代码框架
      • 配置内容代码文件(Utils.py)
      • 登录页面代码文件(WeChatLogin.py)
      • 好友列表测试用例代码文件(WeChatPeopleDetail.py)
      • 好友会话测试用例代码文件(WeChatFormationDetail.py)
      • 测试项目代码文件(RunTest.py)
  • 五、总结


一、项目背景

本系统采用前后端分离架构实现,结合数据库进行聊天记录存储,并部署于云服务器。
前端包含三大核心页面:登录验证页、好友会话列表页、通讯录好友页,构建了基础的即时通讯体验。
系统主要实现以下功能模块:个人好友列表、好友消息实时收发、聊天记录查询等功能。

当前版本存在以下待优化点:

  • 1. 用户体系仅支持预设账号登录(需提前录入数据库校验),未开放自主注册通道;
  • 2. 好友关系采用静态数据模拟,暂未实现动态添加/删除功能;
  • 3. 消息状态提示(如已读/送达)功能尚未完整实现。

该即时通讯系统可实现基本的文字消息交互,支持查看历史聊天记录(按时间倒序展示),虽然功能相对基础,
但已构建起网页端即时通讯的核心框架,满足用户基本的文字聊天需求。

二、项目简介

本系统主要实现以下核心功能:

  • 用户登录、
  • 好友消息实时收发、
  • 聊天记录查询。

登录功能

用户需通过预设账号登录(账号信息已固化至数据库,暂不开放自主注册);

  • 登录成功需点击警告窗口中确认按钮,然后跳转至好友会话列表页;
  • 登录异常状态下,警告窗口提示登录失败!

好友列表页面

纵向排列好友列表,展示好友昵称,点击对应的好友跳转到对应的会话窗口。

好友会话页面

顶部状态栏显示当前对话好友昵称;
消息气泡左右分流(右侧绿色为发送方,左侧白色为接收方);
自动加载最近历史记录(按时间倒序排列);
文本输入框支持即时内容发送(点击发送按钮)

三、测试工具和环境

处理器 11th Gen Intel(R) Core(TM) i5-1155G7 @ 2.50GHz 2.50 GHz
机带 RAM: 16.0 GB (15.8 GB 可用)
系统类型: 64 位操作系统, 基于 x64 的处理器
版本: Windows 11 家庭中文版
操作系统版本: 26100.3194

Chrome浏览器版本 :133.0.6943.142(正式版本) (64 位)
自动化脚本运行环境:PyCharm 2024.2.1

四、测试计划

测试用例

部分人工手动测试截图

正常登录:输入预设账号和密码


异常登录:输入未预设账号和密码


正常登录后跳转的页面


正常登录后好友列表页

web自动化测试

测试用例

代码框架

在这里插入图片描述

配置内容代码文件(Utils.py)

# 导入所需的模块
import datetime  # 用于处理日期和时间
import os  # 用于文件和目录操作
import sys  # 用于获取调用栈信息# 导入Selenium相关模块
from selenium import webdriver  # Selenium核心模块
from selenium.webdriver.chrome.service import Service  # Chrome浏览器服务
from webdriver_manager.chrome import ChromeDriverManager  # 自动管理ChromeDriver# 创建浏览器驱动类
class Driver:driver = ""  # 类属性,用于保存浏览器驱动实例def __init__(self):"""初始化浏览器驱动配置"""# 创建Chrome浏览器选项对象(可用于添加扩展、无头模式等配置)options = webdriver.ChromeOptions()# 指定ChromeDriver的路径driver_path = "D:/Downloads/chromedriver-win64/chromedriver-win64/chromedriver.exe"# 创建Chrome浏览器驱动实例self.driver = webdriver.Chrome(executable_path=driver_path,  # 指定驱动路径options=options  # 传入浏览器选项)# 设置隐式等待(作用于整个浏览器生命周期,查找元素时的默认等待时间)self.driver.implicitly_wait(2)  # 单位:秒def getScreeShot(self):"""屏幕截图方法"""# 生成日期格式的目录名(示例:2023-08-01)dirname = datetime.datetime.now().strftime("%Y-%m-%d")# 拼接截图保存路径(上级目录的images文件夹下)screenshot_dir = "../images/" + dirname# 如果目录不存在则创建if not os.path.exists(screenshot_dir):os.mkdir(screenshot_dir)# 生成文件名格式:# 调用当前方法的上层方法名 + 时间戳 + 后缀(示例:test_login_2023-08-01-143045.png)filename = (sys._getframe().f_back.f_code.co_name  # 获取调用该方法的函数名+ datetime.datetime.now().strftime("%Y-%m-%d-%H%M%S")+ ".png")# 保存截图到指定路径self.driver.save_screenshot(os.path.join(screenshot_dir, filename))# 创建全局浏览器驱动实例(可被其他模块导入使用)
WeChatDriver = Driver()

登录页面代码文件(WeChatLogin.py)

# 测试微信登录界面# 从selenium库中导入By类,用于定位网页元素
from selenium.webdriver.common.by import By
# 从selenium库中导入expected_conditions模块,用于设置显示等待的条件
from selenium.webdriver.support import expected_conditions as EC
# 从selenium库中导入WebDriverWait类,用于实现显示等待
from selenium.webdriver.support.wait import WebDriverWait# 从自定义的common.Utils模块中导入WeChatDriver类,用于创建和管理浏览器驱动
from common.Utils import WeChatDriverclass WeChatLogin:# 初始化类属性,用于存储登录页面的URL和浏览器驱动对象url = ""driver = ""def __init__(self):# 给登录页面的 URL 赋值,这里是本地的登录页面地址self.url = "http://127.0.0.1:8080/login.html"# 获取 WeChatDriver 类中的 driver 对象,用于操作浏览器self.driver = WeChatDriver.driver# 打开指定的登录页面self.driver.get(self.url)# 成功登陆的测试用例def LoginSucTest(self):# 若连续多次的send_keys则会出现关键词拼接,而不是替换。若要替换需要先clear# 找到用户名输入框元素,并清空其中的内容self.driver.find_element(By.CSS_SELECTOR, "#username").clear()# 找到密码输入框元素,并清空其中的内容self.driver.find_element(By.CSS_SELECTOR, "#password").clear()# 向用户名输入框中输入正确的用户名 "zhangsan"self.driver.find_element(By.CSS_SELECTOR, "#username").send_keys("zhangsan")# 向密码输入框中输入正确的密码 "123"self.driver.find_element(By.CSS_SELECTOR, "#password").send_keys("123")# 找到登录按钮元素,并点击该按钮进行登录操作self.driver.find_element(By.CSS_SELECTOR, "#submit").click()# 添加显示等待# 创建一个 WebDriverWait 对象,设置最大等待时间为 2 秒wait = WebDriverWait(self.driver, 2)# 等待直到页面上出现弹窗wait.until(EC.alert_is_present())# 切换到当前页面的弹窗alert = self.driver.switch_to.alert# 点击弹窗的确认按钮alert.accept()# 查找登录成功页面的元素:昵称:body > div.client-container > div > div.left > div.user# 查找登录成功页面中显示用户昵称的元素,若找到则说明登录成功self.driver.find_element(By.CSS_SELECTOR, "body > div.client-container > div > div.left > div.user")# 添加屏幕截图# 调用 WeChatDriver 类的 getScreeShot 方法,对当前页面进行截图WeChatDriver.getScreeShot()# 异常登陆的测试用例def LoginFailTest(self):# 若连续多次的send_keys则会出现关键词拼接,而不是替换。若要替换需要先clear# 找到用户名输入框元素,并清空其中的内容self.driver.find_element(By.CSS_SELECTOR, "#username").clear()# 找到密码输入框元素,并清空其中的内容self.driver.find_element(By.CSS_SELECTOR, "#password").clear()# 错误的用户名# 向用户名输入框中输入错误的用户名 "admin"self.driver.find_element(By.CSS_SELECTOR, "#username").send_keys("admin")# 向密码输入框中输入密码 "123"self.driver.find_element(By.CSS_SELECTOR, "#password").send_keys("123")# 找到登录按钮元素,并点击该按钮进行登录操作self.driver.find_element(By.CSS_SELECTOR, "#submit").click()# 检查是否登录失败:看是否出现弹窗# 添加显示等待# 创建一个WebDriverWait 对象,设置最大等待时间为 13 秒wait = WebDriverWait(self.driver, 13)# 等待直到页面上出现弹窗wait.until(EC.alert_is_present())# 切换到当前页面的弹窗alert = self.driver.switch_to.alert# 点击弹窗的确认按钮alert.accept()# 添加屏幕截图# 调用WeChatDriver类的getScreeShot方法,对当前页面进行截图WeChatDriver.getScreeShot()

好友列表测试用例代码文件(WeChatPeopleDetail.py)

# 导入所需模块
import time  # 时间相关操作
from selenium.webdriver.common.by import By  # Selenium 定位策略
from common.Utils import WeChatDriver  # 自定义的微信驱动工具类# 微信联系人详情页测试类
class WeChatPeopleDetail:url = ""  # 页面 URL(已通过__init__初始化)driver = ""  # 浏览器驱动实例def __init__(self):"""初始化方法,配置测试环境"""self.url = "http://127.0.0.1:8080/client.html"  # 测试页面地址self.driver = WeChatDriver.driver  # 获取全局浏览器驱动实例self.driver.get(self.url)  # 打开测试页面def PeopleDetailTestByLogin(self):"""登录状态下的详情页测试"""# 验证联系人图标存在性(如果元素未找到会抛出NoSuchElementException)# 使用 CSS 选择器定位元素self.driver.find_element(By.CSS_SELECTOR,"body > div.client-container > div > div.left > div.tab > div.tab-friend")# 添加等待time.sleep(1)  # 调用截图方法WeChatDriver.getScreeShot()  # 保存当前页面截图

好友会话测试用例代码文件(WeChatFormationDetail.py)

# 导入所需模块
import time  # 时间相关操作
from selenium.webdriver.common.by import By  # Selenium元素定位策略
from common.Utils import WeChatDriver  # 自定义的微信驱动工具类# 微信消息列表页测试类
class WeChatFormationDetail:url = ""  # 页面 URL(已通过__init__初始化)driver = ""  # 浏览器驱动实例def __init__(self):"""初始化方法,配置测试环境"""self.url = "http://127.0.0.1:8080/client.html"  # 测试页面地址self.driver = WeChatDriver.driver  # 获取全局浏览器驱动实例self.driver.get(self.url)  # 打开测试页面def FormationDetailTestByLogin(self):"""登录状态下消息详情页测试"""# 验证消息图标存在性self.driver.find_element(By.CSS_SELECTOR,"body > div.client-container > div > div.left > div.tab > div.tab-session")# 添加等待time.sleep(1) # 调用截图方法WeChatDriver.getScreeShot()  # 保存当前页面状态

测试项目代码文件(RunTest.py)

# 导入测试模块和工具类
from tests import WeChatLogin  # 微信登录测试类
from tests import WeChatPeopleDetail  # 联系人详情测试类
from tests import WeChatFormationDetail  # 消息列表测试类
from common.Utils import WeChatDriver  # 浏览器驱动工具类if __name__ == '__main__':# 执行登录失败测试用例WeChatLogin.WeChatLogin().LoginFailTest()# 执行登录成功测试用例WeChatLogin.WeChatLogin().LoginSucTest()# 消息列表页面测试WeChatFormationDetail.WeChatFormationDetail().FormationDetailTestByLogin()# 联系人列表页面测试WeChatPeopleDetail.WeChatPeopleDetail().PeopleDetailTestByLogin()# 退出浏览器WeChatDriver.driver.quit()

五、总结

在实际测试中,遇到以下几个问题:

  • (1)遇到页面元素查找的情况,原因是网络渲染过慢造成的;
  • (2)浏览器驱动管理工具 webdriver-manager由于网络环境的问题,不能自动下载对应的浏览器驱动,需自己先下载好,再去指定浏览器驱动安装的路径;
  • (3)有时候出现卡顿,需重新打开编写的自动化脚本软件。

当前系统核心功能基本可用,满足基础聊天需求,但存在以下待改进项:

  • 页面元素定位稳定性需优化

  • 增加浏览器兼容性验证

  • 补充性能测试场景


相关文章:

简易的微信聊天网页版【项目测试报告】

文章目录 一、项目背景二、项目简介登录功能好友列表页面好友会话页面 三、测试工具和环境四、测试计划测试用例部分人工手动测试截图web自动化测试测试用例代码框架配置内容代码文件(Utils.py)登录页面代码文件(WeChatLogin.py)好…...

显示篇(2)- DRM A733 多显主副显绑定

通过hal层根据优先级绑定,优先级越高送显越靠前。(sdk默认mipi优先级最高为主显) 1.双显 如edp主mipi副,edp优先级搞。 更改如下 diff --git a/hwc-hal/drm/drmConnector.cpp b/hwc-hal/drm/drmConnector.cpp --- a/hwc-hal/d…...

基于腾讯云高性能HAI-CPU的跨境电商客服助手全链路解析

跨境电商的背景以及痛点 根据Statista数据,2025年全球跨境电商市场规模预计达6.57万亿美元,年增长率保持在12.5% 。随着平台规则趋严(如亚马逊封店潮),更多卖家选择自建独立站,2024年独立站占比已达35%。A…...

北京迅为RK3568开发板OpenHarmony系统南向驱动开发内核HDF驱动框架架构

瑞芯微RK3568芯片是一款定位中高端的通用型SOC,采用22nm制程工艺,搭载一颗四核Cortex-A55处理器和Mali G52 2EE 图形处理器。RK3568 支持4K 解码和 1080P 编码,支持SATA/PCIE/USB3.0 外围接口。RK3568内置独立NPU,可用于轻量级人工…...

从0到1入门Docker

一、快速入门 Docker run命令中的常见参数 -d:让容器后台运行--name:给容器命名(唯一)-e:环境变量-p:宿主机端口映射到容器内端口镜像名称结构:Repository :TAG(镜像名&…...

应用篇| 抓包工具-charles的使用

上文说到,我们app爬虫要借助一些抓包工具,本节课就教大家如何使用抓包工具分析app的流量。抓包工具的使用是app爬虫的必修课。相比 Fiddler 来说,Charles 的功能更强大,而且跨平台支持更好。 charles安装 官方网站:https://www.charlesproxy.com 下载链接:Download a F…...

Docker搭建Redis哨兵模式【一主两从三哨兵】

Docker搭建Redis哨兵模式 系统: CentOS 7 Dockder 版本: VMware虚拟机 网络适配器 网络连接 桥接模式:直接连接物理网络查看IP命令 ip addr一、哨兵模式概述 1. 官方文档与关联博客 官方文档:https://redis.io/docs/latest/operate/oss_and_stack/management/sentinel关联博…...

labview实现大小端交换移位

在解码时遇到了大小端交换的问题,需要把高低字节的16进制值进行互换,这里一时间不知道怎么操作,本来打算先把16进制转字节数组,算出字节数组的大小,然后通过模2得到0,1,来判断是否为奇数位和偶数…...

Three.js 进阶(灯光阴影关系和设置、平行光、阴影相机)

本篇主要学习内容 : 灯光与阴影聚光灯点光源平行光阴影相机和阴影计算投射阴影接受阴影 点赞 关注 收藏 学会了 1.灯光与阴影 1、材质要满足能够对光有反应 2、设置渲染器开启阴影计算 renderer.shadowMap.enabledtrue 3、设置光照投射阴影 directionalLight.castShadow …...

FastAPI 分页模块实现详解

1. 简介 本文详细介绍了一个基于 FastAPI 框架的通用分页处理模块的实现。该模块提供了标准的分页参数处理、数据切片和响应格式化功能,可以轻松地集成到任何 FastAPI 项目中。 2. 代码实现 2.1 导入必要的模块 首先,我们需要导入所需的模块&#xf…...

RK3588部署YOLOv8(2):OpenCV和RGA实现模型前处理对比

目录 前言 1. 结果对比 1.1 时间对比 1.2 CPU和NPU占用对比 2. RGA实现YOLO前处理 2.1 实现思路 2.2 处理类的声明 2.3 处理类的实现 总结 前言 RK平台上有RGA (Raster Graphic Acceleration Unit) 加速,使用RGA可以减少资源占用、加速图片处理速度。因此…...

打造智能钉钉机器人:借助智谱GLM-4-Flash实现高效智能回复(文末附源码)

文章目录 前言一、准备工作(一)钉钉机器人(二)智谱 GLM-4-Flash(三)内网穿透工具 cpolar(四)需要准备的工具和环境 二、钉钉机器人的创建与配置步骤1:创建钉钉机器人步骤…...

使用Mermaid语法绘制的C语言程序从Linux移植到Windows的流程图

以下是使用Mermaid语法绘制的C语言程序从Linux移植到Windows的流程图: graph TDA[开始移植] --> B[代码兼容性检查]B --> C[检查系统调用差异\nfork/exec -> CreateProcess]B --> D[检查文件路径格式\n/ vs \\]B --> E[检查依赖库兼容性\nPOSIX vs …...

入门到入土,Java学习 day16(算法1)

利用循环遍历来判断是否相等 二分查找/折半查找 前提条件:数组中的数据有序 每次排除一般的查找范围 用min,max,mid来处理,最大加最小除2,比较,然后得到在中间左边还是右边然后更新最大最小 public class Two {// 二分查找方法…...

Vulnhub 靶机 VulnOSv2 write up opendocman cms 32075 sql注入 账号密码 ssh连接 37292.c 脏牛提权

Vulnhub 靶机 VulnOSv2 write up opendocman cms 32075 sql注入 账号密码 ssh连接 37292.c 脏牛提权 一、信息收集 1、首先拿到靶场先扫一下ip arp-scan -l 3、 2、指纹扫描 nmap -sS -sV 192.168.66.178nmap -p- -sV -A 192.168.66.253 PORT STATE SERVICE VERSION 22…...

Unity辅助工具_头部与svn

Unity调用者按钮增加PlaySideButton using QQu; using UnityEditor; using UnityEngine; [InitializeOnLoad] public class PlaySideButton {static PlaySideButton(){UnityEditorToolbar.RightToolbarGUI.Add(OnRightToolbarGUI);UnityEditorToolbar.LeftToolbarGUI.Add(OnLe…...

2025最新Postman、Apipost和Apifox API 协议与工具选择方案解析

作为一个一个每天和 API“打交道”的全栈开发者,我的日常就是在一堆请求回应之间探寻系统间的“沟通艺术”。熟悉 API 的各种协议和工具,几乎成了我的谋生技能。今天,我就把自己积累多年的“血泪教训”和经验打包成一篇文章,献给和…...

ARM SVC指令

在 ARM 汇编中,SVC(Supervisor Call)指令用于从用户模式切换到特权模式(如 Supervisor 模式),以便执行操作系统内核提供的服务。它通常用于系统调用。 具体作用 触发异常:执行 SVC 指令时&…...

MicroPython 智能硬件开发完整指南

第一部分:MicroPython 基础 1. MicroPython简介 定义:专为微控制器设计的精简Python 3实现,支持硬件直接操作。特点: 语法兼容Python 3,但移除复杂功能(如多线程)。支持GPIO、PWM、I2C、SPI等…...

DeepLabv3+改进8:在主干网络中添加SIM注意力机制|助力涨点

🔥【DeepLabv3+改进专栏!探索语义分割新高度】 🌟 你是否在为图像分割的精度与效率发愁? 📢 本专栏重磅推出: ✅ 独家改进策略:融合注意力机制、轻量化设计与多尺度优化 ✅ 即插即用模块:ASPP+升级、解码器 PS:订阅专栏提供完整代码 论文简介 在本文中,我们提出了…...

vue-cli3+vue2+elementUI+avue升级到vite+vue3+elementPlus+avue总结

上一个新公司接手了一个vue-cli3vue2vue-router3.0elementUI2.15avue2.6的后台管理项目,因为vue2在2023年底已经不更新维护了,elementUI也只支持到vue2,然后总结了一下vue3的优势,最后批准升级成为了vitevue3vue-router4.5element…...

电路原理(电容 集成电路NE555)

电容 1.特性:充放电,隔直流,通交流 2.电容是通过聚集正负电荷来存储电能的 3.电容充放电过程可等效为导通回路 4.多电容并联可以把容量叠加,但是多电容串联就不会,只会叠加电容的耐压值。 6.电容充放电时相当于通路&a…...

QEMU源码全解析 —— 块设备虚拟化(2)

接前一篇文章:QEMU源码全解析 —— 块设备虚拟化(1) 本文内容参考: 《趣谈Linux操作系统》 —— 刘超,极客时间 《QEMU/KVM源码解析与应用》 —— 李强,机械工业出版社 特此致谢! 上一回讲解了几种虚拟化方式(全虚拟化、半虚拟化和硬件辅助虚拟化)的优缺点及其对比…...

[C++面试] 对通透比较器了解多少?(较少涉及,可跳过)

一、入门 1、什么是比较器 在 C 中,比较器是一个可调用对象(函数、函数对象或 Lambda 表达式),用于定义元素之间的比较规则。 用途:通常作为参数传递给标准库中的排序函数或关联容器,以指定元素的顺序。…...

nslookup的使用

nslookup 是一个网络管理命令行工具,用于查询域名系统 (DNS) 服务器来获取有关主机名和IP地址的信息。它可以帮助你检查DNS记录、解析域名到IP地址或者执行反向查找(从IP地址找到对应的域名)。下面是 nslookup 的一些基本用法: 基…...

ES5 vs ES6:JavaScript 演进之路

ES5 vs ES6:JavaScript 演进之路 JavaScript版本演进ES5 (ECMAScript 5)ES6 (ECMAScript 2015)版本演进时间线为什么ES6如此重要? ES5 vs ES61. 变量声明对比2. 函数特性对比3. 类和对象4. 模块化5. 解构和展开6. 字符串和模板字面量7. 数组和对象新方法…...

函数式编程的核心

函数式编程 函数式编程(funcitonal programming)其实是个很古老的概念。 高阶函数和内存分析 函数式一阶公民 函数式编程最鲜明的特点就是:函数式一等公民,指的是函数与其他数据类型一样,处于平等地位,可…...

【易康eCognition实验教程】006:在影像上添加文本

在某些情况下,希望能在影像上面显示文本文字,例如,一个地图的名称或者是多时相影像分析的年或月的显示。此外,文本如果作为一个规则集导出的部分则可以被纳入数字影像中。如下图所示: 若要添加文本,在影像视…...

Django ORM自定义排序的实用示例

在使用Django进行开发时,ORM(对象关系映射)是一个非常强大的工具。它让我们可以用Python代码直接操作数据库,而不需要写SQL语句。当我们需要对数据进行排序时,Django ORM同样提供了丰富的功能。今天,我们就…...

【后端】【ubuntu】 ubuntu目录权限查看的几种方法

在Ubuntu中,有多种方式可以查看目录或文件的权限,以下为你详细介绍常见的指令及其使用方法: 1. ls -l 命令 这是最常用的查看文件和目录权限的命令,-l 选项用于以长格式列出文件和目录的详细信息,其中就包含权限信息…...