云顶之弈-测试报告_云顶之弈vue-CSDN博客

本文链接：https://blog.csdn.net/cj13106811623/article/details/139661190

前言

五子棋对战网页应用是一个基于Web技术的在线多人五子棋游戏。该应用提供了用户注册、登录、匹配对手、对战等功能，旨在为用户提供轻松愉快的游戏体验。本篇文章主要用来记录我的网页版五子棋项目，包括项目介绍、实现功能、测试用例、自动化测试等。

一、项目描述

该项目支持玩家随时随地与其他在线玩家进行五子棋对战，实现实时的棋局同步和即时通讯。利用 WebSocket 技术实现双向通信，保证游戏过程中的实时性和即时交互，提供更流畅的游戏体验。提供游戏大厅，展示在线玩家信息、排名和当前对局状态。内置匹配系统，自动匹配合适的对手，确保玩家能够享受到公平有趣的游戏。

技术栈：
前端：使用HTML5、CSS3、JavaScript以及现代前端框架（如React、Vue等）构建直观、响应式的用户界面。
后端：基于Spring MVC、Spring Boot等后端框架，使用WebSocket实现实时通信，处理用户认证、游戏逻辑和数据存储。
数据库：使用关系型数据库MySQL存储用户信息、对战历史等数据。
实时通信：使用WebSocket技术，实现玩家之间的实时通信和对战同步。
webSocket：是一个应用层协议。四个核心点：建立连接之后、收到消息之后、出现连接异常、出现连接关闭。客户端通过webSocket.send()发送消息，服务器使用sendMessage()发送消息。

二. 项目功能

1、注册功能——未注册的用户可以输入用户名和密码进行注册。

2、登录功能——用户注册完成账号之后，可以输入正确的用户名和密码进行登录

3、匹配功能——用户在游戏大厅页面点击“开始匹配”按钮，即可进行匹配，匹配到玩家之后会立即进入游戏页面。

4、对战功能——用户在游戏房间页面即可在棋盘中进行对弈。

三. 功能测试

1. 注册功能

注册之前的数据库

注册之后的数据库

2. 登录功能

3. 大厅匹配功能

4. 游戏房间功能

5. 获胜条件功能

四. 自动化测试用例

(1) 注册页面

根据注册页面的测试用例编写,对是否注册成功进行测试

    @Order(4)
    @Test
    @CsvSource
    public void RegisterSuccess() throws InterruptedException {
        //打开注册页面
        webDriver.get("http://127.0.0.1:8085/register.html");
        webDriver.manage().timeouts().implicitlyWait(3, TimeUnit.SECONDS);  //隐式等待时间

        String expected = "注册成功!";
        webDriver.findElement(By.cssSelector("#username")).clear();  //清除
        webDriver.findElement(By.cssSelector("#password")).clear();
        String name = System.currentTimeMillis()/1000+""; //根据时间戳获取一个随机字符串
        String password = System.currentTimeMillis()/1000+"";
        webDriver.findElement(By.cssSelector("#username")).sendKeys(name);
        webDriver.findElement(By.cssSelector("#password")).sendKeys(password);
        webDriver.findElement(By.cssSelector("#submit")).click();
        //强制等待0.1s,弹窗出现
        Thread.sleep(100);
        Alert alert = webDriver.switchTo().alert();
        String accept = alert.getText();  //返回警告窗的文本
        //比较断言判断
        Assertions.assertEquals(expected, accept);  //前面的值是预期,后面的是测试得到的值
        //确认
        alert.accept();
    }

(2) 登录页面

根据测试用例，我们对登录页面是否正常、登录失败、登录成功分别测试。
这里写出测试登录失败的逻辑：
1）清空登录框。防止多组登录；
2）登录，使用cssSelector选择器和sendkeys输入文本，csvSource准备好测试数据；
3）获取弹窗和弹窗中的提示信息；
4）使用assertion判断实际信息和提示信息是否一致，一致则登录成功。

    @Order(1)
    @ParameterizedTest
    @CsvFileSource(resources = "LoginSuccess.csv")
    public void LoginSuccess(String username, String password, String url) throws InterruptedException {

        //打开登录页面
        webDriver.get("http://127.0.0.1:8085/login.html");
        webDriver.manage().timeouts().implicitlyWait(3, TimeUnit.SECONDS);  //隐式等待时间
        //输入账号zhangsan
        webDriver.findElement(By.cssSelector("#username")).sendKeys(username);
        //输入密码
        webDriver.findElement(By.cssSelector("#password")).sendKeys(password);
        webDriver.manage().timeouts().implicitlyWait(3, TimeUnit.SECONDS);  //隐式等待时间
        //点击提交
        webDriver.findElement(By.cssSelector("#submit")).click();
        Thread.sleep(100);  强制等待0.1s，弹窗出现
        //弹窗点确认
        Alert alert = webDriver.switchTo().alert();
        //确认
        alert.accept();
        //获取当前页面的URL
        String cur_url = webDriver.getCurrentUrl();
        Assertions.assertEquals(url, cur_url);
        webDriver.manage().timeouts().implicitlyWait(3, TimeUnit.SECONDS);  //隐式等待时间
        //游戏大厅信息展示
        //用户名是zhangsan测试通过,反之不通过
        String cur_zhangshan = webDriver.findElement(By.cssSelector("#screen > span")).getText();
        Assertions.assertEquals(username, cur_zhangshan);  //前面的值是预期,后面的是测试得到的值

    }

(3) 游戏大厅页面

根据游戏大厅的测试用例，编写页面加载正常、检测用户登录、匹配按钮的测试代码。
其匹配按钮的测试代码逻辑如下：
1）由于点击匹配按钮需要是登录的状态下，所以先进行用户的登录；
2）登录后点击匹配按钮；
3）查看点击后的匹配按钮的状态是否发生变化；
4）再次点击按钮；
5）查看按钮是否恢复为开始匹配状态。

@Order(2)
    @Test
    public void game_hallSuccess() {
        String expected = "匹配中...(点击停止)";
        webDriver.findElement(By.cssSelector("#match-button")).click();
        webDriver.manage().timeouts().implicitlyWait(3, TimeUnit.SECONDS);  //隐式等待时间
        String accept = webDriver.findElement(By.cssSelector("#match-button")).getText();
        Assertions.assertEquals(expected, accept);
        //再次点击
        webDriver.findElement(By.cssSelector("#match-button")).click();
        String acceptAgain = webDriver.findElement(By.cssSelector("#match-button")).getText();
        //判断
        expected = "开始匹配";
        Assertions.assertEquals(expected, acceptAgain);
    }

(4) 游戏对战页面

根据测试用例对游戏匹配成功后游戏对战页面进行测试，主要测试点是页面上的棋盘和显示屏元素。
测试步骤：
1）防止多开，创建两个浏览器驱动（edgeDriver、webDriver)；
2）分别在两个浏览器上登录不同的账户；
3）登录成功后进入游戏大厅页面，分别点击开始匹配按钮；
4）匹配成功后进入游戏对战页面，寻找棋盘和显示屏两个标志元素。

@Order(3)
    @Test
    public void gameSuccess() throws InterruptedException {
        // 不同系统的两个用户匹配到同一个房间
        userLogin();
        // 测试游戏对战页面
        edgeDriver.findElement(By.cssSelector("#chess"));
        webDriver.findElement(By.cssSelector("#chess"));

    }

    private static void userLogin() throws InterruptedException {
        //打开第一个登录页面
        webDriver.get("http://127.0.0.1:8085/login.html");
        //输入账号zhangsan
        webDriver.findElement(By.cssSelector("#username")).sendKeys("zhangsan");
        //输入密码
        webDriver.findElement(By.cssSelector("#password")).sendKeys("123");
        //点击提交
        webDriver.findElement(By.cssSelector("#submit")).click();
        Thread.sleep(100);  强制等待0.1s，弹窗出现
        //弹窗点确认
        Alert alert = webDriver.switchTo().alert();
        //确认
        alert.accept();
        //进入游戏房间
        webDriver.findElement(By.cssSelector("#match-button")).click();
        webDriver.manage().timeouts().implicitlyWait(3, TimeUnit.SECONDS);  //隐式等待时间

        //打开第二个登录页面
        edgeDriver.get("http://127.0.0.1:8085/login.html");
        //输入账号lisi
        edgeDriver.findElement(By.cssSelector("#username")).sendKeys("lisi");
        //输入密码
        edgeDriver.findElement(By.cssSelector("#password")).sendKeys("123");
        //点击提交
        edgeDriver.findElement(By.cssSelector("#submit")).click();
        Thread.sleep(100);  强制等待0.1s，弹窗出现
        //弹窗点确认
        Alert alert2 = edgeDriver.switchTo().alert();
        //确认
        alert2.accept();
        //进入游戏房间
        edgeDriver.findElement(By.cssSelector("#match-button")).click();
        webDriver.manage().timeouts().implicitlyWait(3, TimeUnit.SECONDS);  //隐式等待时间
    }