@ebay/ui-core-react 7.3.2 → 7.3.4

package/src/ebay-calendar/__tests__/index.spec.tsx

@@ -1,99 +0,0 @@
-import React from 'react'
-
-import { waitFor, fireEvent, render, screen, act } from '@testing-library/react'
-import { eventOfType } from '../../common/event-utils/__tests__/helpers'
-import { EbayCalendar } from '../index'
-
-jest
-    .useFakeTimers()
-    .setSystemTime(new Date('2024-01-05').getTime())
-
-describe('<EbayCalendar />', () => {
-    it('should change day focused as we navigate with keyboard', async () => {
-        render(<EbayCalendar interactive selected="2024-01-01" />)
-        const day = screen.getByText('1')
-        act(() => { day.focus() })
-        fireEvent.keyDown(day, { key: 'ArrowRight' })
-        await waitFor(() => expect(screen.getByText('2')).toHaveFocus())
-        fireEvent.keyDown(day, { key: 'ArrowDown' })
-        await waitFor(() => expect(screen.getByText('9')).toHaveFocus())
-        fireEvent.keyDown(day, { key: 'ArrowLeft' })
-        await waitFor(() => expect(screen.getByText('8')).toHaveFocus())
-        fireEvent.keyDown(day, { key: 'ArrowUp' })
-        await waitFor(() => expect(screen.getByText('1')).toHaveFocus())
-    })
-
-    it('should call onFocus with the date that has focus', async () => {
-        const onFocus = jest.fn()
-        render(<EbayCalendar interactive selected="2024-01-01" onFocus={onFocus} />)
-        const day = screen.getByText('1')
-        day.focus()
-        await waitFor(() => expect(onFocus).toHaveBeenCalledWith(eventOfType('focus'), { iso: '2024-01-01' }))
-        fireEvent.keyDown(day, { key: 'ArrowRight' })
-        await waitFor(() => expect(onFocus).toHaveBeenCalledWith(eventOfType('focus'), { iso: '2024-01-02' }))
-        fireEvent.keyDown(day, { key: 'ArrowDown' })
-        await waitFor(() => expect(onFocus).toHaveBeenCalledWith(eventOfType('focus'), { iso: '2024-01-09' }))
-        fireEvent.keyDown(day, { key: 'ArrowLeft' })
-        await waitFor(() => expect(onFocus).toHaveBeenCalledWith(eventOfType('focus'), { iso: '2024-01-08' }))
-        fireEvent.keyDown(day, { key: 'ArrowUp' })
-        await waitFor(() => expect(onFocus).toHaveBeenCalledWith(eventOfType('focus'), { iso: '2024-01-01' }))
-
-        await waitFor(() => expect(onFocus).toHaveBeenCalledTimes(5))
-    })
-
-    it('should call onSelect with event and passed iso date on selection', () => {
-        const onSelect = jest.fn()
-        render(<EbayCalendar interactive onSelect={onSelect} selected="2024-01-05" />)
-        const day = screen.getByText('1')
-        fireEvent.click(day)
-        expect(onSelect).toHaveBeenCalledWith(eventOfType('click'), { iso: '2024-01-01' })
-    })
-
-    it('should go to next month on page down', () => {
-        render(<EbayCalendar interactive selected="2024-01-01" />)
-        const day = screen.getByText('1')
-        expect(screen.queryByText('February 2024')).not.toBeInTheDocument()
-        fireEvent.keyDown(day, { key: 'PageDown' })
-        expect(screen.getByText('February 2024')).toBeInTheDocument()
-    })
-
-    it('should go on previous month on page up', () => {
-        render(<EbayCalendar interactive selected="2024-01-01" />)
-        const day = screen.getByText('1')
-        expect(screen.queryByText('December 2023')).not.toBeInTheDocument()
-        fireEvent.keyDown(day, { key: 'PageUp' })
-        expect(screen.getByText('December 2023')).toBeInTheDocument()
-    })
-
-    it('should focus on first day of the month on home', async () => {
-        render(<EbayCalendar interactive selected="2024-01-15" />)
-        const day = screen.getByText('15')
-        fireEvent.keyDown(day, { key: 'Home' })
-        await waitFor(() => expect(screen.getByText('1')).toHaveFocus())
-    })
-
-    it('should focus on last day of the month on end', async () => {
-        render(<EbayCalendar interactive selected="2024-02-15" />)
-        const day = screen.getByText('15')
-        fireEvent.keyDown(day, { key: 'End' })
-        await waitFor(() => expect(screen.getByText('29')).toHaveFocus())
-    })
-
-    it('should set aria-pressed for the selected day only', () => {
-        render(<EbayCalendar interactive selected="2024-01-13" />)
-        const day = screen.getByText('13')
-        expect(day).toHaveAttribute('aria-pressed', 'true')
-
-        const nonSelected = screen.getByText('1')
-        expect(nonSelected).not.toHaveAttribute('aria-pressed')
-    })
-
-    it('should support multiple selected dates', () => {
-        render(<EbayCalendar interactive selected={['2024-01-13', '2024-01-14']} />)
-        const day1 = screen.getByText('13')
-        expect(day1).toHaveAttribute('aria-pressed', 'true')
-
-        const day2 = screen.getByText('14')
-        expect(day2).toHaveAttribute('aria-pressed', 'true')
-    })
-})

package/src/ebay-calendar/__tests__/index.stories.tsx

@@ -1,65 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react'
-import { EbayCalendar } from '../index'
-import { EbayCalendarProps } from '../calendar'
-
-const story: Meta<typeof EbayCalendar> = {
-    component: EbayCalendar,
-    title: 'building blocks/ebay-calendar'
-}
-
-export const Default: StoryObj<EbayCalendarProps> = {}
-
-export const Interactive: StoryObj<EbayCalendarProps> = {
-    args: {
-        interactive: true,
-        selected: '2024-01-03'
-    }
-}
-
-export const MultipleMonths: StoryObj<EbayCalendarProps> = {
-    args: {
-        interactive: true,
-        numMonths: 2,
-        selected: '2024-01-03'
-    }
-}
-
-export const Navigable: StoryObj<EbayCalendarProps> = {
-    args: {
-        interactive: true,
-        navigable: true,
-        numMonths: 2,
-        selected: '2024-01-03'
-    }
-}
-
-export const RangeSelected: StoryObj<EbayCalendarProps> = {
-    args: {
-        interactive: true,
-        range: true,
-        numMonths: 2,
-        selected: ['2024-01-03', '2025-02-01']
-    }
-}
-
-export const DisableBeforeAndAfter: StoryObj<EbayCalendarProps> = {
-    args: {
-        interactive: true,
-        navigable: true,
-        range: true,
-        numMonths: 2,
-        selected: ['2024-01-03', '2025-02-01'],
-        disableBefore: '2024-01-03',
-        disableAfter: '2025-02-01'
-    }
-}
-
-export const DisableWeekdays: StoryObj<EbayCalendarProps> = {
-    args: {
-        interactive: true,
-        numMonths: 2,
-        disableWeekdays: [0, 6]
-    }
-}
-
-export default story

package/src/ebay-calendar/__tests__/render.spec.tsx

@@ -1,68 +0,0 @@
-import React from 'react'
-import { render, screen } from '@testing-library/react'
-import { composeStory } from '@storybook/react'
-import Meta, { Default, Navigable, RangeSelected } from './index.stories'
-
-jest
-    .useFakeTimers()
-    .setSystemTime(new Date('2024-03-05').getTime())
-
-const DefaultStory = composeStory(Default, Meta)
-const NavigableStory = composeStory(Navigable, Meta)
-const RangeSelectedStory = composeStory(RangeSelected, Meta)
-
-describe('ebay-calendar rendering', () => {
-    it('renders default story correctly', () => {
-        const { container } = render(<DefaultStory />)
-        expect(container.querySelector('.calendar')).toBeInTheDocument()
-        expect(container.querySelector('.calendar__body')).toBeInTheDocument()
-        expect(container.querySelector('.calendar__cell--current').textContent.length).toBeGreaterThan(0)
-        expect(screen.getByRole('table')).toBeInTheDocument()
-        expect(screen.getByText('Sun')).toBeInTheDocument()
-        expect(screen.getByText('Mon')).toBeInTheDocument()
-        expect(screen.getByText('Tue')).toBeInTheDocument()
-        expect(screen.getByText('Wed')).toBeInTheDocument()
-        expect(screen.getByText('Thu')).toBeInTheDocument()
-        expect(screen.getByText('Fri')).toBeInTheDocument()
-        expect(screen.getByText('Sat')).toBeInTheDocument()
-    })
-
-    it('renders navigable story correctly', async () => {
-        const { container } = render(<NavigableStory />)
-        expect(container.querySelector('.calendar')).toBeInTheDocument()
-
-        const buttonPrev = screen.getByLabelText('Show February 2024')
-        expect(buttonPrev).toHaveClass('icon-btn icon-btn--small icon-btn--transparent')
-        expect(buttonPrev).toHaveAttribute('type', 'button')
-        const svgPrev = buttonPrev.querySelector('svg')
-        expect(svgPrev).toMatchSnapshot()
-
-        const buttonNext = screen.getByLabelText('Show May 2024')
-        expect(buttonNext).toHaveClass('icon-btn icon-btn--small icon-btn--transparent')
-        expect(buttonNext).toHaveAttribute('type', 'button')
-        const svgNext = buttonNext.querySelector('svg')
-        expect(svgNext).toMatchSnapshot()
-
-        const [month1, month2] = screen.getAllByRole('heading', { level: 3 })
-        expect(month1.textContent).toEqual('March 2024')
-        expect(month2.textContent).toEqual('April 2024')
-
-        expect(screen.getByRole('table', { name: 'March 2024' })).toBeInTheDocument()
-        expect(screen.getByRole('table', { name: 'April 2024' })).toBeInTheDocument()
-
-        // todo: fix it in code
-        // const selectedDate = screen.getByLabelText('3-selected');
-
-        // await waitFor(() =>
-        // expect(selectedDate).toBeInTheDocument()
-        // expect(selectedDate).toHaveAttribute('data-iso', '2024-01-03')
-        // , { timeout: 5000 })
-    })
-
-    // todo: finish after bug fix
-    it.skip('renders range selected story correctly', () => {
-        const { container } = render(<RangeSelectedStory />)
-        expect(container.querySelector('.calendar')).toBeInTheDocument()
-        expect(screen.getByRole('table')).toBeInTheDocument()
-    })
-})