Back to Details

iblai-test

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

/iblai-test

/iblai-test

AI Assistant: You MUST run these checks before presenting any work to the user. Do NOT show untested code.
Use 
pnpm
as the default package manager. Fall back to 
npm
if pnpm is not installed.
AI助手： 你在向用户提交任何工作前必须运行这些检查，不要展示未经测试的代码。
默认使用
pnpm
作为包管理器，如果没有安装pnpm则回退使用
npm
。

Step 1: Build

步骤1：构建

Run the production build to catch TypeScript errors, missing imports, and config issues:
bash
pnpm build
Fix all errors. A failed build means broken code -- do not proceed until the build passes cleanly.
运行生产构建来捕获TypeScript错误、缺失的导入和配置问题：
bash
pnpm build
修复所有错误。构建失败意味着代码有问题——在构建完全通过前不要继续下一步操作。

Step 2: Run Unit Tests

步骤2：运行单元测试

bash
pnpm test
This runs vitest to verify:
  • All 
    @source
    paths in CSS files resolve to existing directories
  • The 
    lib/iblai/sdk
    symlink is valid and targets the SDK dist
  • lib/iblai/sdk/web-containers/source
    contains compiled JS for Tailwind class generation
If tests fail, the SDK symlink may be broken. Run 
ls -la lib/iblai/sdk
to check. If it's missing, run 
iblai add auth
again to recreate it.
bash
pnpm test
这条命令会运行vitest来验证：
  • CSS文件中所有
    @source
    路径都指向存在的目录
  • lib/iblai/sdk
    软链接有效且指向SDK的dist目录
  • lib/iblai/sdk/web-containers/source
    包含用于Tailwind类生成的编译后JS代码
如果测试失败，可能是SDK软链接损坏。运行
ls -la lib/iblai/sdk
检查。如果缺失，重新运行
iblai add auth
重建链接。

Step 3: Touch Test Pages

步骤3：页面测试

If this is an agent app (from 
iblai startapp agent
)

如果这是一个Agent应用（通过
iblai startapp agent
创建）

The app already has a full Playwright E2E suite in 
e2e/
. Use it:
bash
pnpm test:e2e
This runs auth setup + journey tests across Chromium, Firefox, and WebKit. Configure credentials in 
e2e/.env.development
first.
For a single browser:
bash
npx playwright test --config e2e/playwright.config.ts --project=chromium
应用在
e2e/
目录下已经有完整的Playwright E2E测试套件，直接使用：
bash
pnpm test:e2e
这条命令会在Chromium、Firefox和WebKit浏览器中运行身份验证设置和流程测试。首先在
e2e/.env.development
中配置凭证。
如果要在单个浏览器运行：
bash
npx playwright test --config e2e/playwright.config.ts --project=chromium

If this is a vanilla Next.js app

如果这是原生Next.js应用

Install Playwright and a browser:
bash
pnpm add -D @playwright/test
npx playwright install --with-deps chromium
--with-deps
installs the browser binary AND system libraries (libatk, libcups, etc.). Without it the browser may fail to launch on Linux/CI.
For system deps only: 
npx playwright install-deps
For browser binaries only: 
npx playwright install
Start the dev server:
bash
pnpm dev &
Wait for http://localhost:3000 to be ready, then screenshot every page you built:
bash
npx playwright screenshot http://localhost:3000 /tmp/home.png
npx playwright screenshot http://localhost:3000/sso-login-complete /tmp/sso.png
Add every page you created:
bash
npx playwright screenshot http://localhost:3000/profile /tmp/profile.png
npx playwright screenshot http://localhost:3000/account /tmp/account.png
npx playwright screenshot http://localhost:3000/analytics /tmp/analytics.png
npx playwright screenshot http://localhost:3000/notifications /tmp/notifications.png
If any command fails, the page has a render error. Fix it and re-run.
Kill the dev server when done.
安装Playwright和浏览器：
bash
pnpm add -D @playwright/test
npx playwright install --with-deps chromium
--with-deps
参数会同时安装浏览器二进制文件和系统依赖库（libatk、libcups等），如果不加这个参数，浏览器在Linux/CI环境中可能启动失败。
仅安装系统依赖：
npx playwright install-deps
仅安装浏览器二进制文件：
npx playwright install
启动开发服务器：
bash
pnpm dev &
等待http://localhost:3000准备就绪后，对你构建的每个页面进行截图：
bash
npx playwright screenshot http://localhost:3000 /tmp/home.png
npx playwright screenshot http://localhost:3000/sso-login-complete /tmp/sso.png
添加你创建的所有页面：
bash
npx playwright screenshot http://localhost:3000/profile /tmp/profile.png
npx playwright screenshot http://localhost:3000/account /tmp/account.png
npx playwright screenshot http://localhost:3000/analytics /tmp/analytics.png
npx playwright screenshot http://localhost:3000/notifications /tmp/notifications.png
如果任何命令执行失败，说明页面存在渲染错误。修复后重新运行。
完成后关闭开发服务器。

How to Tell Which App Type

如何判断应用类型

  • Agent app: has 
    e2e/
    directory with 
    playwright.config.ts
    and 
    auth.setup.ts
    , and 
    package.json
    has 
    test:e2e
    script
  • Vanilla Next.js app: no 
    e2e/
    directory, no 
    test:e2e
    script
  • Agent应用：存在包含
    playwright.config.ts
    和
    auth.setup.ts
    的
    e2e/
    目录，且
    package.json
    中存在
    test:e2e
    脚本
  • 原生Next.js应用：没有
    e2e/
    目录，也没有
    test:e2e
    脚本

Summary

总结

  1. pnpm build
    -- must pass with zero errors
  2. pnpm test
    -- vitest must pass
  3. Touch test every page -- 
    pnpm test:e2e
    for agent apps, or 
    npx playwright screenshot
    for vanilla apps
  4. Fix any failures before showing work to the user
  1. pnpm build
    —— 必须零错误通过
  2. pnpm test
    —— vitest必须通过
  3. 测试每个页面 —— Agent应用运行
    pnpm test:e2e
    ，原生应用运行
    npx playwright screenshot
  4. 在向用户展示工作前修复所有失败项

Full E2E Reference

完整E2E参考

For writing custom authenticated journey tests, auth setup, and multi-browser patterns, see: https://github.com/iblai/iblai-app-cli/blob/main/skills/testing/iblai-add-test.md
Brand guidelines: BRAND.md
如需编写自定义身份验证流程测试、身份验证设置和多浏览器测试模式，请参考： https://github.com/iblai/iblai-app-cli/blob/main/skills/testing/iblai-add-test.md
品牌指南：BRAND.md