useConfirmOnClose.test.tsx 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153
  1. import { act, renderHook } from '@testing-library/react'
  2. import { describe, expect, it, vi } from 'vitest'
  3. import { useConfirmOnClose } from './useConfirmOnClose'
  4. describe('useConfirmOnClose', () => {
  5. it('closes immediately when the form is clean', () => {
  6. const onClose = vi.fn()
  7. const { result } = renderHook(() =>
  8. useConfirmOnClose({
  9. checkIsDirty: () => false,
  10. onClose,
  11. })
  12. )
  13. act(() => {
  14. result.current.confirmOnClose()
  15. })
  16. expect(onClose).toHaveBeenCalledTimes(1)
  17. expect(result.current.modalProps.visible).toBe(false)
  18. })
  19. it('opens the confirmation modal when the form is dirty', () => {
  20. const onClose = vi.fn()
  21. const { result } = renderHook(() =>
  22. useConfirmOnClose({
  23. checkIsDirty: () => true,
  24. onClose,
  25. })
  26. )
  27. act(() => {
  28. result.current.confirmOnClose()
  29. })
  30. expect(onClose).not.toHaveBeenCalled()
  31. expect(result.current.modalProps.visible).toBe(true)
  32. })
  33. it('ignores open events and handles close events via handleOpenChange', () => {
  34. const onClose = vi.fn()
  35. const { result } = renderHook(() =>
  36. useConfirmOnClose({
  37. checkIsDirty: () => true,
  38. onClose,
  39. })
  40. )
  41. act(() => {
  42. result.current.handleOpenChange(true)
  43. })
  44. expect(onClose).not.toHaveBeenCalled()
  45. expect(result.current.modalProps.visible).toBe(false)
  46. act(() => {
  47. result.current.handleOpenChange(false)
  48. })
  49. expect(onClose).not.toHaveBeenCalled()
  50. expect(result.current.modalProps.visible).toBe(true)
  51. })
  52. it('confirms and closes after the discard modal is accepted', () => {
  53. const onClose = vi.fn()
  54. const { result } = renderHook(() =>
  55. useConfirmOnClose({
  56. checkIsDirty: () => true,
  57. onClose,
  58. })
  59. )
  60. act(() => {
  61. result.current.confirmOnClose()
  62. })
  63. expect(result.current.modalProps.visible).toBe(true)
  64. act(() => {
  65. result.current.modalProps.onClose()
  66. })
  67. expect(onClose).toHaveBeenCalledTimes(1)
  68. expect(result.current.modalProps.visible).toBe(false)
  69. })
  70. it('cancels and keeps the form open after the discard modal is dismissed', () => {
  71. const onClose = vi.fn()
  72. const { result } = renderHook(() =>
  73. useConfirmOnClose({
  74. checkIsDirty: () => true,
  75. onClose,
  76. })
  77. )
  78. act(() => {
  79. result.current.confirmOnClose()
  80. })
  81. expect(result.current.modalProps.visible).toBe(true)
  82. act(() => {
  83. result.current.modalProps.onCancel()
  84. })
  85. expect(onClose).not.toHaveBeenCalled()
  86. expect(result.current.modalProps.visible).toBe(false)
  87. })
  88. it('uses the latest checkIsDirty and onClose callbacks', () => {
  89. const onCloseA = vi.fn()
  90. const onCloseB = vi.fn()
  91. let isDirty = false
  92. const { result, rerender } = renderHook(
  93. ({ onClose }: { onClose: () => void }) =>
  94. useConfirmOnClose({
  95. checkIsDirty: () => isDirty,
  96. onClose,
  97. }),
  98. {
  99. initialProps: { onClose: onCloseA },
  100. }
  101. )
  102. act(() => {
  103. result.current.confirmOnClose()
  104. })
  105. expect(onCloseA).toHaveBeenCalledTimes(1)
  106. isDirty = true
  107. rerender({ onClose: onCloseB })
  108. act(() => {
  109. result.current.confirmOnClose()
  110. })
  111. expect(result.current.modalProps.visible).toBe(true)
  112. act(() => {
  113. result.current.modalProps.onClose()
  114. })
  115. expect(onCloseB).toHaveBeenCalledTimes(1)
  116. })
  117. })