网页聊天系统测试

寻星探路

发布于 2025-12-17 19:36:02

2000

文章被收录于专栏：CSDN博客CSDN博客

以网页聊天系统为例，基于web项目进行完整的自动化实战。

http://101.43.139.79:8080/login.html

一、项目背景

随着实时沟通需求增长，传统社交平台的冗余功能难以满足轻量化交流场景。本项目基于 Spring Boot 开发网页聊天室，通过 WebSocket 实现多用户实时文字交互，支持消息记录保存。

前端采用响应式设计，分左右布局展示会话列表与聊天界面；后端以 Spring Boot 为核心，定义消息请求 / 响应模型及会话管理类，确保高效通信。

该项目为即时通讯提供可扩展方案，适用于团队协作、小型社群等场景，展现 Spring Boot 在实时应用中的优势。

二、项目功能

这个系统主要实现了以下几个功能：登录、与好友创建会话、好友时间实时会话聊天等。

1）登录

输入用户名以及密码，登录成功后就会跳转到用户页面。

用户页面分为左侧和右侧，左侧最上面是用户名，下面是消息区域按钮、好友区域按钮，点击消息区域按钮会在左侧显示会话消息区域，点击好友区域按钮会显示已添加的好友。

2）创建消息会话

点击一个好友，此时与该好友创建了一个消息会话，可以进行消息的发送。

3）实时会话聊天

给好友发送一个消息，登录好友账号后好友那边会同时收到该消息。

三、测试计划

1、测试用例

2、功能测试（执行测试操作以及截图）

2.1登录测试

1）输入正确的用户名和密码

2）输入错误的账号和密码

3）输入正确的账号和错误的密码

4）输入错误的账号和正确的密码

5）不输入账号和密码

6）输入账号，不输入密码

7）不输入账号，输入密码

8）通过聊天界面链接跳过登录页面进入主页

测试结果符合预期，未登录的用户无法通过聊天界面链接直接进入，弹窗提示用户未登录，点击确定跳回登录页面。

测试总结：

本次登录功能测试共覆盖了8/8个测试用例，没有发现bug！！！

2.2消息列表功能

1）会话区域点击会话后右侧会变为相对应的对话框

2）会话区域显示所有有过聊天的会话昵称和最近的一条消息

3）点击一个会话发送消息后，此时这个会话会置顶

测试总结：

本次消息列表功能测试共覆盖了3/3个测试用例，未发现bug。

2.3通讯录功能测试

1）左侧通讯录显示所有好友的昵称

2）与当前好友在消息列表中存在会话

点击一个好友后将该会话在消息列表中置顶

3）与当前好友在消息列表中不存在会话

点击好友后会在消息列表自动创建一条会话，并且右侧显示对话框

测试总结：

本次通讯录功能测试共覆盖了3/3个测试用例，未发现bug。

2.4通信功能测试

1）不指定联系人，直接从键盘输入

2）指定联系人，鼠标定位输入框，并且输入文本内容后点击发送按钮

3）指定联系人，鼠标定位输入框，并且输入表情包后点击发送按钮

zhangsan视角：

lisi视角：

均成功显示！！！

4）指定联系人，鼠标定位输入框，并且输入带有空格换行的内容后点击发送按钮

结果只显示空格，不显示换行！！！

测试总结：

本次通信功能测试一共覆盖了4/4个测试用例，发现一个bug，发送的消息中不显示换行字符，定义为一般级别的bug。

3、selenium自动化测试

把需要的依赖先给导入：

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <groupId>com.example</groupId>
    <artifactId>chatroom_auto_test</artifactId>
    <version>1.0-SNAPSHOT</version>

    <properties>
        <maven.compiler.source>8</maven.compiler.source>
        <maven.compiler.target>8</maven.compiler.target>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    </properties>
    <dependencies>
        <!--驱动管理-->
        <dependency>
            <groupId>io.github.bonigarcia</groupId>
            <artifactId>webdrivermanager</artifactId>
            <version>5.8.0</version>
            <scope>test</scope>
        </dependency>
        <!--安装selenium库-->
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-java</artifactId>
            <version>4.0.0</version>
        </dependency>
        <!--屏幕截图-->
        <dependency>
            <groupId>commons-io</groupId>
            <artifactId>commons-io</artifactId>
            <version>2.6</version>
        </dependency>
        <dependency>
            <groupId>org.slf4j</groupId>
            <artifactId>slf4j-simple</artifactId>
            <version>1.7.36</version>
            <scope>runtime</scope>
        </dependency>
    </dependencies>
</project>

3.1登录页面自动化测试

    /**
     * 登录成功测试
     */
    public boolean loginSuccess() throws IOException, InterruptedException {
        try {
            // 检查登录框是否存在
            driver.findElement(By.cssSelector("body > div.login-container > div"));
            // 先清空框中的内容
            driver.findElement(By.cssSelector("#username")).clear();
            driver.findElement(By.cssSelector("#password")).clear();

            driver.findElement(By.cssSelector("#username")).sendKeys("zhangsan");// 账号输入框
            driver.findElement(By.cssSelector("#password")).sendKeys("123");// 密码输入框
            driver.findElement(By.cssSelector("#submit")).click();// 提交按钮
//        Thread.sleep(1000);
            // 等待登录成功弹窗出现
            wait.until(ExpectedConditions.alertIsPresent());
            Alert alert = driver.switchTo().alert();
            alert.accept();
//        Thread.sleep(2000);
            // 跳转页面后检查新页面的元素是否存在来判断是否跳转成功
            driver.findElement(By.cssSelector("body > div.client-container > div > div.left > div.user"));// 检查用户名是否存在
            driver.findElement(By.cssSelector("body > div.client-container > div > div.left > div.search"));// 检查搜索框是否存在
            driver.findElement(By.cssSelector("body > div.client-container > div > div.left > div.tab > div.tab-session"));// 检查消息列表按钮
            driver.findElement(By.cssSelector("body > div.client-container > div > div.left > div.tab > div.tab-friend"));// 检查通讯录按钮
            // 截屏
            screenShot(Thread.currentThread().getStackTrace()[1].getMethodName());

            return true; // 登录成功返回true
        } catch (Exception e) {
            return false; // 登录失败返回false
        }
    }

    /**
     * 登录失败
     * 输入正确的账号错误的密码
     */
    public void loginFail() throws InterruptedException {
        driver.findElement(By.cssSelector("#username")).sendKeys("zhangsan");// 账号输入框
        driver.findElement(By.cssSelector("#password")).sendKeys("890");// 密码输入框
        driver.findElement(By.cssSelector("#submit")).click();// 提交按钮
//        Thread.sleep(1000);
        // 等待登录失败弹窗出现
        wait.until(ExpectedConditions.alertIsPresent());
        Alert alert = driver.switchTo().alert();
        alert.accept();
//        Thread.sleep(2000);
    }

    /**
     * 登录失败
     * 不输入账号和密码
     */
    public void loginFailNoContent() throws InterruptedException {
        driver.findElement(By.cssSelector("#username")).clear();// 账号输入框
        driver.findElement(By.cssSelector("#password")).clear();// 密码输入框
        driver.findElement(By.cssSelector("#submit")).click();// 提交按钮
//        Thread.sleep(1000);
        // 等待登录失败弹窗出现
        wait.until(ExpectedConditions.alertIsPresent());
        Alert alert = driver.switchTo().alert();
        alert.accept();
//        Thread.sleep(2000);
    }

3.2 聊天对话自动化测试

    /**
     * 发送成功
     * 发送文本内容
     */
    public void sendSuccess() throws InterruptedException {
        try {
            // 一、发送消息
            // 点击消息列表按钮并等待元素可见
            WebElement sessionTab = wait.until(ExpectedConditions.visibilityOfElementLocated(
                    By.cssSelector("body > div.client-container > div > div.left > div.tab > div.tab-session")));
            sessionTab.click();

            // 点击第一个会话并等待加载完成
            WebElement firstSession = wait.until(ExpectedConditions.elementToBeClickable(
                    By.cssSelector("#session-list > li[message-session-id='2']")));
            firstSession.click();

            // 在发送区域输入内容
            String beforeSendMessage = "自动化测试 " + System.currentTimeMillis(); // 增加时间戳确保唯一性
            WebElement messageInput = wait.until(ExpectedConditions.visibilityOfElementLocated(
                    By.cssSelector("body > div.client-container > div > div.right > textarea")));
            messageInput.clear();
            messageInput.sendKeys(beforeSendMessage);

            // 点击发送按钮
            WebElement sendButton = driver.findElement(
                    By.cssSelector("body > div.client-container > div > div.right > div.ctrl > button"));
            sendButton.click();

            // 等待消息发送完成
            Thread.sleep(1000);

            // 二、校验 （新发送的消息位于最后面）
            // 正确获取消息容器（唯一）
            WebElement messageShow = wait.until(ExpectedConditions.visibilityOfElementLocated(
                    By.className("message-show")));

            // 在容器内部获取所有消息元素（含message类）
            List<WebElement> messages = messageShow.findElements(By.cssSelector(".message"));
            // 获取最后一条消息元素
            WebElement lastMessage = messages.get(messages.size() - 1);
            // 在最后一条消息内部定位<p>标签获取文本
            String afterSendMessage = lastMessage.findElement(By.cssSelector("p")).getText();

            // 验证消息是否发送成功
            assert beforeSendMessage.equals(afterSendMessage) :
                    "发送的消息与收到的消息不一致: 发送=" + beforeSendMessage + ", 收到=" + afterSendMessage;
        } catch (AssertionError e) {
            System.err.println("消息发送验证失败: " + e.getMessage());
            throw e; // 重新抛出以标记测试失败
        } catch (Exception e) {
            System.err.println("消息发送过程中发生错误: " + e.getMessage());
            throw e;
        }
    }

3.3通讯录自动化测试

   /**
     * 测试成功
     */
    public void testSuccess() {
        try {
            // 点击通讯录按钮并等待元素可点击
            WebElement friendTab = wait.until(ExpectedConditions.elementToBeClickable(
                    By.cssSelector("body > div.client-container > div > div.left > div.tab > div.tab-friend")));
            friendTab.click();

            // 获取第一个好友名称并点击
            WebElement firstFriend = wait.until(ExpectedConditions.visibilityOfElementLocated(
                    By.cssSelector("#friend-list > li:nth-child(1)")));
            String beforeFriendName = firstFriend.findElement(By.cssSelector("h4")).getText();
            firstFriend.click();

            // 等待会话列表更新
            Thread.sleep(500);

            // 获取消息列表中的第一个会话的昵称
            WebElement firstSession = wait.until(ExpectedConditions.visibilityOfElementLocated(
                    By.cssSelector("#session-list > li:nth-child(1)")));
            String afterFriendName = firstSession.findElement(By.cssSelector("h3")).getText();

            // 验证会话是否来到了消息列表的顶部
            assert beforeFriendName.equals(afterFriendName) :
                    "通讯录好友与会话列表好友不一致: 通讯录=" + beforeFriendName + ", 会话列表=" + afterFriendName;
        } catch (AssertionError e) {
            System.err.println("通讯录测试验证失败: " + e.getMessage());
            throw e;
        } catch (Exception e) {
            System.err.println("通讯录测试过程中发生错误: " + e.getMessage());
            throw new RuntimeException(e);
        }
    }

四、测试总结

public static void main(String[] args) throws IOException, InterruptedException {
        try{
        // 登录页面测试
        LoginPage loginPage = new LoginPage();
        loginPage.loginFail();
        loginPage.loginFailNoContent();

        // 检查登录成功后再继续其他测试
        if (!loginPage.loginSuccess()) {
            System.err.println("登录失败，终止测试");
            return;
        }

        // 通讯录测试
        AddressBookPage addressBookPage = new AddressBookPage();
        addressBookPage.testSuccess();

        // 发送消息测试
        MessageSendPage messageSendPage = new MessageSendPage();
        messageSendPage.sendSuccess();

    }catch(Exception e){
            System.err.println("测试失败：" + e.getMessage());
        e.printStackTrace();
    } finally{
            // 确保测试结束后关闭浏览器
            Utils.quit();
        }
    }