DeleteBucketModal.test.tsx 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. import { faker } from '@faker-js/faker'
  2. import { fireEvent, screen, waitFor } from '@testing-library/dom'
  3. import userEvent from '@testing-library/user-event'
  4. import { useState } from 'react'
  5. import { beforeEach, describe, expect, it, vi } from 'vitest'
  6. import { DeleteBucketModal } from '../DeleteBucketModal'
  7. import { ProjectContextProvider } from '@/components/layouts/ProjectLayout/ProjectContext'
  8. import { Bucket } from '@/data/storage/buckets-query'
  9. import { customRender } from '@/tests/lib/custom-render'
  10. import { addAPIMock } from '@/tests/lib/msw'
  11. import { routerMock } from '@/tests/lib/route-mock'
  12. const bucket: Bucket = {
  13. id: 'test',
  14. name: 'test',
  15. owner: faker.string.uuid(),
  16. public: faker.datatype.boolean(),
  17. allowed_mime_types: faker.helpers.multiple(() => faker.system.mimeType(), {
  18. count: { min: 1, max: 5 },
  19. }),
  20. file_size_limit: faker.number.int({ min: 0, max: 25165824 }),
  21. type: 'STANDARD',
  22. created_at: faker.date.recent().toISOString(),
  23. updated_at: faker.date.recent().toISOString(),
  24. }
  25. const Page = ({ onClose }: { onClose: () => void }) => {
  26. const [open, setOpen] = useState(false)
  27. return (
  28. <ProjectContextProvider projectRef="default">
  29. <button onClick={() => setOpen(true)}>Open</button>
  30. <DeleteBucketModal
  31. visible={open}
  32. bucket={bucket}
  33. onClose={() => {
  34. setOpen(false)
  35. onClose()
  36. }}
  37. />
  38. </ProjectContextProvider>
  39. )
  40. }
  41. describe(`DeleteBucketModal`, () => {
  42. beforeEach(() => {
  43. // useParams
  44. routerMock.setCurrentUrl(`/project/default/storage/files`)
  45. // useProjectContext
  46. addAPIMock({
  47. method: `get`,
  48. path: `/platform/projects/:ref`,
  49. // @ts-expect-error
  50. response: {
  51. cloud_provider: 'localhost',
  52. id: 1,
  53. inserted_at: '2021-08-02T06:40:40.646Z',
  54. name: 'Default Project',
  55. organization_id: 1,
  56. ref: 'default',
  57. region: 'local',
  58. status: 'ACTIVE_HEALTHY',
  59. },
  60. })
  61. // usePaginatedBucketsQuery
  62. addAPIMock({
  63. method: `get`,
  64. path: `/platform/storage/:ref/buckets`,
  65. response: [bucket],
  66. })
  67. // useDatabasePoliciesQuery
  68. addAPIMock({
  69. method: `get`,
  70. path: `/platform/pg-meta/:ref/policies`,
  71. response: [
  72. {
  73. id: faker.number.int({ min: 1 }),
  74. name: faker.word.noun(),
  75. action: faker.helpers.arrayElement(['PERMISSIVE', 'RESTRICTIVE']),
  76. command: faker.helpers.arrayElement(['SELECT', 'INSERT', 'UPDATE', 'DELETE', 'ALL']),
  77. table: faker.word.noun(),
  78. table_id: faker.number.int({ min: 1 }),
  79. check: null,
  80. definition: null,
  81. schema: faker.lorem.sentence(),
  82. roles: faker.helpers.multiple(() => faker.word.noun(), {
  83. count: { min: 1, max: 5 },
  84. }),
  85. },
  86. ],
  87. })
  88. // useBucketDeleteMutation - empty bucket
  89. addAPIMock({
  90. method: `post`,
  91. path: `/platform/storage/:ref/buckets/:id/empty`,
  92. })
  93. // useBucketDeleteMutation - poll for empty bucket
  94. addAPIMock({
  95. method: `post`,
  96. path: `/platform/storage/:ref/buckets/:id/objects/list`,
  97. response: [], // Return empty array to indicate bucket is empty
  98. })
  99. // useBucketDeleteMutation - delete bucket
  100. addAPIMock({
  101. method: `delete`,
  102. path: `/platform/storage/:ref/buckets/:id`,
  103. })
  104. })
  105. it(`renders a confirmation dialog`, async () => {
  106. const onClose = vi.fn()
  107. customRender(<Page onClose={onClose} />)
  108. const openButton = screen.getByRole(`button`, { name: `Open` })
  109. await userEvent.click(openButton)
  110. await screen.findByRole(`dialog`)
  111. const input = screen.getByPlaceholderText(`Type bucket name`)
  112. await userEvent.type(input, `test`)
  113. const confirmButton = screen.getByRole(`button`, { name: `Delete bucket` })
  114. fireEvent.click(confirmButton)
  115. await waitFor(() => expect(onClose).toHaveBeenCalledOnce())
  116. expect(routerMock.asPath).toStrictEqual(`/project/default/storage/files`)
  117. })
  118. })