Hera Zhao
f884bff452
Some checks failed
PR Preview / teardown-preview (pull_request) Has been skipped
Test / unit-test (push) Successful in 5s
Test / build-check (push) Successful in 4s
Test / e2e-test (push) Has been cancelled
PR Preview / test (pull_request) Successful in 4s
PR Preview / deploy-preview (pull_request) Successful in 13s
- RecipeCard: simple card with name, tags, oil names, price (matching original .recipe-card style with hover translateY and warm shadows) - RecipeDetailOverlay: inline panel (not modal) with editable ingredients table, add ingredient row, total cost bar, and card preview section matching the original detail-panel + #recipe-card-export layout - RecipeSearch: simplified layout with search box and grid, detail panel appears inline below grid when a card is clicked - Updated Cypress tests to match new component structure Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
80 lines
2.2 KiB
JavaScript
80 lines
2.2 KiB
JavaScript
describe('Recipe Detail', () => {
|
|
beforeEach(() => {
|
|
cy.visit('/')
|
|
cy.get('.recipe-card', { timeout: 10000 }).should('have.length.gte', 1)
|
|
})
|
|
|
|
it('opens detail panel when clicking a recipe card', () => {
|
|
cy.get('.recipe-card').first().click()
|
|
cy.get('[class*="detail"]').should('be.visible')
|
|
})
|
|
|
|
it('shows recipe name in detail view', () => {
|
|
cy.get('.recipe-card').first().invoke('text').then(cardText => {
|
|
cy.get('.recipe-card').first().click()
|
|
cy.wait(500)
|
|
cy.get('[class*="detail"]').should('be.visible')
|
|
})
|
|
})
|
|
|
|
it('shows ingredient info with drops', () => {
|
|
cy.get('.recipe-card').first().click()
|
|
cy.wait(500)
|
|
cy.contains('滴').should('exist')
|
|
})
|
|
|
|
it('shows cost with ¥ symbol', () => {
|
|
cy.get('.recipe-card').first().click()
|
|
cy.wait(500)
|
|
cy.contains('¥').should('exist')
|
|
})
|
|
|
|
it('closes detail panel when clicking close button', () => {
|
|
cy.get('.recipe-card').first().click()
|
|
cy.get('[class*="detail"]').should('be.visible')
|
|
cy.get('button').contains(/✕|关闭/).first().click()
|
|
cy.get('.recipe-card').should('be.visible')
|
|
})
|
|
|
|
it('shows action buttons in detail', () => {
|
|
cy.get('.recipe-card').first().click()
|
|
cy.wait(500)
|
|
cy.get('[class*="detail"] button').should('have.length.gte', 1)
|
|
})
|
|
|
|
it('shows favorite star on recipe cards', () => {
|
|
cy.get('.fav-btn').first().should('exist')
|
|
})
|
|
})
|
|
|
|
describe('Recipe Detail - Editor (Admin)', () => {
|
|
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
|
|
|
beforeEach(() => {
|
|
cy.visit('/', {
|
|
onBeforeLoad(win) {
|
|
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
|
}
|
|
})
|
|
cy.get('.recipe-card', { timeout: 10000 }).should('have.length.gte', 1)
|
|
})
|
|
|
|
it('shows editable ingredients table directly', () => {
|
|
cy.get('.recipe-card').first().click()
|
|
cy.wait(500)
|
|
cy.get('.oil-select, .drops-input').should('exist')
|
|
})
|
|
|
|
it('shows add ingredient button', () => {
|
|
cy.get('.recipe-card').first().click()
|
|
cy.wait(500)
|
|
cy.contains('加精油').should('exist')
|
|
})
|
|
|
|
it('shows export image button', () => {
|
|
cy.get('.recipe-card').first().click()
|
|
cy.wait(500)
|
|
cy.contains('导出图片').should('exist')
|
|
})
|
|
})
|