@coreui/react-pro 5.24.1 → 5.25.0

package/src/components/autocomplete/__tests__/__snapshots__/CAutocomplete.spec.tsx.snap

@@ -0,0 +1,129 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`CAutocomplete customize 1`] = `
+<div>
+  <div
+    class="autocomplete autocomplete-lg disabled bazinga"
+  >
+    <div
+      class="autocomplete-input-group"
+    >
+      <input
+        aria-autocomplete="list"
+        aria-haspopup="listbox"
+        autocomplete="off"
+        class="autocomplete-input"
+        disabled=""
+        id="autocomplete-:r1:"
+        name="autocomplete-:r1:"
+        placeholder="Select option"
+        role="combobox"
+        type="text"
+      />
+      <div
+        class="autocomplete-buttons"
+      >
+        <button
+          class="autocomplete-indicator"
+          type="button"
+        />
+      </div>
+    </div>
+    <div
+      aria-labelledby="autocomplete-:r1:"
+      class="autocomplete-dropdown"
+      id="autocomplete-listbox-:r1:"
+      role="listbox"
+    >
+      <div
+        class="autocomplete-options"
+        role="listbox"
+      >
+        <div
+          class="autocomplete-option"
+          tabindex="0"
+        >
+          Apple
+        </div>
+        <div
+          class="autocomplete-option"
+          tabindex="0"
+        >
+          Banana
+        </div>
+        <div
+          class="autocomplete-option"
+          tabindex="0"
+        >
+          Cherry
+        </div>
+        <div
+          class="autocomplete-option"
+          tabindex="0"
+        >
+          Date
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`loads and displays CAutocomplete component 1`] = `
+<div>
+  <div
+    class="autocomplete"
+  >
+    <div
+      class="autocomplete-input-group"
+    >
+      <input
+        aria-autocomplete="list"
+        aria-haspopup="listbox"
+        autocomplete="off"
+        class="autocomplete-input"
+        id="autocomplete-:r0:"
+        name="autocomplete-:r0:"
+        role="combobox"
+        type="text"
+      />
+    </div>
+    <div
+      aria-labelledby="autocomplete-:r0:"
+      class="autocomplete-dropdown"
+      id="autocomplete-listbox-:r0:"
+      role="listbox"
+    >
+      <div
+        class="autocomplete-options"
+        role="listbox"
+      >
+        <div
+          class="autocomplete-option"
+          tabindex="0"
+        >
+          Apple
+        </div>
+        <div
+          class="autocomplete-option"
+          tabindex="0"
+        >
+          Banana
+        </div>
+        <div
+          class="autocomplete-option"
+          tabindex="0"
+        >
+          Cherry
+        </div>
+        <div
+          class="autocomplete-option"
+          tabindex="0"
+        >
+          Date
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;

package/src/components/autocomplete/__tests__/__snapshots__/CAutocompleteOptions.spec.tsx.snap

@@ -0,0 +1,36 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`loads and displays CAutocompleteOptions component 1`] = `
+<div>
+  <div
+    class="autocomplete-options"
+    role="listbox"
+    style="overflow: scroll;"
+  >
+    <div
+      class="autocomplete-option"
+      tabindex="0"
+    >
+      Apple
+    </div>
+    <div
+      class="autocomplete-option"
+      tabindex="0"
+    >
+      Banana
+    </div>
+    <div
+      class="autocomplete-option"
+      tabindex="0"
+    >
+      Cherry
+    </div>
+    <div
+      class="autocomplete-option"
+      tabindex="0"
+    >
+      Date
+    </div>
+  </div>
+</div>
+`;

package/src/components/calendar/__tests__/CCalendar.spec.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react'
-import { render, screen } from '@testing-library/react'
+import { render } from '@testing-library/react'
 import '@testing-library/jest-dom'
 import { CCalendar } from '../CCalendar'
-import './test-setup'
+import './setup'
 
 describe('CCalendar', () => {
   it('loads and displays CCalendar component', () => {
@@ -11,117 +11,112 @@ describe('CCalendar', () => {
   })
 
   it('renders with default props', () => {
-    render(<CCalendar />)
-    expect(screen.getByRole('application')).toBeInTheDocument()
+    const { container } = render(<CCalendar />)
+    expect(container.querySelector('.calendars')).toBeInTheDocument()
   })
 
   it('handles date string props correctly', () => {
-    render(<CCalendar calendarDate="2/16/2022" />)
-    expect(screen.getByRole('application')).toBeInTheDocument()
+    const { container } = render(<CCalendar calendarDate="2/16/2022" />)
+    expect(container.querySelector('.calendars')).toBeInTheDocument()
   })
 
   it('handles Date object props correctly', () => {
     const testDate = new Date(2022, 1, 16)
-    render(<CCalendar calendarDate={testDate} />)
-    expect(screen.getByRole('application')).toBeInTheDocument()
+    const { container } = render(<CCalendar calendarDate={testDate} />)
+    expect(container.querySelector('.calendars')).toBeInTheDocument()
   })
 
   it('handles invalid dates gracefully', () => {
-    render(<CCalendar calendarDate="invalid-date" />)
-    expect(screen.getByRole('application')).toBeInTheDocument()
+    const { container } = render(<CCalendar calendarDate="invalid-date" />)
+    expect(container.querySelector('.calendars')).toBeInTheDocument()
   })
 
   it('handles null/undefined dates gracefully', () => {
-    render(<CCalendar calendarDate={null} />)
-    expect(screen.getByRole('application')).toBeInTheDocument()
+    const { container } = render(<CCalendar calendarDate={null} />)
+    expect(container.querySelector('.calendars')).toBeInTheDocument()
   })
 
   it('supports range selection', () => {
-    render(
-      <CCalendar 
+    const { container } = render(
+      <CCalendar
         range
         startDate="2/16/2022"
         endDate="2/20/2022"
       />
     )
-    expect(screen.getByRole('application')).toBeInTheDocument()
+    expect(container.querySelector('.calendars')).toBeInTheDocument()
   })
 
   it('supports disabled dates', () => {
     const disabledDates = [new Date(2022, 1, 16), new Date(2022, 1, 17)]
-    render(<CCalendar disabledDates={disabledDates} />)
-    expect(screen.getByRole('application')).toBeInTheDocument()
+    const { container } = render(<CCalendar disabledDates={disabledDates} />)
+    expect(container.querySelector('.calendars')).toBeInTheDocument()
   })
 
   it('supports min/max date constraints', () => {
-    render(
-      <CCalendar 
+    const { container } = render(
+      <CCalendar
         minDate="1/1/2022"
         maxDate="12/31/2022"
       />
     )
-    expect(screen.getByRole('application')).toBeInTheDocument()
+    expect(container.querySelector('.calendars')).toBeInTheDocument()
   })
 
   it('supports different selection types', () => {
     const selectionTypes = ['day', 'week', 'month', 'year'] as const
-    
+
     selectionTypes.forEach(type => {
-      render(<CCalendar selectionType={type} />)
-      expect(screen.getByRole('application')).toBeInTheDocument()
+      const { container } = render(<CCalendar selectionType={type} />)
+      expect(container.querySelector('.calendars')).toBeInTheDocument()
     })
   })
 
   it('supports different locales', () => {
     const locales = ['en-US', 'pl-PL', 'de-DE', 'fr-FR']
-    
+
     locales.forEach(locale => {
-      render(<CCalendar locale={locale} />)
-      expect(screen.getByRole('application')).toBeInTheDocument()
+      const { container } = render(<CCalendar locale={locale} />)
+      expect(container.querySelector('.calendars')).toBeInTheDocument()
     })
   })
 
   it('handles prop updates correctly', () => {
-    const { rerender } = render(<CCalendar calendarDate="2/16/2022" />)
-    expect(screen.getByRole('application')).toBeInTheDocument()
-    
+    const { container, rerender } = render(<CCalendar calendarDate="2/16/2022" />)
+    expect(container.querySelector('.calendars')).toBeInTheDocument()
+
     rerender(<CCalendar calendarDate="3/16/2022" />)
-    expect(screen.getByRole('application')).toBeInTheDocument()
+    expect(container.querySelector('.calendars')).toBeInTheDocument()
   })
 })
 
 // Additional regression tests for the timezone fix
 describe('CCalendar Timezone Fix Regression Tests', () => {
   it('correctly parses dates without timezone shifting', () => {
-    // This specifically tests the fix for the timezone bug
-    render(<CCalendar calendarDate="2/16/2022" />)
-    expect(screen.getByRole('application')).toBeInTheDocument()
-    
-    // The component should render without the date being shifted by timezone offset
-    // The actual date validation would require access to internal state or DOM content
+    const { container } = render(<CCalendar calendarDate="2/16/2022" />)
+    expect(container.querySelector('.calendars')).toBeInTheDocument()
   })
 
   it('maintains correct dates across different timezones', () => {
     const testDates = ['1/1/2022', '6/15/2022', '12/31/2022']
-    
+
     testDates.forEach(dateString => {
-      render(<CCalendar calendarDate={dateString} />)
-      expect(screen.getByRole('application')).toBeInTheDocument()
+      const { container } = render(<CCalendar calendarDate={dateString} />)
+      expect(container.querySelector('.calendars')).toBeInTheDocument()
     })
   })
 
   it('handles leap year dates correctly', () => {
-    render(<CCalendar calendarDate="2/29/2024" />)
-    expect(screen.getByRole('application')).toBeInTheDocument()
+    const { container } = render(<CCalendar calendarDate="2/29/2024" />)
+    expect(container.querySelector('.calendars')).toBeInTheDocument()
   })
 
   it('handles DST transition dates correctly', () => {
-    // Test dates around daylight saving time transitions
     const dstDates = ['3/11/2023', '3/12/2023', '11/4/2023', '11/5/2023']
-    
+
     dstDates.forEach(dateString => {
-      render(<CCalendar calendarDate={dateString} />)
-      expect(screen.getByRole('application')).toBeInTheDocument()
+      const { container } = render(<CCalendar calendarDate={dateString} />)
+      expect(container.querySelector('.calendars')).toBeInTheDocument()
     })
   })
 })