helpers.ts 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. import {
  2. ReplayClickFrameFixture,
  3. ReplayConsoleFrameFixture,
  4. ReplaySlowClickFrameFixture,
  5. } from 'sentry-fixture/replay/replayBreadcrumbFrameData';
  6. import {
  7. ReplayBreadcrumbFrameEventFixture,
  8. ReplaySpanFrameEventFixture,
  9. } from 'sentry-fixture/replay/replayFrameEvents';
  10. import {
  11. ReplayMemoryFrameFixture,
  12. ReplayNavigationFrameFixture,
  13. } from 'sentry-fixture/replay/replaySpanFrameData';
  14. import {SlowClickFrame} from 'sentry/utils/replays/types';
  15. export function ReplayConsoleEventFixture({
  16. timestamp,
  17. message,
  18. }: {
  19. timestamp: Date;
  20. message?: string;
  21. }) {
  22. return ReplayBreadcrumbFrameEventFixture({
  23. timestamp,
  24. data: {
  25. payload: ReplayConsoleFrameFixture({
  26. timestamp,
  27. message: message ?? 'Hello World',
  28. }),
  29. },
  30. });
  31. }
  32. export function ReplayClickEventFixture({timestamp}: {timestamp: Date}) {
  33. return ReplayBreadcrumbFrameEventFixture({
  34. timestamp,
  35. data: {
  36. payload: ReplayClickFrameFixture({
  37. timestamp,
  38. message: 'nav[aria-label="Primary Navigation"] > div > a#sidebar-item-projects',
  39. data: {
  40. nodeId: 42,
  41. },
  42. }),
  43. },
  44. });
  45. }
  46. export function ReplayDeadClickEventFixture({timestamp}: {timestamp: Date}) {
  47. return ReplayBreadcrumbFrameEventFixture({
  48. timestamp,
  49. data: {
  50. payload: ReplaySlowClickFrameFixture({
  51. timestamp,
  52. message: 'nav[aria-label="Primary Navigation"] > div > a#sidebar-item-projects',
  53. data: {
  54. node: {
  55. tagName: 'a',
  56. },
  57. nodeId: 42,
  58. url: '',
  59. timeAfterClickMs: 7000,
  60. endReason: 'timeout',
  61. },
  62. } as SlowClickFrame),
  63. },
  64. });
  65. }
  66. export function ReplayNavigateEventFixture({
  67. startTimestamp,
  68. endTimestamp,
  69. }: {
  70. endTimestamp: Date;
  71. startTimestamp: Date;
  72. }) {
  73. const duration = endTimestamp.getTime() - startTimestamp.getTime(); // in MS
  74. return ReplaySpanFrameEventFixture({
  75. timestamp: startTimestamp,
  76. data: {
  77. payload: ReplayNavigationFrameFixture({
  78. op: 'navigation.navigate',
  79. startTimestamp,
  80. endTimestamp,
  81. description: '',
  82. data: {
  83. size: 1149,
  84. decodedBodySize: 1712,
  85. encodedBodySize: 849,
  86. duration,
  87. domInteractive: duration - 200,
  88. domContentLoadedEventStart: duration - 50,
  89. domContentLoadedEventEnd: duration - 48,
  90. loadEventStart: duration, // real value would be approx the same
  91. loadEventEnd: duration, // real value would be approx the same
  92. domComplete: duration, // real value would be approx the same
  93. redirectCount: 0,
  94. },
  95. }),
  96. },
  97. });
  98. }
  99. export function ReplayMemoryEventFixture({
  100. startTimestamp,
  101. endTimestamp,
  102. }: {
  103. endTimestamp: Date;
  104. startTimestamp: Date;
  105. }) {
  106. return ReplaySpanFrameEventFixture({
  107. timestamp: startTimestamp,
  108. data: {
  109. payload: ReplayMemoryFrameFixture({
  110. op: 'memory',
  111. startTimestamp,
  112. endTimestamp,
  113. description: '',
  114. }),
  115. },
  116. });
  117. }