OmniCard/admin/tests/card-builder.test.ts

import test from 'node:test';
import assert from 'node:assert/strict';
import fs from 'node:fs';
import path from 'node:path';
import { fileURLToPath } from 'node:url';

const adminRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..');
const builderPagePath = path.join(adminRoot, 'src/pages/card/builder/index.tsx');
const builderLocalePath = path.join(
  adminRoot,
  'src/pages/card/builder/locale/index.ts'
);
const routesPath = path.join(adminRoot, 'src/routes.ts');
const mainLocalePath = path.join(adminRoot, 'src/locale/index.ts');

test('1. routes.ts 已注册 card/builder，对应 pages/card/builder', () => {
  const content = fs.readFileSync(routesPath, 'utf-8');
  assert.ok(content.includes("key: 'card/builder'"), '应存在路由 key: card/builder');
  assert.ok(content.includes("name: 'menu.card.builder'"), '应存在 menu.card.builder');
  assert.ok(fs.existsSync(builderPagePath), '必须存在 pages/card/builder/index.tsx');
});

test('2. locale 必须包含 menu.card.builder 中英文案', () => {
  const content = fs.readFileSync(mainLocalePath, 'utf-8');
  assert.ok(content.includes("'menu.card.builder': 'Bento Builder'"), '英文 menu.card.builder');
  assert.ok(content.includes("'menu.card.builder': 'Bento 搭建器'"), '中文 menu.card.builder');
});

test('3. builder 必须请求 getBlocksByCardId / batchSaveLayout 并支持 colSpan', () => {
  const content = fs.readFileSync(builderPagePath, 'utf-8');

  assert.ok(
    content.includes('getBlocksByCardId'),
    '必须请求 POST /api/admin/card/bento/getBlocksByCardId'
  );
  assert.ok(
    content.includes('batchSaveLayout'),
    '必须请求 POST /api/admin/card/bento/batchSaveLayout'
  );
  assert.ok(content.includes('colSpan'), '必须读写 colSpan');
  assert.ok(content.includes('rowSpan'), '必须读写 rowSpan');
  assert.ok(
    content.includes('{ cardId: Number(id) }'),
    '拉取块必须提交 { cardId: Number(id) }'
  );
  assert.ok(
    content.includes('code === 1000') || content.includes('code ===1000'),
    '必须按 Cool-Admin code === 1000 判断成功'
  );
});

test('4. builder 必须覆盖 hero/case/article 等 Bento 类型', () => {
  const content = fs.readFileSync(builderPagePath, 'utf-8');

  assert.ok(content.includes('hero'), '组件库必须包含 hero');
  assert.ok(content.includes('case'), '组件库必须包含 case');
  assert.ok(content.includes('article'), '组件库必须包含 article');
  assert.ok(content.includes('social'), '组件库必须包含 social');
  assert.ok(content.includes('video'), '组件库必须包含 video');
  assert.ok(content.includes('form'), '组件库必须包含 form');
  assert.ok(content.includes('BentoBlock'), '必须复用 BentoBlock 类型');
  assert.ok(content.includes('BentoBlockType'), '必须复用 BentoBlockType 类型');
});

test('5. builder 必须用 query id、Arco 三栏与单一保存 CTA', () => {
  const content = fs.readFileSync(builderPagePath, 'utf-8');

  assert.ok(content.includes('useLocation'), '名片 id 必须来自 useLocation');
  assert.ok(
    content.includes('query-string') || content.includes('queryString'),
    '必须用 query-string 解析 id'
  );
  assert.ok(content.includes('Layout'), '必须使用 Arco Layout');
  assert.ok(content.includes('Input.TextArea'), '必须使用 Input.TextArea');
  assert.ok(content.includes('Tabs'), '必须使用 Arco Tabs');
  assert.ok(
    content.includes("from '@arco-design/web-react'"),
    '必须从 @arco-design/web-react 引入组件'
  );
  assert.ok(
    content.includes("from '@/style/tokens'"),
    '颜色必须引用 admin/src/style/tokens'
  );
  assert.ok(content.includes('cardBuilder.save') || content.includes('保存排版'), '必须提供保存排版主 CTA');
  assert.ok(content.includes('Empty') || content.includes('cardBuilder.empty'), '缺 id 必须 Empty 提示');
  assert.ok(content.includes('/card/list'), '缺 id 必须提示回资产库');
  assert.ok(!/\bany\b/.test(content), '禁止使用 any');
  assert.ok(
    !/[\u{1F300}-\u{1F9FF}\u{2600}-\u{26FF}\u{2700}-\u{27BF}]/u.test(content),
    '禁止使用 emoji'
  );
});

test('6. builder 页面文案走 i18n 且无 emoji', () => {
  assert.ok(fs.existsSync(builderLocalePath), '必须存在 builder locale');
  const localeContent = fs.readFileSync(builderLocalePath, 'utf-8');
  assert.ok(localeContent.includes('cardBuilder.save'), '必须有保存排版词条');
  assert.ok(localeContent.includes('cardBuilder.empty'), '必须有缺 id 空状态词条');
  assert.ok(
    !/[\u{1F300}-\u{1F9FF}\u{2600}-\u{26FF}\u{2700}-\u{27BF}]/u.test(localeContent),
    'locale 禁止使用 emoji'
  );
  assert.ok(!/\bany\b/.test(localeContent), 'locale 禁止使用 any');
});

test('7. builder 支持无 ID 自动拉取名片列表、名片切换器与多环境预览 (Dark / RTL)', () => {
  const content = fs.readFileSync(builderPagePath, 'utf-8');
  assert.ok(
    content.includes('/api/admin/card/info/page'),
    '必须支持拉取名片列表 /api/admin/card/info/page'
  );
  assert.ok(
    content.includes('cardBuilder.switchCard') || content.includes('cardOptions'),
    '必须支持名片切换器'
  );
  assert.ok(
    content.includes('previewMode') || content.includes('themeMode') || content.includes('isDark'),
    '必须支持暗黑/浅色模式视口切换'
  );
  assert.ok(
    content.includes('isRtl') || content.includes('rtl'),
    '必须支持 RTL 排版镜像切换'
  );
});

test('8. 手机预览区 RTL 使用 Arco Switch，且不写入 batchSaveLayout body', () => {
  const content = fs.readFileSync(builderPagePath, 'utf-8');
  const localeContent = fs.readFileSync(builderLocalePath, 'utf-8');

  assert.ok(
    /Switch/.test(content) &&
      content.includes("from '@arco-design/web-react'"),
    '必须从 @arco-design/web-react 使用 Switch'
  );
  assert.ok(content.includes('<Switch'), '手机预览区必须渲染 Switch');
  assert.ok(
    /dir=\{isRtl \? ['"]rtl['"] : ['"]ltr['"]\}/.test(content),
    '打开/关闭 Switch 时预览容器必须切换 dir=rtl / dir=ltr'
  );
  assert.ok(
    content.includes('{ cardId: Number(id), blocks: payloadBlocks }'),
    'batchSaveLayout body 必须仍为 { cardId, blocks }，不得扩展参数'
  );

  const saveStart = content.indexOf('const handleSave');
  const saveEnd = content.indexOf('const handleOpenPreview');
  assert.ok(saveStart >= 0 && saveEnd > saveStart, '必须能定位 handleSave 实现');
  const saveSection = content.slice(saveStart, saveEnd);
  assert.ok(!saveSection.includes('isRtl'), 'handleSave 不得引用 isRtl');
  assert.ok(!/\brtl\b/i.test(saveSection), 'batchSaveLayout 请求体不得包含 rtl');

  assert.ok(
    localeContent.includes('cardBuilder.preview.rtl'),
    'locale 必须有预览 RTL 开关文案 key'
  );
  assert.ok(localeContent.includes("'en-US'"), 'locale 必须含英文');
  assert.ok(localeContent.includes("'zh-CN'"), 'locale 必须含中文');
  assert.ok(localeContent.includes("'ar-SA'"), 'locale 必须含阿语');
});

test('9. 深色预览只作用于手机容器，切换后保存不得写入 theme=dark', () => {
  const content = fs.readFileSync(builderPagePath, 'utf-8');
  const localeContent = fs.readFileSync(builderLocalePath, 'utf-8');

  assert.ok(
    /useState<'light' \| 'dark'>\(['"]light['"]\)/.test(content) ||
      content.includes("useState<'light' | 'dark'>('light')"),
    'themeMode 必须为本地预览状态，默认 light'
  );
  assert.ok(
    /themeMode === ['"]dark['"] \? styles\.phoneDark/.test(content) ||
      content.includes("themeMode === 'dark' ? styles.phoneDark"),
    '深色必须只挂在 phone 预览 class（phoneDark），不得改整页 tokens'
  );
  assert.ok(
    content.includes("getCssVariables('light')"),
    '页面根 tokens 必须固定 light，深色不得写进整页主题'
  );

  const saveStart = content.indexOf('const handleSave');
  const saveEnd = content.indexOf('const handleOpenPreview');
  assert.ok(saveStart >= 0 && saveEnd > saveStart, '必须能定位 handleSave 实现');
  const saveSection = content.slice(saveStart, saveEnd);

  assert.ok(
    content.includes('{ cardId: Number(id), blocks: payloadBlocks }'),
    'batchSaveLayout body 必须仍为 { cardId, blocks }'
  );
  assert.ok(!saveSection.includes('themeMode'), 'handleSave 不得引用 themeMode');
  assert.ok(!saveSection.includes('phoneDark'), 'handleSave 不得引用 phoneDark');
  assert.ok(
    !/theme\s*[:=]\s*['"]dark['"]/.test(saveSection),
    '切换深色后再保存，请求体不得出现 theme=dark'
  );
  assert.ok(!/\btheme\b/.test(saveSection), 'batchSaveLayout 请求体不得包含 theme 字段');
  assert.ok(!saveSection.includes('isRtl'), '深色切换后的保存体仍不得带入 RTL 预览态');

  const savePostMatch = saveSection.match(
    /axios\.post[\s\S]*?SAVE_LAYOUT_API[\s\S]*?\{([\s\S]*?)\}/
  );
  assert.ok(savePostMatch, '必须能解析 batchSaveLayout 的 axios.post 请求体');
  const saveBody = savePostMatch[1];
  assert.ok(saveBody.includes('cardId'), '保存体必须含 cardId');
  assert.ok(saveBody.includes('blocks'), '保存体必须含 blocks');
  assert.ok(!/theme/i.test(saveBody), '保存体字符串不得含 theme');
  assert.ok(!/dark/i.test(saveBody), '保存体字符串不得因预览切换而含 dark');
  assert.ok(!/rtl/i.test(saveBody), '保存体字符串不得因预览切换而含 rtl');

  assert.ok(
    /}, \[hasId, id, orderedBlocks, t\]\);/.test(saveSection) ||
      saveSection.includes('[hasId, id, orderedBlocks, t]'),
    'handleSave 依赖不得包含 themeMode / isRtl'
  );
  assert.ok(!saveSection.includes('themeMode'), '依赖自审：不得出现 themeMode');
  assert.ok(!saveSection.includes('isRtl'), '依赖自审：不得出现 isRtl');

  assert.ok(
    localeContent.includes('cardBuilder.theme.dark'),
    'locale 必须有深色预览文案'
  );
  assert.ok(
    localeContent.includes('cardBuilder.theme.light'),
    'locale 必须有浅色预览文案'
  );
});