Hera Zhao
ee8ec23dc7
- Replace single-file 8441-line HTML with Vue 3 SPA - Pinia stores: auth, oils, recipes, diary, ui - Composables: useApi, useDialog, useSmartPaste, useOilTranslation - 6 shared components: RecipeCard, RecipeDetailOverlay, TagPicker, etc. - 9 page views: RecipeSearch, RecipeManager, Inventory, OilReference, etc. - 14 Cypress E2E test specs (113 tests), all passing - Multi-stage Dockerfile (Node build + Python runtime) - Demo video generation scripts (TTS + subtitles + screen recording) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
107 lines
3.1 KiB
JavaScript
107 lines
3.1 KiB
JavaScript
// Demo walkthrough for video recording
|
|
// Timeline paced to match 90s TTS narration
|
|
|
|
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
|
|
|
describe('doTERRA 精油配方计算器 - 功能演示', () => {
|
|
it('完整功能演示', { defaultCommandTimeout: 15000 }, () => {
|
|
// ===== 0:00-0:05 开场：首页加载 =====
|
|
cy.visit('/', {
|
|
onBeforeLoad(win) {
|
|
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
|
}
|
|
})
|
|
cy.get('.app-header').should('be.visible')
|
|
cy.wait(4500)
|
|
|
|
// ===== 0:05-0:09 配方卡片列表 =====
|
|
cy.get('.recipe-card', { timeout: 10000 }).should('have.length.gte', 1)
|
|
cy.wait(3500)
|
|
|
|
// ===== 0:09-0:12 滚动浏览 =====
|
|
cy.scrollTo(0, 500, { duration: 1200 })
|
|
cy.wait(1500)
|
|
cy.scrollTo('top', { duration: 800 })
|
|
cy.wait(1000)
|
|
|
|
// ===== 0:12-0:16 搜索框输入 =====
|
|
cy.get('input[placeholder*="搜索"]').click()
|
|
cy.wait(800)
|
|
cy.get('input[placeholder*="搜索"]').type('薰衣草', { delay: 200 })
|
|
cy.wait(2500)
|
|
|
|
// ===== 0:16-0:20 搜索结果 =====
|
|
cy.wait(2000)
|
|
cy.get('input[placeholder*="搜索"]').clear()
|
|
cy.wait(1500)
|
|
|
|
// ===== 0:20-0:24 点击配方卡片 =====
|
|
cy.get('.recipe-card').first().click()
|
|
cy.wait(4000)
|
|
|
|
// ===== 0:24-0:30 查看详情 =====
|
|
cy.get('[class*="overlay"], [class*="detail"]').should('be.visible')
|
|
cy.wait(4500)
|
|
cy.get('button').contains(/✕|关闭|←/).first().click()
|
|
cy.wait(1500)
|
|
|
|
// ===== 0:30-0:34 切换精油价目 =====
|
|
cy.get('.nav-tab').contains('精油价目').click()
|
|
cy.wait(4000)
|
|
|
|
// ===== 0:34-0:38 搜索精油 =====
|
|
cy.get('.oil-card', { timeout: 10000 }).should('have.length.gte', 1)
|
|
cy.get('input[placeholder*="搜索精油"]').type('薰衣草', { delay: 200 })
|
|
cy.wait(2500)
|
|
cy.get('input[placeholder*="搜索精油"]').clear()
|
|
cy.wait(1000)
|
|
|
|
// ===== 0:38-0:42 切换瓶价/滴价 =====
|
|
cy.contains('滴价').click()
|
|
cy.wait(2000)
|
|
cy.contains('瓶价').click()
|
|
cy.wait(1500)
|
|
|
|
// ===== 0:42-0:47 管理配方 =====
|
|
cy.get('.nav-tab').contains('管理配方').click()
|
|
cy.wait(4500)
|
|
|
|
// ===== 0:47-0:52 管理页面浏览 =====
|
|
cy.scrollTo(0, 300, { duration: 1000 })
|
|
cy.wait(2000)
|
|
cy.scrollTo('top', { duration: 600 })
|
|
cy.wait(2000)
|
|
|
|
// ===== 0:52-0:56 个人库存 =====
|
|
cy.get('.nav-tab').contains('个人库存').click()
|
|
cy.wait(4500)
|
|
|
|
// ===== 0:56-1:00 库存推荐 =====
|
|
cy.scrollTo(0, 200, { duration: 600 })
|
|
cy.wait(2000)
|
|
cy.scrollTo('top', { duration: 400 })
|
|
cy.wait(1500)
|
|
|
|
// ===== 1:00-1:06 操作日志 =====
|
|
cy.get('.nav-tab').contains('操作日志').click()
|
|
cy.wait(3000)
|
|
cy.scrollTo(0, 200, { duration: 600 })
|
|
cy.wait(2500)
|
|
|
|
// ===== 1:06-1:12 Bug 追踪 =====
|
|
cy.get('.nav-tab').contains('Bug').click()
|
|
cy.wait(5500)
|
|
|
|
// ===== 1:12-1:18 用户管理 =====
|
|
cy.get('.nav-tab').contains('用户管理').click()
|
|
cy.wait(5500)
|
|
|
|
// ===== 1:18-1:22 回到首页 =====
|
|
cy.get('.nav-tab').contains('配方查询').click()
|
|
cy.wait(3500)
|
|
|
|
// ===== 1:22-1:30 结束 =====
|
|
cy.wait(5000)
|
|
})
|
|
})
|