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

文章目录

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


一、项目背景

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

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

  • 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 WeChatDriver


class 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)  # 强制等待 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):
        """登录状态下消息详情页测试(方法名建议改为 test_message_details)"""
        
        # 验证消息图标存在性
        # 使用层级过深的选择器,容易受页面结构变化影响
        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)有时候出现卡顿,需重新打开编写的自动化脚本软件。

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

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

  • 增加浏览器兼容性验证

  • 补充性能测试场景


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/981134.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

FinRobot:一个使用大型语言模型进行金融分析的开源AI代理平台

文章目录 前言一、生态系统1. 金融AI代理(Financial AI Agents)2. 金融大型语言模型(Financial LLMs)3. LLMOps4. 数据操作(DataOps)5. 多源LLM基础模型(Multi-Source LLM Foundation Models&am…

【软考-架构】1.3、磁盘-输入输出技术-总线

GitHub地址:https://github.com/tyronczt/system_architect ✨资料&文章更新✨ 文章目录 存储系统💯考试真题输入输出技术💯考试真题第一题第二题 存储系统 寻道时间是指磁头移动到磁道所需的时间; 等待时间为等待读写的扇区…

USRP4120-通用软件无线电平台

1、产品描述 USRP4120平台是彬鸿科技公司推出的以XILINX XC7Z020 SOC处理器为核心,搭配ADI AD9361射频集成芯片,针对无线通信系统科研与教学实验场景的一款通用软件无线电平台。产品频率范围70MHz~6GHz,模拟带宽200KHz~56MHz,支持…

MAVEN的安装和配置指南【超详细】

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 前言一、安装Maven1.下载适合自己的版本2.配置环境变量3.验证环境变量是否配置成功 二、MAVEN的配置1.配置本地仓库2.配置镜像仓库3.创建一个简单的Maven项目 总结 …

数据结构:二叉搜索树(排序树)

1.二叉搜索树的定义 二叉搜索树要么是空树,要么是满足以下特性的树 (1)左子树不为空,那么左子树左右节点的值都小于根节点的值 (2)右子树不为空,那么右子树左右节点的值都大于根节点的值 &#…

Observability:使用 Elastic Agent 跟踪你的 Steam Deck 游戏

作者:来自 Elastic AndersonQ 让我们以不同的方式看待可观察性,并使用我们最喜欢的工具来监控我们的游戏性能。今天,我们将探讨如何使用 Elastic Agent 来监控 Steam Deck,以便我们可以看到我们玩得最多的游戏、它们消耗了多少资源…

20250227解决飞凌OK3588-C的linux R4通过adb拷贝文件速度过慢的问题

20250227解决飞凌OK3588-C的linux R4通过adb拷贝文件速度过慢的问题 2025/2/27 16:51 缘起:最近测试OK3588-C的最新的R1版本的SDK,adb pull的速度为28.8 MB/s Z:\version\OK3588-C_Linux5.10.209Qt5.15.10_用户资料_R1 我司使用4线的USB2.0,…

cesium+vue3自定义HTML实体弹窗、加高德路网、防实体漂浮、让用户画圆、鹰眼

一、基础使用:Cesium.js基础使用(vue)-CSDN博客 1、基础路径 为 Cesium 库设置一个全局变量 CESIUM_BASE_URL,用于指定 Cesium 的资源文件(如 WebGL shaders、纹理、字体等)的 示例场景:假设你…

C# Unity 唐老狮 No.4 模拟面试题

本文章不作任何商业用途 仅作学习与交流 安利唐老狮与其他老师合作的网站,内有大量免费资源和优质付费资源,我入门就是看唐老师的课程 打好坚实的基础非常非常重要: 全部 - 游习堂 - 唐老狮创立的游戏开发在线学习平台 - Powered By EduSoho 如果你发现了文章内特殊的字体格式,…

Docker 学习(二)——基于Registry、Harbor搭建私有仓库

Docker仓库是集中存储和管理Docker镜像的平台,支持镜像的上传、下载、版本管理等功能。 一、Docker仓库分类 1.公有仓库 Docker Hub:官方默认公共仓库,提供超过10万镜像,支持用户上传和管理镜像。 第三方平台:如阿里…

Oracle 数据库基础入门(四):分组与联表查询的深度探索(上)

在 Oracle 数据库的学习进程中,分组查询与联表查询是进阶阶段的重要知识点,它们如同数据库操作的魔法棒,能够从复杂的数据中挖掘出有价值的信息。对于 Java 全栈开发者而言,掌握这些技能不仅有助于高效地处理数据库数据&#xff0…

Lua | 每日一练 (4)

💢欢迎来到张胤尘的技术站 💥技术如江河,汇聚众志成。代码似星辰,照亮行征程。开源精神长,传承永不忘。携手共前行,未来更辉煌💥 文章目录 Lua | 每日一练 (4)题目参考答案线程和协程调度方式上…

我代表中国受邀在亚马逊云科技全球云计算大会re:Invent中技术演讲

大家好我是小李哥,本名叫李少奕,目前在一家金融行业公司担任首席云计算工程师。去年5月很荣幸在全球千万名开发者中被选为了全球亚马逊云科技认证技术专家(AWS Hero),是近10年来大陆地区仅有的第9名大陆专家。同时作为…

C++蓝桥杯基础篇(七)

片头 嗨~小伙伴们,大家好!今天我们来一起学习蓝桥杯基础篇(七),学习相关字符串的知识,准备好了吗?咱们开始咯! 一、字符与整数的联系——ASCII码 每个常用字符都对应一个-128~127的…

显式 GC 的使用:留与去,如何选择?

目录 一、什么是显式 GC? (一) 垃圾回收的基本原理 (二)显式 GC 方法和行为 1. System.gc() 方法 2. 显式 GC 的行为 (三)显式 GC 的使用场景与风险 1. JVM 如何处理显式 GC 2. 显式 GC…

2025.03.03(第一天)

1、常见的高危端口号有哪些,并涉及到哪些攻击方式 端口号服务常见攻击方式21FTP匿名登录、文件上传漏洞22SSH暴力破解、密钥泄露、中间人攻击53DNSDNS劫持、DNS缓存投毒、DDoS放大攻击80/443HTTP/HTTPSSQL注入1433MSSQL暴力破解、SQL注入、远程代码执行3306MySQLSQ…

MySQL数据库基本概念

目录 什么是数据库 从软件角度出发 从网络角度出发 MySQL数据库的client端和sever端进程 mysql的client端进程连接sever端进程 mysql配置文件 MySql存储引擎 MySQL的sql语句的分类 数据库 库的操作 创建数据库 不同校验规则对查询的数据的影响 不区分大小写 区…

确保移动设备上机器学习的安全性:挑战与最佳实践

随着企业不断推出更智能、个性化且响应迅速的体验,AI处理能力在移动设备中的普及,促使了机器学习(ML)本地集成的应用和SDK的快速发展。2024年谷歌I/O大会报告中强调了这一趋势,谷歌鼓励开发者在移动应用中使用本地机器…

【Mac】2025-MacOS系统下常用的开发环境配置

早期版本的一个环境搭建参考 1、brew Mac自带终端运行: /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" Installation successful!成功后运行三行命令后更新环境(xxx是mac的username&a…

计算机毕业设计SpringBoot+Vue.js美食推荐系统商城(源码+文档+PPT+讲解)

温馨提示:文末有 CSDN 平台官方提供的学长联系方式的名片! 温馨提示:文末有 CSDN 平台官方提供的学长联系方式的名片! 温馨提示:文末有 CSDN 平台官方提供的学长联系方式的名片! 作者简介:Java领…