eventIdField.spec.tsx 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. import {render, screen, userEvent} from 'sentry-test/reactTestingLibrary';
  2. import theme from 'sentry/utils/theme';
  3. import EventIdField from 'sentry/views/settings/components/dataScrubbing/modals/form/eventIdField';
  4. import {EventIdStatus} from 'sentry/views/settings/components/dataScrubbing/types';
  5. const eventIdValue = '887ab369df634e74aea708bcafe1a175';
  6. describe('EventIdField', function () {
  7. it('default render', async function () {
  8. const handleUpdateEventId = jest.fn();
  9. render(
  10. <EventIdField
  11. onUpdateEventId={handleUpdateEventId}
  12. eventId={{value: '', status: EventIdStatus.UNDEFINED}}
  13. />
  14. );
  15. expect(screen.getByText('Event ID (Optional)')).toBeInTheDocument();
  16. expect(screen.getByPlaceholderText('XXXXXXXXXXXXXX')).toBeInTheDocument();
  17. expect(screen.getByRole('textbox')).toHaveValue('');
  18. await userEvent.hover(screen.getByTestId('more-information'));
  19. expect(
  20. await screen.findByText(
  21. 'Providing an event ID will automatically provide you a list of suggested sources'
  22. )
  23. ).toBeInTheDocument();
  24. await userEvent.type(
  25. screen.getByRole('textbox'),
  26. '887ab369df634e74aea708bcafe1a175{enter}'
  27. );
  28. expect(handleUpdateEventId).toHaveBeenCalled();
  29. });
  30. it('LOADING status', function () {
  31. render(
  32. <EventIdField
  33. onUpdateEventId={jest.fn()}
  34. eventId={{value: eventIdValue, status: EventIdStatus.LOADING}}
  35. />
  36. );
  37. expect(screen.getByRole('textbox')).toHaveValue(eventIdValue);
  38. expect(screen.getByTestId('saving')).toBeInTheDocument();
  39. });
  40. it('LOADED status', function () {
  41. render(
  42. <EventIdField
  43. onUpdateEventId={jest.fn()}
  44. eventId={{value: eventIdValue, status: EventIdStatus.LOADED}}
  45. />
  46. );
  47. expect(screen.getByRole('textbox')).toHaveValue(eventIdValue);
  48. expect(screen.queryByLabelText('Clear event ID')).not.toBeInTheDocument();
  49. expect(screen.getByTestId('icon-check-mark')).toHaveAttribute('fill', theme.green400);
  50. });
  51. it('ERROR status', async function () {
  52. render(
  53. <EventIdField
  54. onUpdateEventId={jest.fn()}
  55. eventId={{value: eventIdValue, status: EventIdStatus.ERROR}}
  56. />
  57. );
  58. await userEvent.hover(screen.getByTestId('icon-close'));
  59. expect(await screen.findByText('Clear event ID')).toBeInTheDocument();
  60. expect(screen.getByRole('textbox')).toHaveValue(eventIdValue);
  61. expect(
  62. screen.getByText(
  63. 'An error occurred while fetching the suggestions based on this event ID'
  64. )
  65. ).toBeInTheDocument();
  66. });
  67. it('INVALID status', function () {
  68. render(
  69. <EventIdField
  70. onUpdateEventId={jest.fn()}
  71. eventId={{value: eventIdValue, status: EventIdStatus.INVALID}}
  72. />
  73. );
  74. expect(screen.getByRole('textbox')).toHaveValue(eventIdValue);
  75. expect(screen.getByText('This event ID is invalid')).toBeInTheDocument();
  76. });
  77. it('NOTFOUND status', function () {
  78. render(
  79. <EventIdField
  80. onUpdateEventId={jest.fn()}
  81. eventId={{value: eventIdValue, status: EventIdStatus.NOT_FOUND}}
  82. />
  83. );
  84. expect(screen.getByRole('textbox')).toHaveValue(eventIdValue);
  85. expect(
  86. screen.getByText('The chosen event ID was not found in projects you have access to')
  87. ).toBeInTheDocument();
  88. });
  89. });