region-edit.spec.ts 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508
  1. import { test, expect } from '../../utils/test-setup';
  2. import { readFileSync } from 'fs';
  3. import { join, dirname } from 'path';
  4. import { fileURLToPath } from 'url';
  5. const __filename = fileURLToPath(import.meta.url);
  6. const __dirname = dirname(__filename);
  7. const testUsers = JSON.parse(readFileSync(join(__dirname, '../../fixtures/test-users.json'), 'utf-8'));
  8. /**
  9. * 生成唯一区域名称
  10. * @param prefix - 名称前缀
  11. * @returns 唯一的区域名称
  12. */
  13. function generateUniqueRegionName(prefix: string = '测试区域'): string {
  14. const timestamp = Date.now();
  15. const random = Math.floor(Math.random() * 1000);
  16. return `${prefix}_${timestamp}_${random}`;
  17. }
  18. /**
  19. * 生成唯一区域代码
  20. * @param level - 区域层级
  21. * @returns 唯一的区域代码
  22. */
  23. function generateUniqueRegionCode(level: string): string {
  24. const timestamp = Date.now();
  25. return `${level.toUpperCase()}_${timestamp}`;
  26. }
  27. test.describe.serial('编辑区域测试', () => {
  28. // 用于跟踪测试创建的区域,以便清理
  29. const createdProvinces: string[] = [];
  30. test.beforeEach(async ({ adminLoginPage, regionManagementPage }) => {
  31. // 以管理员身份登录后台
  32. await adminLoginPage.goto();
  33. await adminLoginPage.login(testUsers.admin.username, testUsers.admin.password);
  34. await adminLoginPage.expectLoginSuccess();
  35. await regionManagementPage.goto();
  36. await regionManagementPage.waitForTreeLoaded();
  37. });
  38. test.afterEach(async ({ regionManagementPage }) => {
  39. // 清理测试创建的数据
  40. let cleanupSuccessCount = 0;
  41. let cleanupFailCount = 0;
  42. for (const provinceName of createdProvinces) {
  43. try {
  44. // 等待树形结构就绪后检查区域是否存在
  45. await regionManagementPage.waitForTreeLoaded();
  46. const exists = await regionManagementPage.regionExists(provinceName);
  47. if (exists) {
  48. const deleteSuccess = await regionManagementPage.deleteRegion(provinceName);
  49. if (deleteSuccess) {
  50. cleanupSuccessCount++;
  51. console.debug(`✅ 已清理测试数据: ${provinceName}`);
  52. } else {
  53. cleanupFailCount++;
  54. console.debug(`⚠️ 删除失败(无成功提示): ${provinceName}`);
  55. }
  56. } else {
  57. console.debug(`ℹ️ 区域不存在,跳过删除: ${provinceName}`);
  58. }
  59. } catch (error) {
  60. cleanupFailCount++;
  61. console.debug(`❌ 清理异常: ${provinceName}`, error);
  62. }
  63. }
  64. // 记录清理结果摘要
  65. console.debug(`🧹 测试数据清理: 成功 ${cleanupSuccessCount}, 失败 ${cleanupFailCount}`);
  66. // 如果有清理失败,记录警告但不阻塞测试
  67. if (cleanupFailCount > 0) {
  68. console.debug(`⚠️ 有 ${cleanupFailCount} 个区域清理失败,可能产生脏数据`);
  69. }
  70. // 清空跟踪列表
  71. createdProvinces.length = 0;
  72. });
  73. test.describe('编辑区域名称', () => {
  74. test('应该成功编辑区域名称', async ({ regionManagementPage }) => {
  75. // 首先创建一个测试省份
  76. const originalName = generateUniqueRegionName('测试省');
  77. await regionManagementPage.createProvince({
  78. name: originalName,
  79. code: generateUniqueRegionCode('PROV'),
  80. level: 1,
  81. });
  82. createdProvinces.push(originalName);
  83. // 等待树形结构刷新
  84. await regionManagementPage.waitForTreeLoaded();
  85. // 编辑区域名称
  86. const newName = generateUniqueRegionName('编辑后的省');
  87. const result = await regionManagementPage.editRegion(originalName, {
  88. name: newName,
  89. });
  90. // 验证编辑成功
  91. expect(result.success).toBe(true);
  92. expect(result.hasError).toBe(false);
  93. // 等待树形结构刷新
  94. await regionManagementPage.waitForTreeLoaded();
  95. // 验证列表中显示新名称
  96. const exists = await regionManagementPage.regionExists(newName);
  97. expect(exists).toBe(true);
  98. // 更新清理列表中的名称
  99. const index = createdProvinces.indexOf(originalName);
  100. if (index > -1) {
  101. createdProvinces[index] = newName;
  102. }
  103. });
  104. test('编辑后原名称不应存在', async ({ regionManagementPage }) => {
  105. const originalName = generateUniqueRegionName('测试省');
  106. await regionManagementPage.createProvince({
  107. name: originalName,
  108. code: generateUniqueRegionCode('PROV'),
  109. level: 1,
  110. });
  111. createdProvinces.push(originalName);
  112. await regionManagementPage.waitForTreeLoaded();
  113. const newName = generateUniqueRegionName('编辑后的省');
  114. const result = await regionManagementPage.editRegion(originalName, { name: newName });
  115. expect(result.success).toBe(true);
  116. await regionManagementPage.waitForTreeLoaded();
  117. // 验证原名称不存在
  118. const originalExists = await regionManagementPage.regionExists(originalName);
  119. expect(originalExists).toBe(false);
  120. // 验证新名称存在
  121. const newExists = await regionManagementPage.regionExists(newName);
  122. expect(newExists).toBe(true);
  123. // 更新清理列表
  124. const index = createdProvinces.indexOf(originalName);
  125. if (index > -1) {
  126. createdProvinces[index] = newName;
  127. }
  128. });
  129. });
  130. test.describe('修改区域代码', () => {
  131. test('应该成功修改行政区划代码', async ({ regionManagementPage }) => {
  132. const provinceName = generateUniqueRegionName('测试省');
  133. await regionManagementPage.createProvince({
  134. name: provinceName,
  135. code: 'OLD_CODE',
  136. level: 1,
  137. });
  138. createdProvinces.push(provinceName);
  139. await regionManagementPage.waitForTreeLoaded();
  140. // 修改代码
  141. const newCode = generateUniqueRegionCode('NEW');
  142. const result = await regionManagementPage.editRegion(provinceName, {
  143. code: newCode,
  144. });
  145. expect(result.success).toBe(true);
  146. expect(result.hasError).toBe(false);
  147. });
  148. test('应该能同时修改名称和代码', async ({ regionManagementPage }) => {
  149. const originalName = generateUniqueRegionName('测试省');
  150. await regionManagementPage.createProvince({
  151. name: originalName,
  152. code: 'OLD_CODE',
  153. level: 1,
  154. });
  155. createdProvinces.push(originalName);
  156. await regionManagementPage.waitForTreeLoaded();
  157. const newName = generateUniqueRegionName('新省名');
  158. const newCode = generateUniqueRegionCode('NEW');
  159. const result = await regionManagementPage.editRegion(originalName, {
  160. name: newName,
  161. code: newCode,
  162. });
  163. expect(result.success).toBe(true);
  164. expect(result.hasError).toBe(false);
  165. await regionManagementPage.waitForTreeLoaded();
  166. expect(await regionManagementPage.regionExists(newName)).toBe(true);
  167. // 更新清理列表
  168. const index = createdProvinces.indexOf(originalName);
  169. if (index > -1) {
  170. createdProvinces[index] = newName;
  171. }
  172. });
  173. });
  174. test.describe('区域状态切换', () => {
  175. test('应该成功禁用已启用的区域', async ({ regionManagementPage }) => {
  176. const provinceName = generateUniqueRegionName('测试省');
  177. console.debug(`创建省份: ${provinceName}`);
  178. await regionManagementPage.createProvince({
  179. name: provinceName,
  180. code: generateUniqueRegionCode('PROV'),
  181. level: 1,
  182. });
  183. createdProvinces.push(provinceName);
  184. // 等待树形结构加载完成
  185. await regionManagementPage.waitForTreeLoaded();
  186. // 验证区域存在并获取初始状态
  187. const exists = await regionManagementPage.regionExists(provinceName);
  188. expect(exists).toBe(true);
  189. const initialStatus = await regionManagementPage.getRegionStatus(provinceName);
  190. expect(initialStatus).toBe('启用');
  191. // 禁用区域
  192. const success = await regionManagementPage.toggleRegionStatus(provinceName);
  193. expect(success).toBe(true);
  194. // 等待树形结构刷新(toggleRegionStatus 内部已等待)
  195. await regionManagementPage.waitForTreeLoaded();
  196. // 验证状态已更新
  197. const newStatus = await regionManagementPage.getRegionStatus(provinceName);
  198. expect(newStatus).toBe('禁用');
  199. });
  200. test('应该成功启用已禁用的区域', async ({ regionManagementPage }) => {
  201. const provinceName = generateUniqueRegionName('测试省');
  202. await regionManagementPage.createProvince({
  203. name: provinceName,
  204. code: generateUniqueRegionCode('PROV'),
  205. level: 1,
  206. });
  207. createdProvinces.push(provinceName);
  208. await regionManagementPage.waitForTreeLoaded();
  209. // 先禁用
  210. await regionManagementPage.toggleRegionStatus(provinceName);
  211. await regionManagementPage.waitForTreeLoaded();
  212. // 验证已禁用
  213. const disabledStatus = await regionManagementPage.getRegionStatus(provinceName);
  214. expect(disabledStatus).toBe('禁用');
  215. // 再启用
  216. const success = await regionManagementPage.toggleRegionStatus(provinceName);
  217. expect(success).toBe(true);
  218. await regionManagementPage.waitForTreeLoaded();
  219. // 验证状态已恢复为启用
  220. const status = await regionManagementPage.getRegionStatus(provinceName);
  221. expect(status).toBe('启用');
  222. });
  223. test('取消状态切换应保持原状态', async ({ regionManagementPage }) => {
  224. const provinceName = generateUniqueRegionName('测试省');
  225. await regionManagementPage.createProvince({
  226. name: provinceName,
  227. code: generateUniqueRegionCode('PROV'),
  228. level: 1,
  229. });
  230. createdProvinces.push(provinceName);
  231. await regionManagementPage.waitForTreeLoaded();
  232. const initialStatus = await regionManagementPage.getRegionStatus(provinceName);
  233. expect(initialStatus).toBe('启用');
  234. // 打开状态切换对话框但取消
  235. await regionManagementPage.openToggleStatusDialog(provinceName);
  236. await regionManagementPage.cancelToggleStatus();
  237. // 验证状态未改变(不需要刷新页面)
  238. const currentStatus = await regionManagementPage.getRegionStatus(provinceName);
  239. expect(currentStatus).toBe(initialStatus);
  240. });
  241. });
  242. test.describe.skip('编辑子区域 - TODO: 需要修复 createChildRegion 功能', () => {
  243. test('应该成功编辑市级区域名称', async ({ regionManagementPage, page }) => {
  244. const provinceName = generateUniqueRegionName('测试省');
  245. const originalCityName = generateUniqueRegionName('测试市');
  246. // 创建省和市
  247. await regionManagementPage.createProvince({
  248. name: provinceName,
  249. code: generateUniqueRegionCode('PROV'),
  250. level: 1,
  251. });
  252. createdProvinces.push(provinceName);
  253. await page.goto('/admin/areas');
  254. await regionManagementPage.waitForTreeLoaded();
  255. // 创建市后,先展开省节点验证市已创建
  256. const cityResult = await regionManagementPage.createChildRegion(provinceName, '市', {
  257. name: originalCityName,
  258. code: generateUniqueRegionCode('CITY'),
  259. level: 2,
  260. });
  261. expect(cityResult.success).toBe(true);
  262. await page.goto('/admin/areas');
  263. await regionManagementPage.waitForTreeLoaded();
  264. // 直接展开新创建的省节点(滚动到可见区域)
  265. await regionManagementPage.expandNode(provinceName);
  266. await page.waitForTimeout(1000);
  267. // 验证市级区域可见
  268. const cityVisible = await regionManagementPage.regionExists(originalCityName);
  269. console.debug(`市级区域 "${originalCityName}" 可见: ${cityVisible}`);
  270. expect(cityVisible).toBe(true);
  271. // 编辑城市名称
  272. const newCityName = generateUniqueRegionName('编辑后的市');
  273. const result = await regionManagementPage.editRegion(originalCityName, {
  274. name: newCityName,
  275. });
  276. expect(result.success).toBe(true);
  277. expect(result.hasError).toBe(false);
  278. });
  279. test('应该成功编辑区级区域状态', async ({ regionManagementPage, page }) => {
  280. const provinceName = generateUniqueRegionName('测试省');
  281. const cityName = generateUniqueRegionName('测试市');
  282. const districtName = generateUniqueRegionName('测试区');
  283. // 创建省市区三级结构
  284. await regionManagementPage.createProvince({
  285. name: provinceName,
  286. code: generateUniqueRegionCode('PROV'),
  287. level: 1,
  288. });
  289. createdProvinces.push(provinceName);
  290. await page.goto('/admin/areas');
  291. await regionManagementPage.waitForTreeLoaded();
  292. const cityResult = await regionManagementPage.createChildRegion(provinceName, '市', {
  293. name: cityName,
  294. code: generateUniqueRegionCode('CITY'),
  295. level: 2,
  296. });
  297. expect(cityResult.success).toBe(true);
  298. await page.goto('/admin/areas');
  299. await regionManagementPage.waitForTreeLoaded();
  300. const districtResult = await regionManagementPage.createChildRegion(provinceName, '市', {
  301. name: districtName,
  302. code: generateUniqueRegionCode('DISTRICT'),
  303. level: 3,
  304. });
  305. expect(districtResult.success).toBe(true);
  306. await page.goto('/admin/areas');
  307. await regionManagementPage.waitForTreeLoaded();
  308. // 展开省节点
  309. await regionManagementPage.expandNode(provinceName);
  310. await page.waitForTimeout(1000);
  311. // 切换区的状态
  312. const success = await regionManagementPage.toggleRegionStatus(districtName);
  313. expect(success).toBe(true);
  314. });
  315. });
  316. test.describe('表单验证', () => {
  317. test('清空名称时应显示错误提示', async ({ regionManagementPage }) => {
  318. const provinceName = generateUniqueRegionName('测试省');
  319. await regionManagementPage.createProvince({
  320. name: provinceName,
  321. code: generateUniqueRegionCode('PROV'),
  322. level: 1,
  323. });
  324. createdProvinces.push(provinceName);
  325. await regionManagementPage.waitForTreeLoaded();
  326. // 打开编辑对话框并清空名称
  327. await regionManagementPage.openEditDialog(provinceName);
  328. await regionManagementPage.page.getByLabel('区域名称').fill('');
  329. // 提交表单
  330. const submitButton = regionManagementPage.page.getByRole('button', { name: '更新' });
  331. await submitButton.click();
  332. // 验证错误提示 - 可能是内联错误或 toast
  333. await regionManagementPage.page.waitForTimeout(500);
  334. // 检查内联错误
  335. const nameError = regionManagementPage.page.getByText('区域名称不能为空');
  336. const hasInlineError = await nameError.count() > 0;
  337. // 检查 toast 错误
  338. const errorToast = regionManagementPage.page.locator('[data-sonner-toast][data-type="error"]');
  339. const hasToastError = await errorToast.count() > 0;
  340. // 至少应该有一种错误提示
  341. expect(hasInlineError || hasToastError).toBe(true);
  342. // 取消对话框
  343. await regionManagementPage.cancelDialog();
  344. });
  345. test('应该支持取消编辑操作', async ({ regionManagementPage }) => {
  346. const provinceName = generateUniqueRegionName('测试省');
  347. await regionManagementPage.createProvince({
  348. name: provinceName,
  349. code: generateUniqueRegionCode('PROV'),
  350. level: 1,
  351. });
  352. createdProvinces.push(provinceName);
  353. await regionManagementPage.waitForTreeLoaded();
  354. // 打开编辑对话框
  355. await regionManagementPage.openEditDialog(provinceName);
  356. // 修改名称
  357. const newName = generateUniqueRegionName('修改后的省');
  358. await regionManagementPage.page.getByLabel('区域名称').fill(newName);
  359. // 点击取消按钮
  360. await regionManagementPage.cancelDialog();
  361. // 验证对话框已关闭
  362. const dialog = regionManagementPage.page.locator('[role="dialog"]');
  363. await expect(dialog).not.toBeVisible();
  364. // 验证数据未修改 - 原名称仍存在
  365. await regionManagementPage.waitForTreeLoaded();
  366. const originalExists = await regionManagementPage.regionExists(provinceName);
  367. expect(originalExists).toBe(true);
  368. });
  369. });
  370. test.describe('连续编辑操作', () => {
  371. test('应该能连续编辑多个区域', async ({ regionManagementPage }) => {
  372. // 创建多个省份
  373. const province1 = generateUniqueRegionName('测试省1');
  374. const province2 = generateUniqueRegionName('测试省2');
  375. await regionManagementPage.createProvince({
  376. name: province1,
  377. code: generateUniqueRegionCode('PROV1'),
  378. level: 1,
  379. });
  380. createdProvinces.push(province1);
  381. await regionManagementPage.waitForTreeLoaded();
  382. await regionManagementPage.createProvince({
  383. name: province2,
  384. code: generateUniqueRegionCode('PROV2'),
  385. level: 1,
  386. });
  387. createdProvinces.push(province2);
  388. await regionManagementPage.waitForTreeLoaded();
  389. // 编辑第一个省份
  390. const newProvince1Name = generateUniqueRegionName('编辑后的省1');
  391. const result1 = await regionManagementPage.editRegion(province1, { name: newProvince1Name });
  392. expect(result1.success).toBe(true);
  393. // 更新清理列表
  394. const index1 = createdProvinces.indexOf(province1);
  395. if (index1 > -1) {
  396. createdProvinces[index1] = newProvince1Name;
  397. }
  398. // 编辑第二个省份
  399. const newProvince2Name = generateUniqueRegionName('编辑后的省2');
  400. const result2 = await regionManagementPage.editRegion(province2, { name: newProvince2Name });
  401. expect(result2.success).toBe(true);
  402. // 更新清理列表
  403. const index2 = createdProvinces.indexOf(province2);
  404. if (index2 > -1) {
  405. createdProvinces[index2] = newProvince2Name;
  406. }
  407. });
  408. });
  409. });