feat: add CalendarCarousel test code

packages/CalendarCarousel/CalendarItem/DateItem.tsx

@@ -30,20 +30,18 @@ export type DateItemProp = {
   styles?: DateItemStyles;
 };
 
-export default function DateItem(props: DateItemProp): JSX.Element {
+export default function DateItem({
+  isEvent,
+  dateObject,
+  calendarWidth,
+  onPress,
+  selected = false,
+  styles,
+  showNextDates = true,
+  showPrevDates = true,
+}: DateItemProp): JSX.Element {
   const {theme} = useTheme();
 
-  const {
-    isEvent,
-    dateObject,
-    calendarWidth,
-    onPress,
-    selected = false,
-    styles,
-    showNextDates = true,
-    showPrevDates = true,
-  } = props;
-
   const {isNextMonth, isPrevMonth} = dateObject;
   const dateWidth = calendarWidth - 24;
   const dayHeight = dateWidth / 7;
@@ -90,6 +88,13 @@ export default function DateItem(props: DateItemProp): JSX.Element {
         },
         isEvent && styles?.event,
       ]}
+      testID={
+        isPrevMonth
+          ? 'prev-dateItem'
+          : isNextMonth
+          ? 'next-dateItem'
+          : 'dateItem'
+      }
     >
       <Text
         numberOfLines={1}

packages/CalendarCarousel/CalendarItem/index.tsx

@@ -33,19 +33,17 @@ interface CalendarItemProp {
   }) => JSX.Element;
 }
 
-export default function CalendarItem(props: CalendarItemProp): JSX.Element {
-  const {
-    dateObjects,
-    selectedDateObject,
-    width,
-    events,
-    showPrevDates = false,
-    showNextDates = false,
-    styles,
-    onDatePress,
-    renderDate,
-  } = props;
-
+export default function CalendarItem({
+  dateObjects,
+  selectedDateObject,
+  width,
+  events,
+  showPrevDates = false,
+  showNextDates = false,
+  styles,
+  onDatePress,
+  renderDate,
+}: CalendarItemProp): JSX.Element {
   const onPressDateItem = (date: DateObject): void => {
     onDatePress?.(date);
   };
@@ -77,14 +75,14 @@ export default function CalendarItem(props: CalendarItemProp): JSX.Element {
 
           return (
             <DateItem
+              calendarWidth={width}
+              dateObject={dateObj}
               isEvent={events?.includes(dateObj.date)}
-              showPrevDates={showPrevDates}
-              showNextDates={showNextDates}
-              selected={selected}
               key={`${dateObj}-${i}`}
-              dateObject={dateObj}
-              calendarWidth={width}
               onPress={onPressDateItem}
+              selected={selected}
+              showNextDates={showNextDates}
+              showPrevDates={showPrevDates}
               styles={styles}
             />
           );

packages/__tests__/CalendarCarousel.test.tsx

@@ -1,8 +1,9 @@
 import type {ComponentProps} from 'react';
-import React from 'react';
+import React, {Component} from 'react';
 import {Text} from 'react-native';
 import type {RenderAPI} from '@testing-library/react-native';
-import {fireEvent, render} from '@testing-library/react-native';
+import {fireEvent, render, screen} from '@testing-library/react-native';
+import {ko} from 'date-fns/locale';
 
 import {createComponent, createTestProps} from '../../test/testUtils';
 import CalendarCarousel from '../CalendarCarousel';
@@ -41,3 +42,62 @@ describe('[Calendar] render test', () => {
     expect(clickMock).toBeCalledTimes(1);
   });
 });
+
+describe('[Calendar-WeekdayItem] render', () => {
+  it('change with ko locale', () => {
+    props = createTestProps({
+      locale: ko,
+    });
+    component = createComponent(<CalendarCarousel {...props} />);
+
+    testingLib = render(component);
+
+    const json = testingLib.toJSON();
+    expect(json).toBeTruthy();
+  });
+});
+
+describe('[Calendar-MonthHeader] render', () => {
+  it('render MonthHeader with another component', () => {
+    props = createTestProps({
+      renderHeader: (value: Date) => (
+        <Text testID="test-render-header">{value.toString()}</Text>
+      ),
+    });
+
+    component = createComponent(<CalendarCarousel {...props} />);
+
+    testingLib = render(component);
+
+    const changeHeader = testingLib.getByTestId('test-render-header');
+    expect(changeHeader).toBeTruthy();
+  });
+});
+
+describe('[Calender-CalendarItem] render', () => {
+  it('should hide prev date item', () => {
+    props = createTestProps({
+      showPrevDates: false,
+    });
+
+    component = createComponent(<CalendarCarousel {...props} />);
+    testingLib = render(component);
+
+    const prevDates = testingLib.getAllByTestId('prev-dateItem');
+
+    expect(prevDates.length).toBe(0);
+  });
+
+  it('should hide next date item', () => {
+    props = createTestProps({
+      showNextPrevDates: false,
+    });
+
+    component = createComponent(<CalendarCarousel {...props} />);
+    testingLib = render(component);
+
+    const nextDates = testingLib.getAllByTestId('next-dateItem');
+
+    expect(nextDates.length).toBe(0);
+  });
+});