Wrap the "I'm attending" button with animated glow-border and glass-inner styling. Update test selectors for new structure. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
31 lines
1.2 KiB
TypeScript
31 lines
1.2 KiB
TypeScript
import { describe, it, expect } from 'vitest'
|
|
import { mount } from '@vue/test-utils'
|
|
import RsvpBar from '../RsvpBar.vue'
|
|
|
|
describe('RsvpBar', () => {
|
|
it('renders CTA button when hasRsvp is false', () => {
|
|
const wrapper = mount(RsvpBar)
|
|
expect(wrapper.find('.rsvp-bar__cta').exists()).toBe(true)
|
|
expect(wrapper.find('.rsvp-bar__cta-inner').text()).toBe("I'm attending")
|
|
expect(wrapper.find('.rsvp-bar__status').exists()).toBe(false)
|
|
})
|
|
|
|
it('renders status text when hasRsvp is true', () => {
|
|
const wrapper = mount(RsvpBar, { props: { hasRsvp: true } })
|
|
expect(wrapper.find('.rsvp-bar__status').exists()).toBe(true)
|
|
expect(wrapper.find('.rsvp-bar__text').text()).toBe("You're attending!")
|
|
expect(wrapper.find('.rsvp-bar__cta').exists()).toBe(false)
|
|
})
|
|
|
|
it('emits open when CTA button is clicked', async () => {
|
|
const wrapper = mount(RsvpBar)
|
|
await wrapper.find('.rsvp-bar__cta-inner').trigger('click')
|
|
expect(wrapper.emitted('open')).toHaveLength(1)
|
|
})
|
|
|
|
it('does not render CTA button when hasRsvp is true', () => {
|
|
const wrapper = mount(RsvpBar, { props: { hasRsvp: true } })
|
|
expect(wrapper.find('button').exists()).toBe(false)
|
|
})
|
|
})
|