技术栈Spring Boot 2.7 React 18 JWT测试栈JUnit 5API 集成 Playwright全链路 E2E适用场景企业知识库 / 管理后台 / AI 问答类 B 端系统项目仓库company-knowledge-devlop摘要企业知识库项目实测JUnit 21 项 Playwright 19 项全绿并挖出聊天会话 500、删除状态码等 2 个上线前 Bug。附完整目录结构与命令。开篇为什么 2026 年还在「Postman 点一点、浏览器刷一刷」很多团队的真实联调流程是这样的后端改了个接口前端不知道字段变了前端页面能打开但 401 / 403 权限没人测上线前临时测登录 列表核心业务一条都没覆盖出了 Bug 才发现聊天会话删除 500、文档删除状态码不一致……这些问题不是「人不够细心」而是缺少分层自动化。我们最近在一个Spring Boot React 企业知识库项目里落地了完整方案结果很直观测试层工具用例数结果后端 API 集成JUnit 5 Spring Boot Test21全绿前后端 API 联调Playwright Request11全绿前端页面 UIPlaywright Browser8本机装浏览器即可跑合计 30 自动化用例覆盖认证、文档、搜索、问答、权限、管理后台页面。一、当前项目的测试方案确认是的本项目采用JUnit 5 Playwright双层组合层级技术栈代码位置后端 API 集成JUnit 5 Spring Boot Test TestRestTemplatebackend/src/test/java/.../integration/前后端 E2EPlaywrightTypeScriptAPI UI 双模式e2e/tests/一句话JUnit 负责「接口对不对」Playwright 负责「用户用起来对不对」。二、2026 推荐测试金字塔为什么不只用一个工具工具擅长不擅长JUnit Spring Boot Test启动真实 Spring 容器、测鉴权与事务、速度快测不了浏览器渲染、测不了前端路由Playwright真实浏览器 HTTP Request、自动起前后端、截图录屏不适合替代细粒度单元测试三、JUnit 5 后端集成21 项用例怎么设计3.1 测试 Profile 隔离外部依赖# backend/src/test/resources/application-test.properties spring.datasource.urljdbc:h2:mem:kbtest embeddings.enabledfalse milvus.enabledfalse wechat.mp.enabledfalse deepseek.api.key用 H2 内存库 关闭 AI/向量/微信测试不依赖外网 KeyCI 也能稳定跑。3.2 测试类拆分推荐backend/src/test/java/.../integration/ ├── AuthIntegrationTest.java # 登录、JWT、401 ├── FeatureApiIntegrationTest.java # 文档/搜索/问答/权限主战场 ├── ApiSmokeIntegrationTest.java # 部门/审计/公众号历史 └── IntegrationTestSupport.java # 登录与 Bearer 工具3.3 典型用例会话隔离安全类必测Test void chatSessionShouldBeIsolatedBetweenUsers() { // admin 创建会话 restTemplate.exchange(/api/chat, POST, adminRequest, ChatResponse.class); // user 尝试读取 admin 会话 → 必须 403 ResponseEntityString hijack restTemplate.exchange( /api/chat/history/ sessionId, GET, userHeaders, String.class); assertThat(hijack.getStatusCode()).isEqualTo(HttpStatus.FORBIDDEN); }3.4 运行命令cd backend mvn test四、Playwright E2E11 条 API 8 个页面4.1 目录结构e2e/ ├── playwright.config.ts # 自动拉起 backend frontend ├── fixtures/auth.ts # 登录复用 ├── tests/ │ ├── api.integration.spec.ts # 纯 API不启浏览器快 │ └── ui.integration.spec.ts # 页面联调 └── package.json4.2 端口冲突怎么破很多开发者机器8080 已被其他 Java 服务占用。E2E 默认端口改为8088 / 3008并通过setupProxy.js动态代理// frontend/src/setupProxy.js const target process.env.REACT_APP_API_PROXY || http://localhost:8080; app.use(/api, createProxyMiddleware({ target, changeOrigin: true }));Playwright 启动时注入REACT_APP_API_PROXY: http://127.0.0.1:80884.3 UI 测试侧边栏全页面巡检const pages [ { nav: 文档列表, heading: 文档列表 }, { nav: 知识搜索, heading: 知识搜索 }, { nav: 智能问答, heading: 智能问答 }, { nav: 公众号文章, heading: 公众号文章生成 }, ]; for (const item of pages) { await page.getByRole(button, { name: item.nav }).click(); await expect(page.getByRole(heading, { name: item.heading })).toBeVisible(); }4.4 运行命令cd e2e npm install npx playwright install chromium npm test一键全量./scripts/run-integration-tests.sh默认 E2E 账号admin/admin123HTML 报告e2e/playwright-report/index.html五、自动化测试挖出的 2 个真 BugBug 1清除聊天会话返回 500现象DELETE /api/chat/history/{sessionId}报错根因JPA 删除方法缺事务修复ChatService.clearSession()加TransactionalBug 2删除文档状态码断言失败现象测试期望 200接口实际 204结论接口行为正确REST 规范测试断言过严修复断言改为isIn(OK, NO_CONTENT)自动化测试的价值不只是绿条而是把隐藏 Bug 在上线前揪出来。六、30 项测试清单团队 Checklist认证与安全[ ] 健康检查可匿名访问[ ] 正确密码返回 JWT[ ] 错误密码 400[ ] 未登录访问业务接口 401[ ] 普通用户访问审计日志 403[ ] 聊天会话跨用户访问 403文档与知识[ ] 文档上传 / 搜索 / 详情 / 删除[ ] 未索引文档列表[ ] 知识条目列表[ ] 文本搜索 / 语义搜索AI 与业务[ ] 智能问答无外部 Key 时本地兜底[ ] 聊天历史记录[ ] 清除会话[ ] 公众号文章历史接口管理后台[ ] 用户列表SUPER_ADMIN[ ] 部门列表[ ] 审计日志分页前端页面Playwright UI[ ] 登录页渲染[ ] 仪表盘数据加载[ ] 文档/上传/搜索/问答/公众号页可打开[ ] 用户/部门/审计管理页可打开[ ] 问答可发送消息[ ] 退出登录回登录页七、给技术负责人的 3 条建议先 JUnit 后 PlaywrightAPI 不稳E2E 全是假红。测试必须脱离外网 KeyH2 test profileCI 才稳定。E2E 端口要可配置8080 冲突是团队联调第一杀手。八、结语前后端分离项目最容易失控的不是代码量而是联调回归成本。我们用JUnit 5 守住后端契约Playwright 守住用户路径把 30 项核心能力变成可重复执行的流水线。如果你也在做 Spring Boot React 的 B 端系统知识库、工单、运营后台这套JUnit Playwright双层方案可以直接照搬。知识库自动化测试演示地址https://www.qdzjkf.com/knowledgeWeb/超级管理账号: admin 密码xlh12345管理员账号manager 密码 admin123普通账号user 密码 user123