企业官网建设流程全解析

本文以 go-admin 仓库 tests/web/README_CN.md 的功能测试清单为骨架，系统梳理 go-admin 后台管理系统的登录、导航、表格、表单、详情页与内置权限/角色/管理员/菜单管理等模块的验收测试覆盖范围，并结合 tests/web/web_test.go、tests/tables/user.go 等源码，逐项说明每个测试点在真实项目中的落地实现、对应 UI 组件与 XPath 定位方式。读完本文，你将掌握 go-admin Web 端功能验收测试的完整清单、UAT 测试框架的启动与运行机制，以及每个测试条目背后的表格字段配置与组件实现原理。

一、清单概览：测试覆盖了哪些界面能力

该清单是一份面向 go-admin 后台管理界面的功能测试覆盖表，按“模块 → 子功能 → 具体检查点”三级组织，使用[x]（已完成）与[ ]（待完成/未覆盖）标注状态。从清单可以看出，当前覆盖重点集中在表格页（含功能按钮、行更新、筛选、导出、列选择、列排序、列功能按钮）与表单页（组件显示、按钮显示、联动）两大类高频交互区域，同时对登录、导航栏、详情页及权限/角色/管理员/菜单的增删改查做了基础覆盖。

测试目标的载体是一个内置的用户表（users）测试页面，其完整字段与按钮配置位于 tests/tables/user.go：信息列表页定义了Name（可内联编辑、可模糊筛选）、Gender（自定义显示、开关编辑、单选筛选）、Experience、Drink（下拉筛选）、City（可筛选）、Book（联表字段）、Avatar、CreatedAt（时间范围筛选）、UpdatedAt等字段，并挂载了jump、popup、ajax三个顶部功能按钮与google、Audit、Preview三个行级操作按钮。清单中几乎所有表格类检查点，都能在这个测试表上找到对应的真实配置。

二、测试框架：Web 端 UAT 自动化测试是怎么跑起来的

在逐项拆解清单之前，先了解清单背后的执行框架，这有助于理解每个[x]检查点的验证方式。

2.1 测试入口与执行流程

清单对应的自动化实现是TestWeb函数，位于 tests/web/web_test.go。它通过UserAcceptanceTestSuit依次执行：

func TestWeb(t *testing.T) { UserAcceptanceTestSuit(t, func(_ *testing.T, page *Page) { defer page.Destroy() testLogin(page) testInfoTablePageOperations(page) testNewPageOperations(page) testEditPageOperations(page) testDetailPageOperations(page) testRolePageOperations(page) testPermissionPageOperations(page) testMenuPageOperations(page) testManagerPageOperations(page) testPermission(page) }, startServer, debugMode, optionList...) }

执行链路是：启动测试用 go-admin 服务（gin + admin 插件）→ 拉起 ChromeDriver → 打开无头浏览器页面 → 按顺序跑各模块用例 → 关闭窗口与驱动 → 关闭测试服务。

2.2 浏览器驱动与页面封装

驱动与页面操作封装在 tests/web/test.go 与 tests/web/page.go：

• 浏览器驱动：基于github.com/sclevine/agouti启动 ChromeDriver，默认启用--headless（非本机调试时）、--window-size=1500,900、--incognito等参数；本机调试模式（最后一个命令行参数为true时）则关闭 headless 便于肉眼观察。
• 页面断言封装：Page结构体提供了Contain（页面 HTML 包含某文本）、NoContain（不包含）、Css（校验 CSS 样式值）、Text（校验元素文本）、Value（校验表单值）、Click（点击并等待）、Fill（填充输入框）、NavigateTo（跳转并等待）等断言方法，所有用例的[x]状态最终都由这些断言给出结论。

2.3 测试服务与数据库准备

测试服务端同样定义在 tests/web/web_test.go：使用engine.Default()加载 admin 插件、注册posts/authors/external三个内置生成器并额外添加user生成器，从 tests/web/config.json 读取数据库配置（默认指向 MySQL 的go-admin-test库），最后监听:9033端口。测试页 URL 统一由http://localhost:9033/admin前缀拼接而成（见 tests/web/test.go）。

与之配套的是 API 层面的黑盒测试： tests/test.go 中的Cleaner会先清空goadmin_users、goadmin_roles、goadmin_permissions、goadmin_menu等内置表并重置自增、灌入 admin/operator 两个预置账号与菜单数据，保证每次测试环境一致；tests/common/common.go 的Test/ExtraTest则通过 httpexpect 对登录、权限、角色、管理员、菜单、操作日志、外部数据源与普通表格接口做 HTTP 级验证。

三、登录与导航栏测试

3.1 登录（3 项）

清单中登录模块包含 3 个检查点：

已完成的“正确账号密码”用例实现为：跳转/admin/login→ 通过 XPath//*[@id="username"]、//*[@id="password"]填充admin/admin→ 点击Login按钮 → 等待 3 秒后断言页面包含main-header（登录成功进入主框架的标志）。错误密码场景可从 tests/test.go 预置的 bcrypt 密码（如$2a$10$TEDU/aUxLkr2wCxGxI62/...）反向构造断言，但尚未写成 UAT 用例。

3.2 导航栏与侧边栏（3 项）

侧边栏菜单点击在菜单管理用例中已落地，例如 tests/web/web_test.go 通过sideBarManageDropDown展开侧边栏的 Admin 分组、点击menuPageBtn进入菜单管理页。navLinkBtn与navCloseBtn（顶部导航链接的打开与关闭）的 XPath 常量已定义在 tests/web/web_test.go，对应用例暂时被注释，说明导航链接的“显示-点击-关闭”已具备定位基础但仍待正式启用。

四、表格页面测试（重点覆盖区）

表格页是清单中条目最密集、完成度最高的模块，共分 8 个子类。所有检查点围绕 tests/tables/user.go 的 users 表信息页展开，页面路由为/admin/info/user。

4.1 功能按钮（3 项，全部完成）

这里体现了 go-admin 表格页三类“动作按钮”的完整形态：弹窗（PopUp）、异步请求（Ajax）、字段筛选（FieldFilter），其定义分别位于 template/types/action/popup.go、template/types/action/ajax.go、template/types/action/fieldfilter.go。

4.2 行更新（2 项）

4.3 筛选框（3 项）

筛选框的字段级开关由FieldFilterable系列方法控制，筛选表单布局可通过SetFilterFormLayout(form.LayoutThreeCol)指定（tests/tables/user.go）。

4.4 导出功能（3 项）

导出接口的 HTTP 层验证已存在：tests/common/normal.go 中POST /export/user返回 200 即为通过。

4.5 列选择（1 项，完成）

列选择按钮显示选择点击[x]：用例点击rowSelector展开列选择菜单，勾选City、Avatar两列后提交，随后断言页面不再包含guangzhou（即该列已被隐藏），验证列显隐切换生效（tests/web/web_test.go）。

4.6 列排序（2 项，完成）

正序[x]、倒序[x]：ID字段配置了FieldSortable()（tests/tables/user.go）；用例连续点击idOrderBtn（//*[@id="sort-id"]）两次，分别触发正序与倒序切换（tests/web/web_test.go）。排序能力在 tests/tables/posts.go 中同样以FieldSortable()配置。

4.7 列功能按钮（2 项，完成）

行级操作按钮通过info.AddActionButton注册（tests/tables/user.go），与顶部功能按钮（info.AddButton）是两套独立的按钮体系。

4.8 按钮的隐藏（10 项，全部未完成）

清单中列出的可隐藏元素包括：筛选框、新建按钮、导出按钮、编辑按钮、删除按钮、详情按钮、筛选按钮、列选择按钮、分页条、查询信息。这些元素在 go-admin 中均有对应的全局开关或字段级配置：

• 新建/编辑/删除/导出按钮对应 tests/tables/user.go 中table.Config的CanAdd、Editable、Deletable、Exportable四个开关；
• 筛选区域由筛选表单控制，可通过字段筛选配置决定筛选项数量；
• 分页条与查询信息由信息面板配置控制。

该项待补充的用例本质上是验证“开关关闭后对应 UI 元素不再渲染”，属于配置驱动型测试。

4.9 列的显示（14 项，全部未完成）

这部分对应 go-admin 表格列的14 种显示类型，均为InfoPanel提供的显示链方法，定义集中位于 template/types/info.go：

各显示类型的具体渲染实现位于 template/types/display 目录（bool.go、image.go、progressbar.go、qrcode.go、carousel.go、copy.go、date.go、dot.go、downloadable.go、filesize.go、icon.go、label.go、link.go、loading.go）。这些检查点尚未编写 UAT 用例，但其“显示链”机制已经完整，属于测试用例缺口而非功能缺口。

五、表单页面测试

表单页测试对象是 users 表的新建/编辑表单，表单字段配置在 tests/tables/user.go，并按 Tab 分组：input组（文本、数字、URL、邮箱、日期时间、密码、IP、多文件、货币、富文本）与select组（开关、SelectBox、单选、下拉、radio 等），由SetTabGroups/SetTabHeaders控制（tests/tables/user.go）。

5.1 组件显示（15 项）

已完成 4 项：

待完成 11 项：富文本（Content字段form.RichText，带文件上传，tests/tables/user.go）、单/多文件选择（Cert字段form.Multifile，maxFileCount: 10）、时间选择（Birthday字段form.Datetime）、时间选择范围、Array 组件、Table 组件（AddTable定义于 template/types/form.go）、IconPicker（菜单页已用，见 tests/web/web_test.go）、滑动组件、代码组件（form.Code类型判断位于 template/types/form.go）、数字组件（Age字段form.Number）、数字范围组件、自定义字段（CustomContent/CustomJs/CustomCss支持位于 template/types/form.go）。

5.2 按钮显示（3 项，完成）

5.3 联动（6 项，未完成）

联动检查点chooseMapJS、chooseJS、chooseAjax、chooseHideJS、chooseShowJS、chooseDisableJS对应表单字段的联动手法。源码中已有完整示例：

• chooseAjax（异步联动）：Country字段配置FieldOnChooseAjax("city", "/choose/country", ...)，选择国家后异步返回城市选项（北京/上海/广州/深圳等，tests/tables/user.go）；
• chooseJS/chooseMapJS/chooseHideJS/chooseShowJS/chooseDisableJS：对应template/types/form.go中choose*系列的联动表单配置能力，这些 UI 联动的对应模板位于 template/types/tmpls（choose.tmpl、choose_ajax.tmpl、choose_custom.tmpl、choose_disable.tmpl、choose_hide.tmpl、choose_map.tmpl、choose_show.tmpl）。

上述联动配置能力均已存在，但都还没有对应的浏览器交互用例。

六、详情页与内置管理模块测试

6.1 详情页

清单中“详情页”暂无勾选项，对应的testDetailPageOperations目前是空实现（tests/web/web_test.go），但详情页路由（detailBtn、预览弹层previewPopup）与详情展示的 XPath 均已定义。详情接口的 HTTP 层已由 tests/common/api.go 之外的外部数据源用例部分覆盖（tests/common/external.go 验证/info/external/edit返回 200）。

6.2 权限、角色、管理员的增删改查

清单将权限、角色、管理员三块的“增删改查”整体列出，其中管理员子项有两项已完成：

这三块的 CRUD 接口与数据由 tests/common/common.go 中的permissionTest、roleTest、managerTest通过 HTTP 黑盒方式覆盖（权限、角色、管理员、操作日志均在内），而浏览器端用例（testRolePageOperations、testPermissionPageOperations）暂时留空待补。

6.3 菜单的增删改查

菜单模块是 UAT 用例完成度最高的内置管理模块（testMenuPageOperations，tests/web/web_test.go）：

菜单编辑用例还验证了headFieldInput（标题）修改并保存后生效（tests/web/web_test.go）。

七、清单状态总结与扩展建议

综合 tests/web/README_CN.md 与源码实现，可以得出如下结论：

1. 完成度最高的区域是表格页与表单页的“主交互路径”：弹出/Ajax 按钮、内联文本编辑、筛选、导出、列显隐、列排序、单/多选组件、保存/重设/继续编辑，均有可运行的 agouti 浏览器用例支撑。
2. 大量未勾选项并非功能缺失而是用例缺口：14 种列显示类型、15 种表单组件、6 种联动方式在 template/types/info.go 与 template/types/form.go 中均已实现，测试表 tests/tables/user.go 也挂载了相应字段配置，只差对应的浏览器交互断言。
3. 按钮隐藏类检查点适合做成配置驱动测试：通过调整 tests/tables/user.go 中table.Config的CanAdd/Editable/Deletable/Exportable开关，即可断言对应按钮的渲染与隐藏。
4. 登录验证码、菜单排序、三级菜单等条目需要依赖验证码插件（plugins/admin/modules/captcha）与树形拖拽的进一步支持，属于待扩展的功能测试范围。

对于希望为 go-admin 补充 UAT 覆盖的开发者，建议的路径是：参照 tests/web/web_test.go 中已有的 XPath 常量与Page断言方法（tests/web/page.go），按清单逐项补齐testDetailPageOperations、testRolePageOperations、testPermissionPageOperations等空实现，并优先处理“列显示”“表单组件”“按钮隐藏”三组高密度检查点，从而让清单整体从“核心交互已覆盖”走向“全功能矩阵覆盖”。