- 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>
46 lines
1.5 KiB
JavaScript
46 lines
1.5 KiB
JavaScript
describe('Recipe Search', () => {
|
|
beforeEach(() => {
|
|
cy.visit('/')
|
|
// Wait for recipes to load
|
|
cy.get('.recipe-card, .empty-state', { timeout: 10000 }).should('exist')
|
|
})
|
|
|
|
it('displays recipe cards in the grid', () => {
|
|
cy.get('.recipe-card').should('have.length.gte', 1)
|
|
})
|
|
|
|
it('each recipe card shows name and oils', () => {
|
|
cy.get('.recipe-card').first().within(() => {
|
|
cy.get('.recipe-card-name').should('not.be.empty')
|
|
cy.get('.recipe-card-oils').should('not.be.empty')
|
|
})
|
|
})
|
|
|
|
it('filters recipes by search input', () => {
|
|
cy.get('.recipe-card').then($cards => {
|
|
const initialCount = $cards.length
|
|
cy.get('input[placeholder*="搜索"]').type('薰衣草')
|
|
// Should filter, possibly fewer results
|
|
cy.wait(500)
|
|
cy.get('.recipe-card').should('have.length.lte', initialCount)
|
|
})
|
|
})
|
|
|
|
it('clears search and restores all recipes', () => {
|
|
cy.get('input[placeholder*="搜索"]').type('薰衣草')
|
|
cy.wait(500)
|
|
cy.get('.recipe-card').then($filtered => {
|
|
const filteredCount = $filtered.length
|
|
cy.get('input[placeholder*="搜索"]').clear()
|
|
cy.wait(500)
|
|
cy.get('.recipe-card').should('have.length.gte', filteredCount)
|
|
})
|
|
})
|
|
|
|
it('opens recipe detail when clicking a card', () => {
|
|
cy.get('.recipe-card').first().click()
|
|
// Should show detail overlay or panel
|
|
cy.get('[class*="overlay"], [class*="detail"]', { timeout: 5000 }).should('be.visible')
|
|
})
|
|
})
|