@@ -2,7 +2,7 @@ import React, { useState } from 'react'
2
2
import { render , waitFor , screen , fireEvent } from '@testing-library/react'
3
3
import userEvent from '@testing-library/user-event'
4
4
import { axeComponent } from '../../../../../core/jest/jestSetup'
5
- import { DataContext , Field , FieldBlock , Form } from '../../..'
5
+ import { DataContext , Field , FieldBlock , Form , Wizard } from '../../..'
6
6
import nbNO from '../../../constants/locales/nb-NO'
7
7
import enGB from '../../../constants/locales/en-GB'
8
8
import { FormatDateOptions , formatDate } from '../../../Value/Date'
@@ -371,6 +371,102 @@ describe('Field.Date', () => {
371
371
) . toHaveAttribute ( 'aria-disabled' , 'true' )
372
372
} )
373
373
374
+ it ( 'should support min and max dates as date objects' , async ( ) => {
375
+ render (
376
+ < Wizard . Container >
377
+ < Wizard . Step title = "Step 1" >
378
+ < Field . Date
379
+ value = "2025-03-15"
380
+ minDate = { new Date ( '2025-03-13' ) }
381
+ maxDate = { new Date ( '2025-03-31' ) }
382
+ showResetButton = { false }
383
+ showCancelButton = { false }
384
+ />
385
+ < Wizard . Buttons />
386
+ </ Wizard . Step >
387
+ < Wizard . Step title = "Step 2" >
388
+ < Wizard . Buttons />
389
+ </ Wizard . Step >
390
+ </ Wizard . Container >
391
+ )
392
+
393
+ await userEvent . click ( screen . getByLabelText ( 'åpne datovelger' ) )
394
+
395
+ // Clicking the minDate should not trigger error
396
+ await userEvent . click ( screen . getByLabelText ( 'torsdag 13. mars 2025' ) )
397
+ await userEvent . click ( screen . getByText ( 'Neste' ) )
398
+ expect (
399
+ document . querySelector ( '.dnb-form-status--error' )
400
+ ) . not . toBeInTheDocument ( )
401
+
402
+ // Clicking the maxDate should not trigger error
403
+ await userEvent . click ( screen . getByText ( 'Tilbake' ) )
404
+ await userEvent . click ( screen . getByLabelText ( 'åpne datovelger' ) )
405
+ await userEvent . click ( screen . getByLabelText ( 'mandag 31. mars 2025' ) )
406
+ await userEvent . click ( screen . getByText ( 'Neste' ) )
407
+ expect (
408
+ document . querySelector ( '.dnb-form-status--error' )
409
+ ) . not . toBeInTheDocument ( )
410
+
411
+ // Double check that dates before min and max date are disabled in the calendar
412
+ await userEvent . click ( screen . getByText ( 'Tilbake' ) )
413
+ await userEvent . click ( screen . getByLabelText ( 'åpne datovelger' ) )
414
+ expect ( screen . getByLabelText ( 'onsdag 12. mars 2025' ) ) . toHaveAttribute (
415
+ 'disabled'
416
+ )
417
+ expect ( screen . getByLabelText ( 'tirsdag 1. april 2025' ) ) . toHaveAttribute (
418
+ 'disabled'
419
+ )
420
+ } )
421
+
422
+ it ( 'should support min and max dates as ISO strings' , async ( ) => {
423
+ render (
424
+ < Wizard . Container >
425
+ < Wizard . Step title = "Step 1" >
426
+ < Field . Date
427
+ value = "2025-03-15"
428
+ minDate = "2025-03-13T11:25:13.000Z"
429
+ maxDate = "2025-03-31T14:12:19.000Z"
430
+ showResetButton = { false }
431
+ showCancelButton = { false }
432
+ />
433
+ < Wizard . Buttons />
434
+ </ Wizard . Step >
435
+ < Wizard . Step title = "Step 2" >
436
+ < Wizard . Buttons />
437
+ </ Wizard . Step >
438
+ </ Wizard . Container >
439
+ )
440
+
441
+ await userEvent . click ( screen . getByLabelText ( 'åpne datovelger' ) )
442
+
443
+ // Clicking the minDate should not trigger error
444
+ await userEvent . click ( screen . getByLabelText ( 'torsdag 13. mars 2025' ) )
445
+ await userEvent . click ( screen . getByText ( 'Neste' ) )
446
+ expect (
447
+ document . querySelector ( '.dnb-form-status--error' )
448
+ ) . not . toBeInTheDocument ( )
449
+
450
+ // Clicking the maxDate should not trigger error
451
+ await userEvent . click ( screen . getByText ( 'Tilbake' ) )
452
+ await userEvent . click ( screen . getByLabelText ( 'åpne datovelger' ) )
453
+ await userEvent . click ( screen . getByLabelText ( 'mandag 31. mars 2025' ) )
454
+ await userEvent . click ( screen . getByText ( 'Neste' ) )
455
+ expect (
456
+ document . querySelector ( '.dnb-form-status--error' )
457
+ ) . not . toBeInTheDocument ( )
458
+
459
+ // Double check that dates before min and max date are disabled in the calendar
460
+ await userEvent . click ( screen . getByText ( 'Tilbake' ) )
461
+ await userEvent . click ( screen . getByLabelText ( 'åpne datovelger' ) )
462
+ expect ( screen . getByLabelText ( 'onsdag 12. mars 2025' ) ) . toHaveAttribute (
463
+ 'disabled'
464
+ )
465
+ expect ( screen . getByLabelText ( 'tirsdag 1. april 2025' ) ) . toHaveAttribute (
466
+ 'disabled'
467
+ )
468
+ } )
469
+
374
470
it ( 'should be able to correct invalid dates' , async ( ) => {
375
471
render (
376
472
< Field . Date
0 commit comments