projectContext.spec.tsx 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. import {OrganizationFixture} from 'sentry-fixture/organization';
  2. import {ProjectFixture} from 'sentry-fixture/project';
  3. import {render, screen, waitFor} from 'sentry-test/reactTestingLibrary';
  4. import {ProjectContext} from 'sentry/views/projects/projectContext';
  5. jest.unmock('sentry/utils/recreateRoute');
  6. jest.mock('sentry/actionCreators/modal', () => ({
  7. redirectToProject: jest.fn(),
  8. }));
  9. describe('projectContext component', function () {
  10. const project = ProjectFixture();
  11. const org = OrganizationFixture();
  12. beforeEach(function () {
  13. MockApiClient.clearMockResponses();
  14. [project.slug, 'new-slug'].forEach(slug => {
  15. MockApiClient.addMockResponse({
  16. url: `/projects/${org.slug}/${slug}/members/`,
  17. method: 'GET',
  18. body: [],
  19. });
  20. MockApiClient.addMockResponse({
  21. url: `/projects/${org.slug}/${slug}/environments/`,
  22. method: 'GET',
  23. body: [],
  24. });
  25. });
  26. });
  27. it('displays error on 404s', async function () {
  28. MockApiClient.addMockResponse({
  29. url: `/projects/${org.slug}/${project.slug}/`,
  30. method: 'GET',
  31. statusCode: 404,
  32. });
  33. const projectContext = (
  34. <ProjectContext
  35. api={new MockApiClient()}
  36. loadingProjects={false}
  37. projects={[]}
  38. organization={org}
  39. projectSlug={project.slug}
  40. >
  41. {null}
  42. </ProjectContext>
  43. );
  44. render(projectContext);
  45. const loading = screen.getByTestId('loading-indicator');
  46. const errorText = await screen.findByText(
  47. 'The project you were looking for was not found.'
  48. );
  49. expect(errorText).toBeInTheDocument();
  50. expect(loading).not.toBeInTheDocument();
  51. });
  52. it('fetches data again if projectId changes', function () {
  53. let fetchMock = MockApiClient.addMockResponse({
  54. url: `/projects/${org.slug}/${project.slug}/`,
  55. method: 'GET',
  56. statusCode: 200,
  57. body: project,
  58. });
  59. const projectContext = (
  60. <ProjectContext
  61. api={new MockApiClient()}
  62. projects={[]}
  63. loadingProjects={false}
  64. organization={org}
  65. projectSlug={project.slug}
  66. >
  67. {null}
  68. </ProjectContext>
  69. );
  70. const {rerender} = render(projectContext);
  71. expect(fetchMock).toHaveBeenCalledTimes(1);
  72. // Nothing should happen if we update and projectId is the same
  73. rerender(projectContext);
  74. expect(fetchMock).toHaveBeenCalledTimes(1);
  75. fetchMock = MockApiClient.addMockResponse({
  76. url: `/projects/${org.slug}/new-slug/`,
  77. method: 'GET',
  78. statusCode: 200,
  79. body: ProjectFixture({slug: 'new-slug'}),
  80. });
  81. rerender(
  82. <ProjectContext
  83. api={new MockApiClient()}
  84. projects={[]}
  85. loadingProjects={false}
  86. organization={org}
  87. projectSlug="new-slug"
  88. >
  89. {null}
  90. </ProjectContext>
  91. );
  92. expect(fetchMock).toHaveBeenCalled();
  93. });
  94. it('fetches data again if projects list changes', async function () {
  95. const fetchMock = MockApiClient.addMockResponse({
  96. url: `/projects/${org.slug}/${project.slug}/`,
  97. method: 'GET',
  98. statusCode: 200,
  99. body: project,
  100. });
  101. const projectContext = (
  102. <ProjectContext
  103. api={new MockApiClient()}
  104. loadingProjects={false}
  105. projects={[]}
  106. organization={org}
  107. projectSlug={project.slug}
  108. >
  109. {null}
  110. </ProjectContext>
  111. );
  112. const {rerender} = render(projectContext);
  113. expect(fetchMock).toHaveBeenCalledTimes(1);
  114. // The project will become active, thus requesting org members
  115. MockApiClient.addMockResponse({
  116. url: `/organizations/${org.slug}/users/`,
  117. method: 'GET',
  118. statusCode: 200,
  119. body: [],
  120. });
  121. rerender(
  122. <ProjectContext
  123. organization={org}
  124. loadingProjects={false}
  125. api={new MockApiClient()}
  126. projects={[project]}
  127. projectSlug={project.slug}
  128. >
  129. {null}
  130. </ProjectContext>
  131. );
  132. await waitFor(() => expect(fetchMock).toHaveBeenCalledTimes(2));
  133. });
  134. });