releaseWidgetQueries.spec.tsx 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825
  1. import {
  2. MetricsFieldFixture,
  3. MetricsSessionUserCountByStatusByReleaseFixture,
  4. } from 'sentry-fixture/metrics';
  5. import {SessionsFieldFixture} from 'sentry-fixture/sessions';
  6. import {initializeOrg} from 'sentry-test/initializeOrg';
  7. import {render, screen, waitFor} from 'sentry-test/reactTestingLibrary';
  8. import {resetMockDate, setMockDate} from 'sentry-test/utils';
  9. import {
  10. DashboardFilterKeys,
  11. DisplayType,
  12. WidgetType,
  13. } from 'sentry/views/dashboards/types';
  14. import ReleaseWidgetQueries from 'sentry/views/dashboards/widgetCard/releaseWidgetQueries';
  15. describe('Dashboards > ReleaseWidgetQueries', function () {
  16. const {organization} = initializeOrg();
  17. const badMessage = 'Bad request data';
  18. const multipleQueryWidget = {
  19. title: 'Sessions vs. Users',
  20. interval: '5m',
  21. displayType: DisplayType.LINE,
  22. queries: [
  23. {
  24. conditions: '',
  25. fields: [`sum(session)`],
  26. aggregates: [`sum(session)`],
  27. columns: [],
  28. name: 'sessions',
  29. orderby: '',
  30. },
  31. {
  32. conditions: 'environment:prod',
  33. fields: [`sum(session)`],
  34. aggregates: [`sum(session)`],
  35. columns: [],
  36. name: 'users',
  37. orderby: '',
  38. },
  39. ],
  40. widgetType: WidgetType.RELEASE,
  41. };
  42. const singleQueryWidget = {
  43. title: 'Sessions',
  44. interval: '5m',
  45. displayType: DisplayType.LINE,
  46. queries: [
  47. {
  48. conditions: '',
  49. fields: [`count_unique(user)`],
  50. aggregates: [`count_unique(user)`],
  51. columns: [],
  52. name: 'sessions',
  53. orderby: '-count_unique(user)',
  54. },
  55. ],
  56. widgetType: WidgetType.RELEASE,
  57. };
  58. const selection = {
  59. projects: [1],
  60. environments: ['prod'],
  61. datetime: {
  62. period: '14d',
  63. start: null,
  64. end: null,
  65. utc: null,
  66. },
  67. };
  68. const api = new MockApiClient();
  69. beforeEach(function () {
  70. setMockDate(new Date('2022-08-02'));
  71. });
  72. afterEach(function () {
  73. MockApiClient.clearMockResponses();
  74. resetMockDate();
  75. });
  76. it('can send chart requests', async function () {
  77. const mock = MockApiClient.addMockResponse({
  78. url: '/organizations/org-slug/metrics/data/',
  79. body: MetricsFieldFixture(`session.all`),
  80. });
  81. const children = jest.fn(() => <div />);
  82. render(
  83. <ReleaseWidgetQueries
  84. api={api}
  85. widget={singleQueryWidget}
  86. organization={organization}
  87. selection={selection}
  88. >
  89. {children}
  90. </ReleaseWidgetQueries>
  91. );
  92. expect(mock).toHaveBeenCalledTimes(1);
  93. await waitFor(() =>
  94. expect(children).toHaveBeenLastCalledWith(
  95. expect.objectContaining({
  96. tableResults: undefined,
  97. timeseriesResults: [
  98. {
  99. data: expect.arrayContaining([
  100. {name: '2021-12-01T16:15:00Z', value: 443.6200417187068},
  101. {name: '2021-12-01T16:30:00Z', value: 471.7512262596214},
  102. {name: '2021-12-01T16:45:00Z', value: 632.5356294251225},
  103. {name: '2021-12-01T17:00:00Z', value: 538.6063865509535},
  104. ]),
  105. seriesName: 'sessions > sum(session)',
  106. },
  107. ],
  108. })
  109. )
  110. );
  111. });
  112. it('fetches release data when sorting on release for metrics api', async function () {
  113. const mockRelease = MockApiClient.addMockResponse({
  114. url: '/organizations/org-slug/releases/',
  115. body: [
  116. {
  117. version: 'be1ddfb18126dd2cbde26bfe75488503280e716e',
  118. },
  119. ],
  120. });
  121. const mock = MockApiClient.addMockResponse({
  122. url: '/organizations/org-slug/metrics/data/',
  123. body: MetricsSessionUserCountByStatusByReleaseFixture(),
  124. });
  125. const children = jest.fn(() => <div />);
  126. const queries = [
  127. {
  128. conditions: '',
  129. fields: [`count_unique(user)`],
  130. aggregates: [`count_unique(user)`],
  131. columns: ['release'],
  132. name: 'sessions',
  133. orderby: '-release',
  134. },
  135. ];
  136. render(
  137. <ReleaseWidgetQueries
  138. api={api}
  139. widget={{...singleQueryWidget, queries}}
  140. organization={organization}
  141. selection={selection}
  142. >
  143. {children}
  144. </ReleaseWidgetQueries>
  145. );
  146. await waitFor(() => expect(mockRelease).toHaveBeenCalledTimes(1));
  147. expect(mockRelease).toHaveBeenCalledWith(
  148. '/organizations/org-slug/releases/',
  149. expect.objectContaining({
  150. data: {
  151. environment: ['prod'],
  152. per_page: 50,
  153. project: [1],
  154. sort: 'date',
  155. },
  156. })
  157. );
  158. expect(mock).toHaveBeenCalledTimes(1);
  159. expect(mock).toHaveBeenCalledWith(
  160. '/organizations/org-slug/metrics/data/',
  161. expect.objectContaining({
  162. query: {
  163. environment: ['prod'],
  164. field: ['count_unique(sentry.sessions.user)'],
  165. groupBy: ['release'],
  166. includeSeries: 1,
  167. includeTotals: 1,
  168. interval: '12h',
  169. per_page: 100,
  170. project: [1],
  171. query: ' release:be1ddfb18126dd2cbde26bfe75488503280e716e',
  172. statsPeriod: '14d',
  173. },
  174. })
  175. );
  176. });
  177. it('calls session api when session.status is a group by', async function () {
  178. const mock = MockApiClient.addMockResponse({
  179. url: '/organizations/org-slug/sessions/',
  180. body: MetricsFieldFixture(`count_unique(user)`),
  181. });
  182. const children = jest.fn(() => <div />);
  183. const queries = [
  184. {
  185. conditions: '',
  186. fields: [`count_unique(user)`],
  187. aggregates: [`count_unique(user)`],
  188. columns: ['session.status'],
  189. name: 'sessions',
  190. orderby: '-count_unique(user)',
  191. },
  192. ];
  193. render(
  194. <ReleaseWidgetQueries
  195. api={api}
  196. widget={{...singleQueryWidget, queries}}
  197. organization={organization}
  198. selection={selection}
  199. >
  200. {children}
  201. </ReleaseWidgetQueries>
  202. );
  203. await waitFor(() => {
  204. expect(mock).toHaveBeenCalledWith(
  205. '/organizations/org-slug/sessions/',
  206. expect.objectContaining({
  207. query: expect.objectContaining({
  208. environment: ['prod'],
  209. field: ['count_unique(user)'],
  210. groupBy: ['session.status'],
  211. interval: '30m',
  212. project: [1],
  213. statsPeriod: '14d',
  214. }),
  215. })
  216. );
  217. });
  218. });
  219. it('appends dashboard filters to releases request', async function () {
  220. const mock = MockApiClient.addMockResponse({
  221. url: '/organizations/org-slug/metrics/data/',
  222. body: MetricsSessionUserCountByStatusByReleaseFixture(),
  223. });
  224. render(
  225. <ReleaseWidgetQueries
  226. api={api}
  227. widget={singleQueryWidget}
  228. organization={organization}
  229. selection={selection}
  230. dashboardFilters={{[DashboardFilterKeys.RELEASE]: ['abc@1.3.0']}}
  231. >
  232. {() => <div data-test-id="child" />}
  233. </ReleaseWidgetQueries>
  234. );
  235. await screen.findByTestId('child');
  236. expect(mock).toHaveBeenCalledWith(
  237. '/organizations/org-slug/metrics/data/',
  238. expect.objectContaining({
  239. query: expect.objectContaining({
  240. query: ' release:"abc@1.3.0" ',
  241. }),
  242. })
  243. );
  244. });
  245. it('strips injected sort columns', async function () {
  246. const mock = MockApiClient.addMockResponse({
  247. url: '/organizations/org-slug/metrics/data/',
  248. body: MetricsSessionUserCountByStatusByReleaseFixture(),
  249. });
  250. const children = jest.fn(() => <div />);
  251. const injectedOrderby = {
  252. title: 'Sessions',
  253. interval: '5m',
  254. displayType: DisplayType.LINE,
  255. queries: [
  256. {
  257. conditions: '',
  258. fields: [`sum(session)`],
  259. aggregates: [`sum(session)`],
  260. columns: [],
  261. name: 'sessions',
  262. orderby: '-count_unique(user)',
  263. },
  264. ],
  265. widgetType: WidgetType.RELEASE,
  266. };
  267. render(
  268. <ReleaseWidgetQueries
  269. api={api}
  270. widget={injectedOrderby}
  271. organization={organization}
  272. selection={selection}
  273. >
  274. {children}
  275. </ReleaseWidgetQueries>
  276. );
  277. expect(mock).toHaveBeenCalledTimes(1);
  278. await waitFor(() =>
  279. expect(children).toHaveBeenLastCalledWith(
  280. expect.objectContaining({
  281. errorMessage: undefined,
  282. loading: false,
  283. timeseriesResults: [
  284. {
  285. data: [
  286. {name: '2022-01-15T00:00:00Z', value: 0},
  287. {name: '2022-01-16T00:00:00Z', value: 0},
  288. {name: '2022-01-17T00:00:00Z', value: 0},
  289. {name: '2022-01-18T00:00:00Z', value: 0},
  290. {name: '2022-01-19T00:00:00Z', value: 0},
  291. {name: '2022-01-20T00:00:00Z', value: 0},
  292. {name: '2022-01-21T00:00:00Z', value: 0},
  293. {name: '2022-01-22T00:00:00Z', value: 0},
  294. {name: '2022-01-23T00:00:00Z', value: 0},
  295. {name: '2022-01-24T00:00:00Z', value: 23},
  296. {name: '2022-01-25T00:00:00Z', value: 11},
  297. {name: '2022-01-26T00:00:00Z', value: 0},
  298. {name: '2022-01-27T00:00:00Z', value: 0},
  299. {name: '2022-01-28T00:00:00Z', value: 0},
  300. ],
  301. seriesName: 'sessions > crashed, 1 : sum(session)',
  302. },
  303. {
  304. data: [
  305. {name: '2022-01-15T00:00:00Z', value: 1},
  306. {name: '2022-01-16T00:00:00Z', value: 0},
  307. {name: '2022-01-17T00:00:00Z', value: 0},
  308. {name: '2022-01-18T00:00:00Z', value: 0},
  309. {name: '2022-01-19T00:00:00Z', value: 0},
  310. {name: '2022-01-20T00:00:00Z', value: 0},
  311. {name: '2022-01-21T00:00:00Z', value: 0},
  312. {name: '2022-01-22T00:00:00Z', value: 0},
  313. {name: '2022-01-23T00:00:00Z', value: 0},
  314. {name: '2022-01-24T00:00:00Z', value: 0},
  315. {name: '2022-01-25T00:00:00Z', value: 0},
  316. {name: '2022-01-26T00:00:00Z', value: 0},
  317. {name: '2022-01-27T00:00:00Z', value: 0},
  318. {name: '2022-01-28T00:00:00Z', value: 0},
  319. ],
  320. seriesName: 'sessions > abnormal, 1 : sum(session)',
  321. },
  322. {
  323. data: [
  324. {name: '2022-01-15T00:00:00Z', value: 0},
  325. {name: '2022-01-16T00:00:00Z', value: 0},
  326. {name: '2022-01-17T00:00:00Z', value: 0},
  327. {name: '2022-01-18T00:00:00Z', value: 0},
  328. {name: '2022-01-19T00:00:00Z', value: 0},
  329. {name: '2022-01-20T00:00:00Z', value: 37},
  330. {name: '2022-01-21T00:00:00Z', value: 0},
  331. {name: '2022-01-22T00:00:00Z', value: 0},
  332. {name: '2022-01-23T00:00:00Z', value: 0},
  333. {name: '2022-01-24T00:00:00Z', value: 335},
  334. {name: '2022-01-25T00:00:00Z', value: 79},
  335. {name: '2022-01-26T00:00:00Z', value: 0},
  336. {name: '2022-01-27T00:00:00Z', value: 0},
  337. {name: '2022-01-28T00:00:00Z', value: 0},
  338. ],
  339. seriesName: 'sessions > errored, 1 : sum(session)',
  340. },
  341. {
  342. data: [
  343. {name: '2022-01-15T00:00:00Z', value: 0},
  344. {name: '2022-01-16T00:00:00Z', value: 0},
  345. {name: '2022-01-17T00:00:00Z', value: 0},
  346. {name: '2022-01-18T00:00:00Z', value: 0},
  347. {name: '2022-01-19T00:00:00Z', value: 0},
  348. {name: '2022-01-20T00:00:00Z', value: 2503},
  349. {name: '2022-01-21T00:00:00Z', value: 661},
  350. {name: '2022-01-22T00:00:00Z', value: 0},
  351. {name: '2022-01-23T00:00:00Z', value: 0},
  352. {name: '2022-01-24T00:00:00Z', value: 1464},
  353. {name: '2022-01-25T00:00:00Z', value: 430},
  354. {name: '2022-01-26T00:00:00Z', value: 0},
  355. {name: '2022-01-27T00:00:00Z', value: 0},
  356. {name: '2022-01-28T00:00:00Z', value: 0},
  357. ],
  358. seriesName: 'sessions > healthy, 1 : sum(session)',
  359. },
  360. {
  361. data: [
  362. {name: '2022-01-15T00:00:00Z', value: 1},
  363. {name: '2022-01-16T00:00:00Z', value: 0},
  364. {name: '2022-01-17T00:00:00Z', value: 0},
  365. {name: '2022-01-18T00:00:00Z', value: 0},
  366. {name: '2022-01-19T00:00:00Z', value: 0},
  367. {name: '2022-01-20T00:00:00Z', value: 0},
  368. {name: '2022-01-21T00:00:00Z', value: 0},
  369. {name: '2022-01-22T00:00:00Z', value: 0},
  370. {name: '2022-01-23T00:00:00Z', value: 0},
  371. {name: '2022-01-24T00:00:00Z', value: 23},
  372. {name: '2022-01-25T00:00:00Z', value: 11},
  373. {name: '2022-01-26T00:00:00Z', value: 0},
  374. {name: '2022-01-27T00:00:00Z', value: 0},
  375. {name: '2022-01-28T00:00:00Z', value: 0},
  376. ],
  377. seriesName: 'sessions > crashed, 2 : sum(session)',
  378. },
  379. {
  380. data: [
  381. {name: '2022-01-15T00:00:00Z', value: 1},
  382. {name: '2022-01-16T00:00:00Z', value: 0},
  383. {name: '2022-01-17T00:00:00Z', value: 0},
  384. {name: '2022-01-18T00:00:00Z', value: 0},
  385. {name: '2022-01-19T00:00:00Z', value: 0},
  386. {name: '2022-01-20T00:00:00Z', value: 0},
  387. {name: '2022-01-21T00:00:00Z', value: 0},
  388. {name: '2022-01-22T00:00:00Z', value: 0},
  389. {name: '2022-01-23T00:00:00Z', value: 0},
  390. {name: '2022-01-24T00:00:00Z', value: 0},
  391. {name: '2022-01-25T00:00:00Z', value: 0},
  392. {name: '2022-01-26T00:00:00Z', value: 0},
  393. {name: '2022-01-27T00:00:00Z', value: 0},
  394. {name: '2022-01-28T00:00:00Z', value: 0},
  395. ],
  396. seriesName: 'sessions > abnormal, 2 : sum(session)',
  397. },
  398. {
  399. data: [
  400. {name: '2022-01-15T00:00:00Z', value: 1},
  401. {name: '2022-01-16T00:00:00Z', value: 0},
  402. {name: '2022-01-17T00:00:00Z', value: 0},
  403. {name: '2022-01-18T00:00:00Z', value: 0},
  404. {name: '2022-01-19T00:00:00Z', value: 0},
  405. {name: '2022-01-20T00:00:00Z', value: 37},
  406. {name: '2022-01-21T00:00:00Z', value: 0},
  407. {name: '2022-01-22T00:00:00Z', value: 0},
  408. {name: '2022-01-23T00:00:00Z', value: 0},
  409. {name: '2022-01-24T00:00:00Z', value: 335},
  410. {name: '2022-01-25T00:00:00Z', value: 79},
  411. {name: '2022-01-26T00:00:00Z', value: 0},
  412. {name: '2022-01-27T00:00:00Z', value: 0},
  413. {name: '2022-01-28T00:00:00Z', value: 0},
  414. ],
  415. seriesName: 'sessions > errored, 2 : sum(session)',
  416. },
  417. {
  418. data: [
  419. {name: '2022-01-15T00:00:00Z', value: 1},
  420. {name: '2022-01-16T00:00:00Z', value: 0},
  421. {name: '2022-01-17T00:00:00Z', value: 0},
  422. {name: '2022-01-18T00:00:00Z', value: 0},
  423. {name: '2022-01-19T00:00:00Z', value: 0},
  424. {name: '2022-01-20T00:00:00Z', value: 2503},
  425. {name: '2022-01-21T00:00:00Z', value: 661},
  426. {name: '2022-01-22T00:00:00Z', value: 0},
  427. {name: '2022-01-23T00:00:00Z', value: 0},
  428. {name: '2022-01-24T00:00:00Z', value: 1464},
  429. {name: '2022-01-25T00:00:00Z', value: 430},
  430. {name: '2022-01-26T00:00:00Z', value: 0},
  431. {name: '2022-01-27T00:00:00Z', value: 0},
  432. {name: '2022-01-28T00:00:00Z', value: 0},
  433. ],
  434. seriesName: 'sessions > healthy, 2 : sum(session)',
  435. },
  436. ],
  437. })
  438. )
  439. );
  440. });
  441. it('can send table requests', async function () {
  442. const mock = MockApiClient.addMockResponse({
  443. url: '/organizations/org-slug/metrics/data/',
  444. body: MetricsSessionUserCountByStatusByReleaseFixture(),
  445. });
  446. const children = jest.fn(() => <div />);
  447. render(
  448. <ReleaseWidgetQueries
  449. api={api}
  450. widget={{...singleQueryWidget, displayType: DisplayType.TABLE}}
  451. organization={organization}
  452. selection={selection}
  453. >
  454. {children}
  455. </ReleaseWidgetQueries>
  456. );
  457. expect(mock).toHaveBeenCalledTimes(1);
  458. await waitFor(() =>
  459. expect(children).toHaveBeenLastCalledWith(
  460. expect.objectContaining({
  461. errorMessage: undefined,
  462. loading: false,
  463. tableResults: [
  464. {
  465. data: [
  466. {
  467. 'count_unique(user)': 1,
  468. id: '0',
  469. release: '1',
  470. 'session.status': 'crashed',
  471. 'sum(session)': 34,
  472. },
  473. {
  474. 'count_unique(user)': 1,
  475. id: '1',
  476. release: '1',
  477. 'session.status': 'abnormal',
  478. 'sum(session)': 1,
  479. },
  480. {
  481. 'count_unique(user)': 2,
  482. id: '2',
  483. release: '1',
  484. 'session.status': 'errored',
  485. 'sum(session)': 451,
  486. },
  487. {
  488. 'count_unique(user)': 3,
  489. id: '3',
  490. release: '1',
  491. 'session.status': 'healthy',
  492. 'sum(session)': 5058,
  493. },
  494. {
  495. 'count_unique(user)': 2,
  496. id: '4',
  497. release: '2',
  498. 'session.status': 'crashed',
  499. 'sum(session)': 35,
  500. },
  501. {
  502. 'count_unique(user)': 1,
  503. id: '5',
  504. release: '2',
  505. 'session.status': 'abnormal',
  506. 'sum(session)': 1,
  507. },
  508. {
  509. 'count_unique(user)': 1,
  510. id: '6',
  511. release: '2',
  512. 'session.status': 'errored',
  513. 'sum(session)': 452,
  514. },
  515. {
  516. 'count_unique(user)': 10,
  517. id: '7',
  518. release: '2',
  519. 'session.status': 'healthy',
  520. 'sum(session)': 5059,
  521. },
  522. ],
  523. meta: {
  524. 'count_unique(user)': 'integer',
  525. release: 'string',
  526. 'session.status': 'string',
  527. 'sum(session)': 'integer',
  528. },
  529. title: 'sessions',
  530. },
  531. ],
  532. timeseriesResults: undefined,
  533. })
  534. )
  535. );
  536. });
  537. it('can send big number requests', async function () {
  538. const mock = MockApiClient.addMockResponse({
  539. url: '/organizations/org-slug/metrics/data/',
  540. body: MetricsFieldFixture(`count_unique(sentry.sessions.user)`),
  541. });
  542. const children = jest.fn(() => <div />);
  543. render(
  544. <ReleaseWidgetQueries
  545. api={api}
  546. widget={{...singleQueryWidget, displayType: DisplayType.BIG_NUMBER}}
  547. organization={organization}
  548. selection={selection}
  549. >
  550. {children}
  551. </ReleaseWidgetQueries>
  552. );
  553. expect(mock).toHaveBeenCalledTimes(1);
  554. expect(mock).toHaveBeenCalledWith(
  555. expect.anything(),
  556. expect.objectContaining({
  557. query: expect.objectContaining({
  558. field: ['count_unique(sentry.sessions.user)'],
  559. orderBy: '-count_unique(sentry.sessions.user)',
  560. }),
  561. })
  562. );
  563. await waitFor(() =>
  564. expect(children).toHaveBeenLastCalledWith(
  565. expect.objectContaining({
  566. loading: false,
  567. tableResults: [
  568. {
  569. data: [{'count_unique(user)': 51292.95404741901, id: '0'}],
  570. meta: {'count_unique(user)': 'integer'},
  571. title: 'sessions',
  572. },
  573. ],
  574. })
  575. )
  576. );
  577. });
  578. it('can send multiple API requests', async function () {
  579. const metricsMock = MockApiClient.addMockResponse({
  580. url: '/organizations/org-slug/metrics/data/',
  581. body: SessionsFieldFixture(`session.all`),
  582. match: [
  583. MockApiClient.matchQuery({
  584. field: [`session.all`],
  585. }),
  586. ],
  587. });
  588. render(
  589. <ReleaseWidgetQueries
  590. api={api}
  591. widget={multipleQueryWidget}
  592. organization={organization}
  593. selection={selection}
  594. >
  595. {() => <div data-test-id="child" />}
  596. </ReleaseWidgetQueries>
  597. );
  598. // Child should be rendered and 2 requests should be sent.
  599. expect(await screen.findByTestId('child')).toBeInTheDocument();
  600. expect(metricsMock).toHaveBeenCalledTimes(2);
  601. expect(metricsMock).toHaveBeenNthCalledWith(
  602. 1,
  603. '/organizations/org-slug/metrics/data/',
  604. expect.objectContaining({
  605. query: {
  606. environment: ['prod'],
  607. field: ['session.all'],
  608. groupBy: [],
  609. interval: '30m',
  610. project: [1],
  611. statsPeriod: '14d',
  612. per_page: 1,
  613. includeSeries: 1,
  614. includeTotals: 0,
  615. },
  616. })
  617. );
  618. expect(metricsMock).toHaveBeenNthCalledWith(
  619. 2,
  620. '/organizations/org-slug/metrics/data/',
  621. expect.objectContaining({
  622. query: {
  623. environment: ['prod'],
  624. field: ['session.all'],
  625. groupBy: [],
  626. interval: '30m',
  627. project: [1],
  628. query: 'environment:prod',
  629. statsPeriod: '14d',
  630. per_page: 1,
  631. includeSeries: 1,
  632. includeTotals: 0,
  633. },
  634. })
  635. );
  636. });
  637. it('sets errorMessage when the first request fails', async function () {
  638. const failMock = MockApiClient.addMockResponse({
  639. url: '/organizations/org-slug/metrics/data/',
  640. statusCode: 400,
  641. body: {detail: badMessage},
  642. match: [
  643. MockApiClient.matchQuery({
  644. field: [`session.all`],
  645. }),
  646. ],
  647. });
  648. const children = jest.fn(() => <div data-test-id="child" />);
  649. render(
  650. <ReleaseWidgetQueries
  651. api={api}
  652. widget={multipleQueryWidget}
  653. organization={organization}
  654. selection={selection}
  655. >
  656. {children}
  657. </ReleaseWidgetQueries>
  658. );
  659. // Child should be rendered and 2 requests should be sent.
  660. expect(screen.getByTestId('child')).toBeInTheDocument();
  661. expect(failMock).toHaveBeenCalledTimes(2);
  662. await waitFor(() =>
  663. expect(children).toHaveBeenLastCalledWith(
  664. expect.objectContaining({errorMessage: badMessage})
  665. )
  666. );
  667. });
  668. it('adjusts interval based on date window', async function () {
  669. const mock = MockApiClient.addMockResponse({
  670. url: '/organizations/org-slug/metrics/data/',
  671. body: SessionsFieldFixture(`session.all`),
  672. });
  673. render(
  674. <ReleaseWidgetQueries
  675. api={api}
  676. widget={{...singleQueryWidget, interval: '1m'}}
  677. organization={organization}
  678. selection={{...selection, datetime: {...selection.datetime, period: '14d'}}}
  679. >
  680. {() => <div data-test-id="child" />}
  681. </ReleaseWidgetQueries>
  682. );
  683. expect(await screen.findByTestId('child')).toBeInTheDocument();
  684. expect(mock).toHaveBeenCalledTimes(1);
  685. expect(mock).toHaveBeenCalledWith(
  686. expect.anything(),
  687. expect.objectContaining({
  688. query: expect.objectContaining({
  689. interval: '30m',
  690. statsPeriod: '14d',
  691. environment: ['prod'],
  692. project: [1],
  693. }),
  694. })
  695. );
  696. });
  697. it('does not re-fetch when renaming legend alias / adding falsy fields', async () => {
  698. const mock = MockApiClient.addMockResponse({
  699. url: '/organizations/org-slug/metrics/data/',
  700. body: SessionsFieldFixture(`session.all`),
  701. });
  702. const children = jest.fn(() => <div />);
  703. const {rerender} = render(
  704. <ReleaseWidgetQueries
  705. api={api}
  706. widget={singleQueryWidget}
  707. organization={organization}
  708. selection={selection}
  709. >
  710. {children}
  711. </ReleaseWidgetQueries>
  712. );
  713. await waitFor(() => {
  714. expect(mock).toHaveBeenCalledTimes(1);
  715. });
  716. rerender(
  717. <ReleaseWidgetQueries
  718. api={api}
  719. widget={{
  720. ...singleQueryWidget,
  721. queries: [
  722. {
  723. ...singleQueryWidget.queries[0],
  724. name: 'New Legend Alias',
  725. fields: [...singleQueryWidget.queries[0].fields, ''],
  726. },
  727. ],
  728. }}
  729. organization={organization}
  730. selection={selection}
  731. >
  732. {children}
  733. </ReleaseWidgetQueries>
  734. );
  735. // no additional request has been sent, the total count of requests is still 1
  736. await waitFor(() => {
  737. expect(mock).toHaveBeenCalledTimes(1);
  738. });
  739. });
  740. it('does not re-fetch when dashboard filter remains the same', async () => {
  741. const mock = MockApiClient.addMockResponse({
  742. url: '/organizations/org-slug/metrics/data/',
  743. body: SessionsFieldFixture(`session.all`),
  744. });
  745. const children = jest.fn(() => <div />);
  746. const {rerender} = render(
  747. <ReleaseWidgetQueries
  748. api={api}
  749. widget={singleQueryWidget}
  750. organization={organization}
  751. selection={selection}
  752. dashboardFilters={{[DashboardFilterKeys.RELEASE]: ['abc@1.3.0']}}
  753. >
  754. {children}
  755. </ReleaseWidgetQueries>
  756. );
  757. await waitFor(() => {
  758. expect(mock).toHaveBeenCalledTimes(1);
  759. });
  760. rerender(
  761. <ReleaseWidgetQueries
  762. api={api}
  763. widget={singleQueryWidget}
  764. organization={organization}
  765. selection={selection}
  766. dashboardFilters={{[DashboardFilterKeys.RELEASE]: ['abc@1.3.0']}}
  767. >
  768. {children}
  769. </ReleaseWidgetQueries>
  770. );
  771. // no additional request has been sent, the total count of requests is still 1
  772. await waitFor(() => {
  773. expect(mock).toHaveBeenCalledTimes(1);
  774. });
  775. });
  776. });