Failing test: Jest Tests.x-pack/plugins/security_solution/public/detection_engine/rule_gaps/components/manual_rule_run - ManualRuleRunModal should render confirmation button disabled if selected end date is in future (#186189) (#186296)

## Summary

Related tickets https://github.com/elastic/kibana/issues/186189 and
https://github.com/elastic/kibana/issues/186187, and
https://github.com/elastic/kibana/issues/186188

Attempt to fix failing manual rule run tests added in this PR
https://github.com/elastic/kibana/pull/184500

---------

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
Ievgen Sorokopud 2024-06-21 22:10:12 +02:00 committed by GitHub
parent 9c1799cd0d
commit 6d94d89c57
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -6,73 +6,77 @@
*/
import React from 'react';
import { render, within } from '@testing-library/react';
import { fireEvent, render, screen } from '@testing-library/react';
import { ManualRuleRunModal } from '.';
const DATE_PICKER_PREVIOUS_BTN_CLASS = '.react-datepicker__navigation--previous';
const DATE_PICKER_NEXT_BTN_CLASS = '.react-datepicker__navigation--next';
describe('ManualRuleRunModal', () => {
const onCancelMock = jest.fn();
const onConfirmMock = jest.fn();
let startDatePicker: HTMLElement;
let endDatePicker: HTMLElement;
let confirmModalConfirmButton: HTMLElement;
let cancelModalConfirmButton: HTMLElement;
let timeRangeForm: HTMLElement;
afterEach(() => {
onCancelMock.mockReset();
onConfirmMock.mockReset();
});
it('should render modal', () => {
const wrapper = render(
<ManualRuleRunModal onCancel={onCancelMock} onConfirm={onConfirmMock} />
);
beforeEach(() => {
// This is an attempt to fix the "TypeError: scrollIntoView is not a function" error
// According to https://stackoverflow.com/a/53294906 the `scrollIntoView` is not implemented in jsdom,
// and proposed solution is coming from https://github.com/jsdom/jsdom/issues/1695
window.HTMLElement.prototype.scrollIntoView = () => {};
expect(wrapper.getByTestId('manual-rule-run-modal-form')).toBeInTheDocument();
expect(wrapper.getByTestId('confirmModalCancelButton')).toBeEnabled();
expect(wrapper.getByTestId('confirmModalConfirmButton')).toBeEnabled();
render(<ManualRuleRunModal onCancel={onCancelMock} onConfirm={onConfirmMock} />);
startDatePicker = screen.getByTestId('start-date-picker');
endDatePicker = screen.getByTestId('end-date-picker');
confirmModalConfirmButton = screen.getByTestId('confirmModalConfirmButton');
cancelModalConfirmButton = screen.getByTestId('confirmModalCancelButton');
timeRangeForm = screen.getByTestId('manual-rule-run-time-range-form');
});
it('should render modal', () => {
expect(timeRangeForm).toBeInTheDocument();
expect(cancelModalConfirmButton).toBeEnabled();
expect(confirmModalConfirmButton).toBeEnabled();
});
it('should render confirmation button disabled if invalid time range has been selected', () => {
const wrapper = render(
<ManualRuleRunModal onCancel={onCancelMock} onConfirm={onConfirmMock} />
);
expect(confirmModalConfirmButton).toBeEnabled();
expect(wrapper.getByTestId('confirmModalConfirmButton')).toBeEnabled();
fireEvent.click(endDatePicker.querySelector(DATE_PICKER_PREVIOUS_BTN_CLASS)!);
within(wrapper.getByTestId('end-date-picker')).getByText('Previous Month').click();
expect(wrapper.getByTestId('confirmModalConfirmButton')).toBeDisabled();
expect(wrapper.getByTestId('manual-rule-run-time-range-form')).toHaveTextContent(
'Selected time range is invalid'
);
expect(confirmModalConfirmButton).toBeDisabled();
expect(timeRangeForm).toHaveTextContent('Selected time range is invalid');
});
it('should render confirmation button disabled if selected start date is more than 90 days in the past', () => {
const wrapper = render(
<ManualRuleRunModal onCancel={onCancelMock} onConfirm={onConfirmMock} />
);
expect(confirmModalConfirmButton).toBeEnabled();
expect(wrapper.getByTestId('confirmModalConfirmButton')).toBeEnabled();
fireEvent.click(startDatePicker.querySelector(DATE_PICKER_PREVIOUS_BTN_CLASS)!);
fireEvent.click(startDatePicker.querySelector(DATE_PICKER_PREVIOUS_BTN_CLASS)!);
fireEvent.click(startDatePicker.querySelector(DATE_PICKER_PREVIOUS_BTN_CLASS)!);
fireEvent.click(startDatePicker.querySelector(DATE_PICKER_PREVIOUS_BTN_CLASS)!);
within(wrapper.getByTestId('start-date-picker')).getByText('Previous Month').click();
within(wrapper.getByTestId('start-date-picker')).getByText('Previous Month').click();
within(wrapper.getByTestId('start-date-picker')).getByText('Previous Month').click();
within(wrapper.getByTestId('start-date-picker')).getByText('Previous Month').click();
expect(wrapper.getByTestId('confirmModalConfirmButton')).toBeDisabled();
expect(wrapper.getByTestId('manual-rule-run-time-range-form')).toHaveTextContent(
expect(confirmModalConfirmButton).toBeDisabled();
expect(timeRangeForm).toHaveTextContent(
'Manual rule run cannot be scheduled earlier than 90 days ago'
);
});
it('should render confirmation button disabled if selected end date is in future', () => {
const wrapper = render(
<ManualRuleRunModal onCancel={onCancelMock} onConfirm={onConfirmMock} />
);
expect(confirmModalConfirmButton).toBeEnabled();
expect(wrapper.getByTestId('confirmModalConfirmButton')).toBeEnabled();
fireEvent.click(endDatePicker.querySelector(DATE_PICKER_NEXT_BTN_CLASS)!);
within(wrapper.getByTestId('end-date-picker')).getByText('Next month').click();
expect(wrapper.getByTestId('confirmModalConfirmButton')).toBeDisabled();
expect(wrapper.getByTestId('manual-rule-run-time-range-form')).toHaveTextContent(
'Manual rule run cannot be scheduled for the future'
);
expect(confirmModalConfirmButton).toBeDisabled();
expect(timeRangeForm).toHaveTextContent('Manual rule run cannot be scheduled for the future');
});
});