releaseWidgetQueries.spec.tsx 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815
  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', 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. expect(mock).toHaveBeenCalledWith(
  204. '/organizations/org-slug/sessions/',
  205. expect.objectContaining({
  206. query: expect.objectContaining({
  207. environment: ['prod'],
  208. field: ['count_unique(user)'],
  209. groupBy: ['session.status'],
  210. interval: '30m',
  211. project: [1],
  212. statsPeriod: '14d',
  213. }),
  214. })
  215. );
  216. });
  217. it('appends dashboard filters to releases request', async function () {
  218. const mock = MockApiClient.addMockResponse({
  219. url: '/organizations/org-slug/metrics/data/',
  220. body: MetricsSessionUserCountByStatusByReleaseFixture(),
  221. });
  222. render(
  223. <ReleaseWidgetQueries
  224. api={api}
  225. widget={singleQueryWidget}
  226. organization={organization}
  227. selection={selection}
  228. dashboardFilters={{[DashboardFilterKeys.RELEASE]: ['abc@1.3.0']}}
  229. >
  230. {() => <div data-test-id="child" />}
  231. </ReleaseWidgetQueries>
  232. );
  233. await screen.findByTestId('child');
  234. expect(mock).toHaveBeenCalledWith(
  235. '/organizations/org-slug/metrics/data/',
  236. expect.objectContaining({
  237. query: expect.objectContaining({
  238. query: ' release:"abc@1.3.0" ',
  239. }),
  240. })
  241. );
  242. });
  243. it('strips injected sort columns', async function () {
  244. const mock = MockApiClient.addMockResponse({
  245. url: '/organizations/org-slug/metrics/data/',
  246. body: MetricsSessionUserCountByStatusByReleaseFixture(),
  247. });
  248. const children = jest.fn(() => <div />);
  249. const injectedOrderby = {
  250. title: 'Sessions',
  251. interval: '5m',
  252. displayType: DisplayType.LINE,
  253. queries: [
  254. {
  255. conditions: '',
  256. fields: [`sum(session)`],
  257. aggregates: [`sum(session)`],
  258. columns: [],
  259. name: 'sessions',
  260. orderby: '-count_unique(user)',
  261. },
  262. ],
  263. widgetType: WidgetType.RELEASE,
  264. };
  265. render(
  266. <ReleaseWidgetQueries
  267. api={api}
  268. widget={injectedOrderby}
  269. organization={organization}
  270. selection={selection}
  271. >
  272. {children}
  273. </ReleaseWidgetQueries>
  274. );
  275. expect(mock).toHaveBeenCalledTimes(1);
  276. await waitFor(() =>
  277. expect(children).toHaveBeenLastCalledWith(
  278. expect.objectContaining({
  279. errorMessage: undefined,
  280. loading: false,
  281. timeseriesResults: [
  282. {
  283. data: [
  284. {name: '2022-01-15T00:00:00Z', value: 0},
  285. {name: '2022-01-16T00:00:00Z', value: 0},
  286. {name: '2022-01-17T00:00:00Z', value: 0},
  287. {name: '2022-01-18T00:00:00Z', value: 0},
  288. {name: '2022-01-19T00:00:00Z', value: 0},
  289. {name: '2022-01-20T00:00:00Z', value: 0},
  290. {name: '2022-01-21T00:00:00Z', value: 0},
  291. {name: '2022-01-22T00:00:00Z', value: 0},
  292. {name: '2022-01-23T00:00:00Z', value: 0},
  293. {name: '2022-01-24T00:00:00Z', value: 23},
  294. {name: '2022-01-25T00:00:00Z', value: 11},
  295. {name: '2022-01-26T00:00:00Z', value: 0},
  296. {name: '2022-01-27T00:00:00Z', value: 0},
  297. {name: '2022-01-28T00:00:00Z', value: 0},
  298. ],
  299. seriesName: 'sessions > crashed, 1 : sum(session)',
  300. },
  301. {
  302. data: [
  303. {name: '2022-01-15T00:00:00Z', value: 1},
  304. {name: '2022-01-16T00:00:00Z', value: 0},
  305. {name: '2022-01-17T00:00:00Z', value: 0},
  306. {name: '2022-01-18T00:00:00Z', value: 0},
  307. {name: '2022-01-19T00:00:00Z', value: 0},
  308. {name: '2022-01-20T00:00:00Z', value: 0},
  309. {name: '2022-01-21T00:00:00Z', value: 0},
  310. {name: '2022-01-22T00:00:00Z', value: 0},
  311. {name: '2022-01-23T00:00:00Z', value: 0},
  312. {name: '2022-01-24T00:00:00Z', value: 0},
  313. {name: '2022-01-25T00:00:00Z', value: 0},
  314. {name: '2022-01-26T00:00:00Z', value: 0},
  315. {name: '2022-01-27T00:00:00Z', value: 0},
  316. {name: '2022-01-28T00:00:00Z', value: 0},
  317. ],
  318. seriesName: 'sessions > abnormal, 1 : sum(session)',
  319. },
  320. {
  321. data: [
  322. {name: '2022-01-15T00:00:00Z', value: 0},
  323. {name: '2022-01-16T00:00:00Z', value: 0},
  324. {name: '2022-01-17T00:00:00Z', value: 0},
  325. {name: '2022-01-18T00:00:00Z', value: 0},
  326. {name: '2022-01-19T00:00:00Z', value: 0},
  327. {name: '2022-01-20T00:00:00Z', value: 37},
  328. {name: '2022-01-21T00:00:00Z', value: 0},
  329. {name: '2022-01-22T00:00:00Z', value: 0},
  330. {name: '2022-01-23T00:00:00Z', value: 0},
  331. {name: '2022-01-24T00:00:00Z', value: 335},
  332. {name: '2022-01-25T00:00:00Z', value: 79},
  333. {name: '2022-01-26T00:00:00Z', value: 0},
  334. {name: '2022-01-27T00:00:00Z', value: 0},
  335. {name: '2022-01-28T00:00:00Z', value: 0},
  336. ],
  337. seriesName: 'sessions > errored, 1 : sum(session)',
  338. },
  339. {
  340. data: [
  341. {name: '2022-01-15T00:00:00Z', value: 0},
  342. {name: '2022-01-16T00:00:00Z', value: 0},
  343. {name: '2022-01-17T00:00:00Z', value: 0},
  344. {name: '2022-01-18T00:00:00Z', value: 0},
  345. {name: '2022-01-19T00:00:00Z', value: 0},
  346. {name: '2022-01-20T00:00:00Z', value: 2503},
  347. {name: '2022-01-21T00:00:00Z', value: 661},
  348. {name: '2022-01-22T00:00:00Z', value: 0},
  349. {name: '2022-01-23T00:00:00Z', value: 0},
  350. {name: '2022-01-24T00:00:00Z', value: 1464},
  351. {name: '2022-01-25T00:00:00Z', value: 430},
  352. {name: '2022-01-26T00:00:00Z', value: 0},
  353. {name: '2022-01-27T00:00:00Z', value: 0},
  354. {name: '2022-01-28T00:00:00Z', value: 0},
  355. ],
  356. seriesName: 'sessions > healthy, 1 : sum(session)',
  357. },
  358. {
  359. data: [
  360. {name: '2022-01-15T00:00:00Z', value: 1},
  361. {name: '2022-01-16T00:00:00Z', value: 0},
  362. {name: '2022-01-17T00:00:00Z', value: 0},
  363. {name: '2022-01-18T00:00:00Z', value: 0},
  364. {name: '2022-01-19T00:00:00Z', value: 0},
  365. {name: '2022-01-20T00:00:00Z', value: 0},
  366. {name: '2022-01-21T00:00:00Z', value: 0},
  367. {name: '2022-01-22T00:00:00Z', value: 0},
  368. {name: '2022-01-23T00:00:00Z', value: 0},
  369. {name: '2022-01-24T00:00:00Z', value: 23},
  370. {name: '2022-01-25T00:00:00Z', value: 11},
  371. {name: '2022-01-26T00:00:00Z', value: 0},
  372. {name: '2022-01-27T00:00:00Z', value: 0},
  373. {name: '2022-01-28T00:00:00Z', value: 0},
  374. ],
  375. seriesName: 'sessions > crashed, 2 : sum(session)',
  376. },
  377. {
  378. data: [
  379. {name: '2022-01-15T00:00:00Z', value: 1},
  380. {name: '2022-01-16T00:00:00Z', value: 0},
  381. {name: '2022-01-17T00:00:00Z', value: 0},
  382. {name: '2022-01-18T00:00:00Z', value: 0},
  383. {name: '2022-01-19T00:00:00Z', value: 0},
  384. {name: '2022-01-20T00:00:00Z', value: 0},
  385. {name: '2022-01-21T00:00:00Z', value: 0},
  386. {name: '2022-01-22T00:00:00Z', value: 0},
  387. {name: '2022-01-23T00:00:00Z', value: 0},
  388. {name: '2022-01-24T00:00:00Z', value: 0},
  389. {name: '2022-01-25T00:00:00Z', value: 0},
  390. {name: '2022-01-26T00:00:00Z', value: 0},
  391. {name: '2022-01-27T00:00:00Z', value: 0},
  392. {name: '2022-01-28T00:00:00Z', value: 0},
  393. ],
  394. seriesName: 'sessions > abnormal, 2 : sum(session)',
  395. },
  396. {
  397. data: [
  398. {name: '2022-01-15T00:00:00Z', value: 1},
  399. {name: '2022-01-16T00:00:00Z', value: 0},
  400. {name: '2022-01-17T00:00:00Z', value: 0},
  401. {name: '2022-01-18T00:00:00Z', value: 0},
  402. {name: '2022-01-19T00:00:00Z', value: 0},
  403. {name: '2022-01-20T00:00:00Z', value: 37},
  404. {name: '2022-01-21T00:00:00Z', value: 0},
  405. {name: '2022-01-22T00:00:00Z', value: 0},
  406. {name: '2022-01-23T00:00:00Z', value: 0},
  407. {name: '2022-01-24T00:00:00Z', value: 335},
  408. {name: '2022-01-25T00:00:00Z', value: 79},
  409. {name: '2022-01-26T00:00:00Z', value: 0},
  410. {name: '2022-01-27T00:00:00Z', value: 0},
  411. {name: '2022-01-28T00:00:00Z', value: 0},
  412. ],
  413. seriesName: 'sessions > errored, 2 : sum(session)',
  414. },
  415. {
  416. data: [
  417. {name: '2022-01-15T00:00:00Z', value: 1},
  418. {name: '2022-01-16T00:00:00Z', value: 0},
  419. {name: '2022-01-17T00:00:00Z', value: 0},
  420. {name: '2022-01-18T00:00:00Z', value: 0},
  421. {name: '2022-01-19T00:00:00Z', value: 0},
  422. {name: '2022-01-20T00:00:00Z', value: 2503},
  423. {name: '2022-01-21T00:00:00Z', value: 661},
  424. {name: '2022-01-22T00:00:00Z', value: 0},
  425. {name: '2022-01-23T00:00:00Z', value: 0},
  426. {name: '2022-01-24T00:00:00Z', value: 1464},
  427. {name: '2022-01-25T00:00:00Z', value: 430},
  428. {name: '2022-01-26T00:00:00Z', value: 0},
  429. {name: '2022-01-27T00:00:00Z', value: 0},
  430. {name: '2022-01-28T00:00:00Z', value: 0},
  431. ],
  432. seriesName: 'sessions > healthy, 2 : sum(session)',
  433. },
  434. ],
  435. })
  436. )
  437. );
  438. });
  439. it('can send table requests', async function () {
  440. const mock = MockApiClient.addMockResponse({
  441. url: '/organizations/org-slug/metrics/data/',
  442. body: MetricsSessionUserCountByStatusByReleaseFixture(),
  443. });
  444. const children = jest.fn(() => <div />);
  445. render(
  446. <ReleaseWidgetQueries
  447. api={api}
  448. widget={{...singleQueryWidget, displayType: DisplayType.TABLE}}
  449. organization={organization}
  450. selection={selection}
  451. >
  452. {children}
  453. </ReleaseWidgetQueries>
  454. );
  455. expect(mock).toHaveBeenCalledTimes(1);
  456. await waitFor(() =>
  457. expect(children).toHaveBeenLastCalledWith(
  458. expect.objectContaining({
  459. errorMessage: undefined,
  460. loading: false,
  461. tableResults: [
  462. {
  463. data: [
  464. {
  465. 'count_unique(user)': 1,
  466. id: '0',
  467. release: '1',
  468. 'session.status': 'crashed',
  469. 'sum(session)': 34,
  470. },
  471. {
  472. 'count_unique(user)': 1,
  473. id: '1',
  474. release: '1',
  475. 'session.status': 'abnormal',
  476. 'sum(session)': 1,
  477. },
  478. {
  479. 'count_unique(user)': 2,
  480. id: '2',
  481. release: '1',
  482. 'session.status': 'errored',
  483. 'sum(session)': 451,
  484. },
  485. {
  486. 'count_unique(user)': 3,
  487. id: '3',
  488. release: '1',
  489. 'session.status': 'healthy',
  490. 'sum(session)': 5058,
  491. },
  492. {
  493. 'count_unique(user)': 2,
  494. id: '4',
  495. release: '2',
  496. 'session.status': 'crashed',
  497. 'sum(session)': 35,
  498. },
  499. {
  500. 'count_unique(user)': 1,
  501. id: '5',
  502. release: '2',
  503. 'session.status': 'abnormal',
  504. 'sum(session)': 1,
  505. },
  506. {
  507. 'count_unique(user)': 1,
  508. id: '6',
  509. release: '2',
  510. 'session.status': 'errored',
  511. 'sum(session)': 452,
  512. },
  513. {
  514. 'count_unique(user)': 10,
  515. id: '7',
  516. release: '2',
  517. 'session.status': 'healthy',
  518. 'sum(session)': 5059,
  519. },
  520. ],
  521. meta: {
  522. 'count_unique(user)': 'integer',
  523. release: 'string',
  524. 'session.status': 'string',
  525. 'sum(session)': 'integer',
  526. },
  527. title: 'sessions',
  528. },
  529. ],
  530. timeseriesResults: undefined,
  531. })
  532. )
  533. );
  534. });
  535. it('can send big number requests', async function () {
  536. const mock = MockApiClient.addMockResponse({
  537. url: '/organizations/org-slug/metrics/data/',
  538. body: MetricsFieldFixture(`count_unique(sentry.sessions.user)`),
  539. });
  540. const children = jest.fn(() => <div />);
  541. render(
  542. <ReleaseWidgetQueries
  543. api={api}
  544. widget={{...singleQueryWidget, displayType: DisplayType.BIG_NUMBER}}
  545. organization={organization}
  546. selection={selection}
  547. >
  548. {children}
  549. </ReleaseWidgetQueries>
  550. );
  551. expect(mock).toHaveBeenCalledTimes(1);
  552. expect(mock).toHaveBeenCalledWith(
  553. expect.anything(),
  554. expect.objectContaining({
  555. query: expect.objectContaining({
  556. field: ['count_unique(sentry.sessions.user)'],
  557. orderBy: '-count_unique(sentry.sessions.user)',
  558. }),
  559. })
  560. );
  561. await waitFor(() =>
  562. expect(children).toHaveBeenLastCalledWith(
  563. expect.objectContaining({
  564. loading: false,
  565. tableResults: [
  566. {
  567. data: [{'count_unique(user)': 51292.95404741901, id: '0'}],
  568. meta: {'count_unique(user)': 'integer'},
  569. title: 'sessions',
  570. },
  571. ],
  572. })
  573. )
  574. );
  575. });
  576. it('can send multiple API requests', function () {
  577. const metricsMock = MockApiClient.addMockResponse({
  578. url: '/organizations/org-slug/metrics/data/',
  579. body: SessionsFieldFixture(`session.all`),
  580. match: [
  581. MockApiClient.matchQuery({
  582. field: [`session.all`],
  583. }),
  584. ],
  585. });
  586. render(
  587. <ReleaseWidgetQueries
  588. api={api}
  589. widget={multipleQueryWidget}
  590. organization={organization}
  591. selection={selection}
  592. >
  593. {() => <div data-test-id="child" />}
  594. </ReleaseWidgetQueries>
  595. );
  596. // Child should be rendered and 2 requests should be sent.
  597. expect(screen.getByTestId('child')).toBeInTheDocument();
  598. expect(metricsMock).toHaveBeenCalledTimes(2);
  599. expect(metricsMock).toHaveBeenNthCalledWith(
  600. 1,
  601. '/organizations/org-slug/metrics/data/',
  602. expect.objectContaining({
  603. query: {
  604. environment: ['prod'],
  605. field: ['session.all'],
  606. groupBy: [],
  607. interval: '30m',
  608. project: [1],
  609. statsPeriod: '14d',
  610. per_page: 1,
  611. includeSeries: 1,
  612. includeTotals: 0,
  613. },
  614. })
  615. );
  616. expect(metricsMock).toHaveBeenNthCalledWith(
  617. 2,
  618. '/organizations/org-slug/metrics/data/',
  619. expect.objectContaining({
  620. query: {
  621. environment: ['prod'],
  622. field: ['session.all'],
  623. groupBy: [],
  624. interval: '30m',
  625. project: [1],
  626. query: 'environment:prod',
  627. statsPeriod: '14d',
  628. per_page: 1,
  629. includeSeries: 1,
  630. includeTotals: 0,
  631. },
  632. })
  633. );
  634. });
  635. it('sets errorMessage when the first request fails', async function () {
  636. const failMock = MockApiClient.addMockResponse({
  637. url: '/organizations/org-slug/metrics/data/',
  638. statusCode: 400,
  639. body: {detail: badMessage},
  640. match: [
  641. MockApiClient.matchQuery({
  642. field: [`session.all`],
  643. }),
  644. ],
  645. });
  646. const children = jest.fn(() => <div data-test-id="child" />);
  647. render(
  648. <ReleaseWidgetQueries
  649. api={api}
  650. widget={multipleQueryWidget}
  651. organization={organization}
  652. selection={selection}
  653. >
  654. {children}
  655. </ReleaseWidgetQueries>
  656. );
  657. // Child should be rendered and 2 requests should be sent.
  658. expect(screen.getByTestId('child')).toBeInTheDocument();
  659. expect(failMock).toHaveBeenCalledTimes(2);
  660. await waitFor(() =>
  661. expect(children).toHaveBeenLastCalledWith(
  662. expect.objectContaining({errorMessage: badMessage})
  663. )
  664. );
  665. });
  666. it('adjusts interval based on date window', function () {
  667. const mock = MockApiClient.addMockResponse({
  668. url: '/organizations/org-slug/metrics/data/',
  669. body: SessionsFieldFixture(`session.all`),
  670. });
  671. render(
  672. <ReleaseWidgetQueries
  673. api={api}
  674. widget={{...singleQueryWidget, interval: '1m'}}
  675. organization={organization}
  676. selection={{...selection, datetime: {...selection.datetime, period: '14d'}}}
  677. >
  678. {() => <div data-test-id="child" />}
  679. </ReleaseWidgetQueries>
  680. );
  681. expect(screen.getByTestId('child')).toBeInTheDocument();
  682. expect(mock).toHaveBeenCalledTimes(1);
  683. expect(mock).toHaveBeenCalledWith(
  684. expect.anything(),
  685. expect.objectContaining({
  686. query: expect.objectContaining({
  687. interval: '30m',
  688. statsPeriod: '14d',
  689. environment: ['prod'],
  690. project: [1],
  691. }),
  692. })
  693. );
  694. });
  695. it('does not re-fetch when renaming legend alias / adding falsy fields', () => {
  696. const mock = MockApiClient.addMockResponse({
  697. url: '/organizations/org-slug/metrics/data/',
  698. body: SessionsFieldFixture(`session.all`),
  699. });
  700. const children = jest.fn(() => <div />);
  701. const {rerender} = render(
  702. <ReleaseWidgetQueries
  703. api={api}
  704. widget={singleQueryWidget}
  705. organization={organization}
  706. selection={selection}
  707. >
  708. {children}
  709. </ReleaseWidgetQueries>
  710. );
  711. expect(mock).toHaveBeenCalledTimes(1);
  712. rerender(
  713. <ReleaseWidgetQueries
  714. api={api}
  715. widget={{
  716. ...singleQueryWidget,
  717. queries: [
  718. {
  719. ...singleQueryWidget.queries[0],
  720. name: 'New Legend Alias',
  721. fields: [...singleQueryWidget.queries[0].fields, ''],
  722. },
  723. ],
  724. }}
  725. organization={organization}
  726. selection={selection}
  727. >
  728. {children}
  729. </ReleaseWidgetQueries>
  730. );
  731. // no additional request has been sent, the total count of requests is still 1
  732. expect(mock).toHaveBeenCalledTimes(1);
  733. });
  734. it('does not re-fetch when dashboard filter remains the same', () => {
  735. const mock = MockApiClient.addMockResponse({
  736. url: '/organizations/org-slug/metrics/data/',
  737. body: SessionsFieldFixture(`session.all`),
  738. });
  739. const children = jest.fn(() => <div />);
  740. const {rerender} = render(
  741. <ReleaseWidgetQueries
  742. api={api}
  743. widget={singleQueryWidget}
  744. organization={organization}
  745. selection={selection}
  746. dashboardFilters={{[DashboardFilterKeys.RELEASE]: ['abc@1.3.0']}}
  747. >
  748. {children}
  749. </ReleaseWidgetQueries>
  750. );
  751. expect(mock).toHaveBeenCalledTimes(1);
  752. rerender(
  753. <ReleaseWidgetQueries
  754. api={api}
  755. widget={singleQueryWidget}
  756. organization={organization}
  757. selection={selection}
  758. dashboardFilters={{[DashboardFilterKeys.RELEASE]: ['abc@1.3.0']}}
  759. >
  760. {children}
  761. </ReleaseWidgetQueries>
  762. );
  763. // no additional request has been sent, the total count of requests is still 1
  764. expect(mock).toHaveBeenCalledTimes(1);
  765. });
  766. });