diff --git a/public/app/plugins/datasource/loki/components/LokiOptionFields.test.tsx b/public/app/plugins/datasource/loki/components/LokiOptionFields.test.tsx index 1219d19a5de..9eb32ab2098 100644 --- a/public/app/plugins/datasource/loki/components/LokiOptionFields.test.tsx +++ b/public/app/plugins/datasource/loki/components/LokiOptionFields.test.tsx @@ -1,4 +1,4 @@ -import { render, screen } from '@testing-library/react'; +import { render, screen, waitFor, fireEvent } from '@testing-library/react'; import React from 'react'; import { LokiOptionFieldsProps, LokiOptionFields } from './LokiOptionFields'; @@ -18,17 +18,74 @@ const setup = () => { onRunQuery, }; - return render(); + return props; }; -describe('LokiOptionFields', () => { - it('should render step field', () => { - setup(); - expect(screen.getByTestId('lineLimitField')).toBeInTheDocument(); - }); - - it('should render query type field', () => { - setup(); +describe('Query Type Field', () => { + it('should render a query type field', () => { + const props = setup(); + render(); expect(screen.getByTestId('queryTypeField')).toBeInTheDocument(); }); + + it('should have a default value of "Range"', () => { + const props = setup(); + render(); + expect(screen.getByLabelText('Range')).toBeChecked(); + expect(screen.getByLabelText('Instant')).not.toBeChecked(); + }); + + it('should call onChange when value is changed', async () => { + const props = setup(); + render(); + fireEvent.click(screen.getByLabelText('Instant')); // (`userEvent.click()` triggers an error, so switching here to `fireEvent`.) + await waitFor(() => expect(props.onChange).toHaveBeenCalledTimes(1)); + }); + + it('renders as expected when the query type is instant', () => { + const props = setup(); + render(); + expect(screen.getByLabelText('Instant')).toBeChecked(); + expect(screen.getByLabelText('Range')).not.toBeChecked(); + }); +}); + +describe('Line Limit Field', () => { + it('should render a line limit field', () => { + const props = setup(); + render(); + expect(screen.getByRole('spinbutton')).toBeInTheDocument(); + }); + + it('should have a default value of 1', () => { + const props = setup(); + render(); + expect(screen.getByRole('spinbutton')).toHaveValue(1); + }); + + it('displays the expected line limit value', () => { + const props = setup(); + render(); + expect(screen.getByRole('spinbutton')).toHaveValue(123); + }); +}); + +describe('Resolution Field', () => { + it('should render the resolution field', () => { + const props = setup(); + render(); + expect(screen.getByRole('combobox')).toBeInTheDocument(); + }); + + it('should have a default value of 1', async () => { + const props = setup(); + render(); + expect(await screen.findByText('1/1')).toBeInTheDocument(); + }); + + it('displays the expected resolution value', async () => { + const props = setup(); + render(); + expect(await screen.findByText('1/5')).toBeInTheDocument(); + }); });