functionsTable.spec.tsx 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177
  1. import {ReactElement, useEffect, useMemo} from 'react';
  2. import {initializeOrg} from 'sentry-test/initializeOrg';
  3. import {render, screen} from 'sentry-test/reactTestingLibrary';
  4. import {FunctionsTable} from 'sentry/components/profiling/functionsTable';
  5. import ProjectsStore from 'sentry/stores/projectsStore';
  6. import {OrganizationContext} from 'sentry/views/organizationContext';
  7. import {RouteContext} from 'sentry/views/routeContext';
  8. const organization = TestStubs.Organization();
  9. const project = TestStubs.Project();
  10. function TestContext({children}: {children: ReactElement}) {
  11. const {router} = useMemo(() => initializeOrg({organization, project} as any), []);
  12. useEffect(() => {
  13. ProjectsStore.loadInitialData([project]);
  14. return () => ProjectsStore.reset();
  15. }, []);
  16. return (
  17. <RouteContext.Provider
  18. value={{
  19. router,
  20. location: router.location,
  21. params: {},
  22. routes: [],
  23. }}
  24. >
  25. <OrganizationContext.Provider value={organization}>
  26. {children}
  27. </OrganizationContext.Provider>
  28. </RouteContext.Provider>
  29. );
  30. }
  31. describe('FunctionsTable', function () {
  32. it('renders loading', function () {
  33. render(
  34. <TestContext>
  35. <FunctionsTable
  36. isLoading
  37. error={null}
  38. functions={[]}
  39. project={project}
  40. sort="p99"
  41. />
  42. </TestContext>
  43. );
  44. expect(screen.getByTestId('loading-indicator')).toBeInTheDocument();
  45. });
  46. it('renders empty data', function () {
  47. render(
  48. <TestContext>
  49. <FunctionsTable
  50. isLoading={false}
  51. error={null}
  52. functions={[]}
  53. project={project}
  54. sort="-p99"
  55. />
  56. </TestContext>
  57. );
  58. expect(screen.getByText('No results found for your query')).toBeInTheDocument();
  59. });
  60. it('renders one function', function () {
  61. const func = {
  62. count: 10,
  63. examples: ['aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa', 'bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb'],
  64. fingerprint: 1234,
  65. name: 'foo',
  66. p75: 10000000,
  67. p95: 12000000,
  68. p99: 12500000,
  69. package: 'bar',
  70. path: 'baz',
  71. worst: 'cccccccccccccccccccccccccccccccc',
  72. };
  73. render(
  74. <TestContext>
  75. <FunctionsTable
  76. isLoading={false}
  77. error={null}
  78. functions={[func]}
  79. project={project}
  80. sort="-p99"
  81. />
  82. </TestContext>
  83. );
  84. expect(screen.getByText('Name')).toBeInTheDocument();
  85. expect(screen.getByText('foo')).toBeInTheDocument();
  86. expect(screen.getByText('Package')).toBeInTheDocument();
  87. expect(screen.getByText('bar')).toBeInTheDocument();
  88. expect(screen.getByText('Count')).toBeInTheDocument();
  89. expect(screen.getByText('10')).toBeInTheDocument();
  90. expect(screen.getByText('P75 Duration')).toBeInTheDocument();
  91. expect(screen.getByText('10.00ms')).toBeInTheDocument();
  92. expect(screen.getByText('P99 Duration')).toBeInTheDocument();
  93. expect(screen.getByText('12.50ms')).toBeInTheDocument();
  94. });
  95. it('renders empty name', function () {
  96. const func = {
  97. count: 10,
  98. examples: ['aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa', 'bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb'],
  99. fingerprint: 1234,
  100. name: '',
  101. p75: 10000000,
  102. p95: 12000000,
  103. p99: 12500000,
  104. package: 'bar',
  105. path: 'baz',
  106. worst: 'cccccccccccccccccccccccccccccccc',
  107. };
  108. render(
  109. <TestContext>
  110. <FunctionsTable
  111. isLoading={false}
  112. error={null}
  113. functions={[func]}
  114. project={project}
  115. sort="-p99"
  116. />
  117. </TestContext>
  118. );
  119. expect(screen.getByText('Name')).toBeInTheDocument();
  120. expect(screen.getByText('Unknown')).toBeInTheDocument();
  121. expect(screen.getByText('Package')).toBeInTheDocument();
  122. expect(screen.getByText('bar')).toBeInTheDocument();
  123. });
  124. it('renders empty package', function () {
  125. const func = {
  126. count: 10,
  127. examples: ['aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa', 'bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb'],
  128. fingerprint: 1234,
  129. name: 'foo',
  130. p75: 10000000,
  131. p95: 12000000,
  132. p99: 12500000,
  133. package: '',
  134. path: 'baz',
  135. worst: 'cccccccccccccccccccccccccccccccc',
  136. };
  137. render(
  138. <TestContext>
  139. <FunctionsTable
  140. isLoading={false}
  141. error={null}
  142. functions={[func]}
  143. project={project}
  144. sort="-p99"
  145. />
  146. </TestContext>
  147. );
  148. expect(screen.getByText('Name')).toBeInTheDocument();
  149. expect(screen.getByText('foo')).toBeInTheDocument();
  150. expect(screen.getByText('Package')).toBeInTheDocument();
  151. expect(screen.getByText('Unknown')).toBeInTheDocument();
  152. });
  153. });