header.spec.tsx 7.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224
  1. import {browserHistory} from 'react-router';
  2. import {GroupFixture} from 'sentry-fixture/group';
  3. import {OrganizationFixture} from 'sentry-fixture/organization';
  4. import {ProjectFixture} from 'sentry-fixture/project';
  5. import {TeamFixture} from 'sentry-fixture/team';
  6. import {render, screen, userEvent} from 'sentry-test/reactTestingLibrary';
  7. import {IssueCategory, PriorityLevel} from 'sentry/types';
  8. import GroupHeader from 'sentry/views/issueDetails/header';
  9. import {ReprocessingStatus} from 'sentry/views/issueDetails/utils';
  10. describe('GroupHeader', () => {
  11. const baseUrl = 'BASE_URL/';
  12. const organization = OrganizationFixture();
  13. const project = ProjectFixture({
  14. teams: [TeamFixture()],
  15. });
  16. describe('issue category: error, js project', () => {
  17. const defaultProps = {
  18. organization,
  19. baseUrl,
  20. group: GroupFixture({issueCategory: IssueCategory.ERROR}),
  21. groupReprocessingStatus: ReprocessingStatus.NO_STATUS,
  22. project,
  23. };
  24. it('displays the correct tabs with all features enabled', async () => {
  25. const orgWithFeatures = OrganizationFixture({
  26. features: ['similarity-view', 'event-attachments', 'session-replay'],
  27. });
  28. const jsProjectWithSimilarityView = ProjectFixture({
  29. features: ['similarity-view'],
  30. platform: 'javascript',
  31. });
  32. const MOCK_GROUP = GroupFixture();
  33. MockApiClient.addMockResponse({
  34. url: `/organizations/${organization.slug}/replay-count/`,
  35. method: 'GET',
  36. body: {
  37. [MOCK_GROUP.id]: ['replay42', 'replay256'],
  38. },
  39. });
  40. render(
  41. <GroupHeader
  42. {...defaultProps}
  43. organization={orgWithFeatures}
  44. project={jsProjectWithSimilarityView}
  45. />,
  46. {organization: orgWithFeatures}
  47. );
  48. await userEvent.click(screen.getByRole('tab', {name: /details/i}));
  49. expect(browserHistory.push).toHaveBeenLastCalledWith('BASE_URL/');
  50. await userEvent.click(screen.getByRole('tab', {name: /activity/i}));
  51. expect(browserHistory.push).toHaveBeenCalledWith('BASE_URL/activity/');
  52. await userEvent.click(screen.getByRole('tab', {name: /user feedback/i}));
  53. expect(browserHistory.push).toHaveBeenCalledWith('BASE_URL/feedback/');
  54. await userEvent.click(screen.getByRole('tab', {name: /attachments/i}));
  55. expect(browserHistory.push).toHaveBeenCalledWith('BASE_URL/attachments/');
  56. await userEvent.click(screen.getByRole('tab', {name: /tags/i}));
  57. expect(browserHistory.push).toHaveBeenCalledWith('BASE_URL/tags/');
  58. await userEvent.click(screen.getByRole('tab', {name: /all events/i}));
  59. expect(browserHistory.push).toHaveBeenCalledWith({
  60. pathname: 'BASE_URL/events/',
  61. query: {},
  62. });
  63. await userEvent.click(screen.getByRole('tab', {name: /merged issues/i}));
  64. expect(browserHistory.push).toHaveBeenCalledWith('BASE_URL/merged/');
  65. await userEvent.click(screen.getByRole('tab', {name: /replays/i}));
  66. expect(browserHistory.push).toHaveBeenCalledWith('BASE_URL/replays/');
  67. expect(screen.queryByRole('tab', {name: /replays/i})).toBeInTheDocument();
  68. });
  69. });
  70. describe('issue category: error, mobile project', () => {
  71. const defaultProps = {
  72. organization,
  73. baseUrl,
  74. group: GroupFixture({issueCategory: IssueCategory.ERROR}),
  75. groupReprocessingStatus: ReprocessingStatus.NO_STATUS,
  76. project,
  77. };
  78. it('displays the correct tabs with all features enabled', async () => {
  79. const orgWithFeatures = OrganizationFixture({
  80. features: ['similarity-view', 'event-attachments', 'session-replay'],
  81. });
  82. const mobileProjectWithSimilarityView = ProjectFixture({
  83. features: ['similarity-view'],
  84. platform: 'apple-ios',
  85. });
  86. const MOCK_GROUP = GroupFixture();
  87. MockApiClient.addMockResponse({
  88. url: `/organizations/${organization.slug}/replay-count/`,
  89. method: 'GET',
  90. body: {
  91. [MOCK_GROUP.id]: ['replay42', 'replay256'],
  92. },
  93. });
  94. render(
  95. <GroupHeader
  96. {...defaultProps}
  97. organization={orgWithFeatures}
  98. project={mobileProjectWithSimilarityView}
  99. />,
  100. {organization: orgWithFeatures}
  101. );
  102. await userEvent.click(screen.getByRole('tab', {name: /similar issues/i}));
  103. expect(browserHistory.push).toHaveBeenCalledWith('BASE_URL/similar/');
  104. expect(screen.queryByRole('tab', {name: /replays/i})).not.toBeInTheDocument();
  105. });
  106. });
  107. describe('issue category: performance', () => {
  108. const defaultProps = {
  109. organization,
  110. baseUrl,
  111. group: GroupFixture({issueCategory: IssueCategory.PERFORMANCE}),
  112. groupReprocessingStatus: ReprocessingStatus.NO_STATUS,
  113. project,
  114. };
  115. it('displays the correct tabs with all features enabled', async () => {
  116. const orgWithFeatures = OrganizationFixture({
  117. features: ['similarity-view', 'event-attachments', 'session-replay'],
  118. });
  119. const projectWithSimilarityView = ProjectFixture({
  120. features: ['similarity-view'],
  121. });
  122. const MOCK_GROUP = GroupFixture({issueCategory: IssueCategory.PERFORMANCE});
  123. MockApiClient.addMockResponse({
  124. url: `/organizations/${organization.slug}/replay-count/`,
  125. method: 'GET',
  126. body: {
  127. [MOCK_GROUP.id]: ['replay42', 'replay256'],
  128. },
  129. });
  130. render(
  131. <GroupHeader
  132. {...defaultProps}
  133. organization={orgWithFeatures}
  134. project={projectWithSimilarityView}
  135. />,
  136. {organization: orgWithFeatures}
  137. );
  138. await userEvent.click(screen.getByRole('tab', {name: /details/i}));
  139. expect(browserHistory.push).toHaveBeenLastCalledWith('BASE_URL/');
  140. await userEvent.click(screen.getByRole('tab', {name: /tags/i}));
  141. expect(browserHistory.push).toHaveBeenCalledWith('BASE_URL/tags/');
  142. await userEvent.click(screen.getByRole('tab', {name: /sampled events/i}));
  143. expect(browserHistory.push).toHaveBeenCalledWith({
  144. pathname: 'BASE_URL/events/',
  145. query: {},
  146. });
  147. expect(screen.queryByRole('tab', {name: /user feedback/i})).not.toBeInTheDocument();
  148. expect(screen.queryByRole('tab', {name: /attachments/i})).not.toBeInTheDocument();
  149. expect(screen.queryByRole('tab', {name: /merged issues/i})).not.toBeInTheDocument();
  150. expect(
  151. screen.queryByRole('tab', {name: /similar issues/i})
  152. ).not.toBeInTheDocument();
  153. expect(screen.queryByRole('tab', {name: /replays/i})).not.toBeInTheDocument();
  154. });
  155. });
  156. describe('priority', () => {
  157. it('can change priority', async function () {
  158. const mockModifyIssue = MockApiClient.addMockResponse({
  159. url: `/projects/org-slug/project-slug/issues/`,
  160. method: 'PUT',
  161. body: {},
  162. });
  163. MockApiClient.addMockResponse({
  164. url: '/organizations/org-slug/replay-count/',
  165. body: {},
  166. });
  167. render(
  168. <GroupHeader
  169. baseUrl=""
  170. organization={OrganizationFixture({features: ['issue-priority-ui']})}
  171. group={GroupFixture({priority: PriorityLevel.MEDIUM})}
  172. project={ProjectFixture()}
  173. groupReprocessingStatus={ReprocessingStatus.NO_STATUS}
  174. />
  175. );
  176. await userEvent.click(screen.getByRole('button', {name: 'Modify issue priority'}));
  177. await userEvent.click(screen.getByRole('menuitemradio', {name: 'High'}));
  178. expect(mockModifyIssue).toHaveBeenCalledWith(
  179. expect.anything(),
  180. expect.objectContaining({
  181. data: {priority: PriorityLevel.HIGH},
  182. })
  183. );
  184. });
  185. });
  186. });