【测试】——Cucumber项目实战

📖 前言：本文以一个在线鞋店作为测试网站，介绍Cucumber的项目实战。从环境搭建出发，介绍POM设计和相关页面测试的源码实现。通过这篇文章，可以初步掌握如何使用Cucumber进行自动化测试，并生成易于阅读和理解的测试报告。

---

🕒 1. 测试网站初探

🔎 测试网站

🕒 2. POM设计

项目树状图参考规划如下：

│ pom.xml
├─src
   ├─main
   │  ├─java
   │  └─resources
   └─test
       └─java
           │  allure.properties
           │  junit-platform.properties.properties
           │  
           ├─features
           │      GeneralUserView.feature
           │      LoggedIn.feature
           │      NewUserRegistration.feature
           │      
           ├─pages
           │      HomePage.java
           │      LoginPage.java
           │      OnlineProductsPage.java
           │      ProductCategoryPage.java
           │      RegistrationPage.java
           │      
           ├─runner
           │      TestRunner.java
           │      
           ├─stepDefinition
           │      HomePage.java
           │      LoginPage.java
           │      OnlineProductsPage.java
           │      ProductCategoryPage.java
           │      RegistrationPage.java
           │      
           └─utility
                   BrowserDriver.java                  

🕒 3. 环境搭建

创建Maven项目，JDK8及以上即可。

🔎 Maven Cucumber Java依赖项官网

🕘 3.1 Cucumber 相关插件

IDEA中去插件市场安装Cucumber for Java

随后粘贴依赖项至pom.xml即可，下面的cucumber-core与cucumber-JUnit4同理，注意与cucumber-java版本要匹配。

🕘 3.2 Chrome驱动

🔎 Chrome驱动下载

由于Chrome会自动更新的特性，每次更新后都需要下载与之匹配的新版本驱动，很麻烦，这里推荐一个依赖WebDriverManager

🔎 WebDriverManager-bonigarcia

<dependency>
    <groupId>io.github.bonigarcia</groupId>
    <artifactId>webdrivermanager</artifactId>
    <version>5.9.2</version>
    <scope>test</scope>
</dependency>

🕒 4. 登录页面举例

以下是写好的Cucumber登录页面示例

LoggedIn.feature：

  Feature: LoggedIn User View
    Scenario: Validate user is able to view after Login
      Given User navigates to the Login page
      When User successfully enters the log in details
      Then User should be able to view the product category page

含义：

• Feature（特性）：描述系统的一个功能或特性。在这里，它的功能是“已登录用户视图”，意味着用户成功登录后能够看到的界面或内容。
• Scenario（场景）：表示要验证的一个具体场景或用例，这里是“验证用户登录后能够查看的内容”。也就是说，场景的目标是验证用户在成功登录后是否能够看到预期的页面。
• Given（前置条件）：这是描述在测试开始之前，系统的初始状态。此处表示测试的前提条件是用户需要访问登录页面。
• When（事件发生时）：表示当某个动作或事件发生时的情况。在这里，用户输入了正确的登录信息，并成功登录。也就是说，系统应当已经验证了用户的身份，并允许其进入。
• Then（期望结果）：这是描述在前面的步骤之后，我们期望看到的结果。此处表示一旦用户成功登录后，系统应该显示产品类别页面，用户可以查看到相应内容。

🕘 4.1 获取元素Xpath

F12打开开发者工具 → 元素选择器选中元素 → 右键 → 复制Xpath

//*[@id="menuToggle"]/input

🕘 4.2 页面点击

package stepDefinition;

import io.cucumber.java.en.Given;
import static pages.HomePage.*;

public class HomePage {
    @Given("^User navigates to the Login page$")
    public void user_navigates_to_the_Login_page() throws Throwable {
        click_hamburger_menu();
        click_signIn_link();
    }
}

这段代码是一个 Cucumber 步骤定义类，用于实现一个功能步骤：用户从首页导航到登录页面。具体操作是点击“菜单”，然后点击“登录”链接。通过 @Given 注解，Cucumber 会将 .feature 文件中的步骤与这个 Java 方法绑定，在测试执行时，Cucumber 框架会自动调用该方法来模拟用户的行为。

注：上述@Given语句中，^和$是正则表达式中的语法。其中^表示字符串的开始，而$ 表示字符串的结束，结合使用是为了精确匹配文本。

package pages;

import io.github.bonigarcia.wdm.WebDriverManager;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;

public class HomePage {

    public static WebDriver driver;
    public static String hamburger_menu_xpath = "//*[@id=\"menuToggle\"]/input";
    public static String signIn_link_xpath = "//*[@id=\"menu\"]/a[2]/li";

    public static void click_hamburger_menu() throws InterruptedException {
        WebDriverManager.chromedriver().setup();
        driver = new ChromeDriver();
        driver.get("https://anupdamoda.github.io/AceOnlineShoePortal/index.html");
        Thread.sleep(2000);
        driver.findElement(By.xpath(hamburger_menu_xpath)).click();
    }

    public static void click_signIn_link() throws InterruptedException {
        Thread.sleep(2000);
        driver.findElement(By.xpath(signIn_link_xpath)).click();
    }
}

这段代码的功能是打开一个在线鞋店（测试网站）的首页，通过Xpath定位元素以实现模拟点击“菜单”和“登录”链接操作的功能。在执行过程中，使用了 Thread.sleep来等待页面加载和元素的可见性。

🕘 4.3 内容输入

package stepDefinition;

import io.cucumber.java.en.When;

import static pages.LoginPage.*;

public class LoginPage {
    @When("^User successfully enters the log in details$")
    public void user_successfully_enters_the_login_details() throws InterruptedException{
        sendkeys_username();
        sendkeys_password();
        click_login_btn();
    }
}

上述代码即传入账号与密码，随后按登录按钮。

package pages;

import org.openqa.selenium.By;
import utility.BrowserDriver;

public class LoginPage extends BrowserDriver {
    public static String username_text_xpath ="//*[@id=\"usr\"]";
    public static String login_btn_xpath ="//*[@id=\"second_form\"]/input";

    public static void sendkeys_username() throws InterruptedException {
        driver.findElement(By.xpath(username_text_xpath)).sendKeys("sa");
    }

    public static void click_login_btn() throws InterruptedException  {
        driver.findElement(By.xpath(login_btn_xpath)).click();
    }
}

通过调用driver的findElement方法进行点击操作。

🕘 4.4 文本匹配

package stepDefinition;

import io.cucumber.java.en.Then;

import static pages.ProductCategoryPage.*;

public class ProductCategoryPage {
    @Then("^User should be able to view the product category page$")
    public void product_category_validation() throws InterruptedException{
        visiblity_productCategory_formalShoes();
    }
}

上述代码即检查对应产品是否可见。

package pages;

import org.junit.Assert;
import org.openqa.selenium.By;
import utility.BrowserDriver;

import static org.junit.Assert.assertEquals;

public class ProductCategoryPage extends BrowserDriver {
    public static String productCategory_formalShoes = "//*[text()='Formal Shoes']";
    public static void visiblity_productCategory_formalShoes() throws InterruptedException{
        String actualProductCategory_fs = driver.findElement(By.xpath(productCategory_formalShoes)).getText();
        assertEquals("Formal Shoes",actualProductCategory_fs);
    }
}

通过调用driver的findElement方法获取文本，与预期值进行断言判断。

🕘 4.5 Runner类配置

package runner;

import io.cucumber.junit.CucumberOptions;

@CucumberOptions(
        features = "src/test/java/features",
        glue = {"utility", "stepDefinition"},
        plugin = {"pretty", "html:target/cucumber-html-report","json:cucumber.json"}
)
public class TestRunner {

}

这个运行类配置了 Cucumber 框架如何运行测试。它指定了要执行的 Feature 文件所在的位置；步骤定义（glue）的包或类的位置；测试结果的输出格式（通过 plugin 配置生成 HTML 和 JSON 格式的报告）。

插件功能：

• “pretty”：这个插件将会生成格式化后的控制台输出，便于开发者查看测试执行的详细信息。
• “html:target/cucumber-html-report”：这个插件生成 HTML 格式的测试报告，并将其输出到该文件夹。你可以在浏览器中查看生成的报告。
• “json:cucumber.json”：该插件生成 JSON 格式的测试报告，输出到 cucumber.json 文件中。这对于集成其他工具（如 Jenkins）或进一步的数据处理非常有用。

随后点击运行即可

注意，在运行时可能会报错，由于IDEA的依赖项缓存等问题，通常需要先使用Maven的clean后，再进行test。

此外，我们可以在IDE上编辑运行配置，这样就可以直接点这个“播放”按钮就能一键运行了。

🕒 5. Allure 报告

Allure 报告 是一个流行的开源工具，用于生成易于阅读和理解的自动化测试报告。它被广泛应用于自动化测试框架中，如 JUnit, TestNG, Cucumber 等，以便为开发人员、测试人员和项目经理提供清晰的测试执行结果。

插件安装：

Allure 报告的使用需要先下载Node.js，一路安装完成即可。

🔎 Node.js官网下载

先生成allure-results：

npm install -g allure-commandline --save-dev

后生成allure-report：

allure generate allure-results --clean -o allure-report

可视化图表：

🕒 6. 完整源码及讲解视频

🔎 源码-GitHub

🔎 视频讲解-Ace Automation Academy

---

OK，以上就是本期知识点“Cucumber项目实战”的知识啦~~ ，感谢友友们的阅读。后续还会继续更新，欢迎持续关注哟📌~
💫如果有错误❌，欢迎批评指正呀👀~让我们一起相互进步🚀
🎉如果觉得收获满满，可以点点赞👍支持一下哟~

❗ 转载请注明出处
作者：HinsCoder
博客链接：🔎 作者博客主页