mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Chore: Convert QueryOperationAction test to RTL (#51139)
* Convert QueryOperationAction test to RTL * Convert QueryOperationAction to RTL * Convert QueryOperationAction test to RTL
This commit is contained in:
parent
665da5d063
commit
bab017799e
@ -92,9 +92,6 @@ exports[`no enzyme tests`] = {
|
||||
"packages/jaeger-ui-components/src/TraceTimelineViewer/index.test.js:276996587": [
|
||||
[14, 19, 13, "RegExp match", "2409514259"]
|
||||
],
|
||||
"public/app/core/components/QueryOperationRow/QueryOperationAction.test.tsx:3032694716": [
|
||||
[0, 19, 13, "RegExp match", "2409514259"]
|
||||
],
|
||||
"public/app/core/components/QueryOperationRow/QueryOperationRow.test.tsx:3743889097": [
|
||||
[0, 26, 13, "RegExp match", "2409514259"]
|
||||
],
|
||||
|
@ -1,24 +1,53 @@
|
||||
import { shallow } from 'enzyme';
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import userEvent from '@testing-library/user-event';
|
||||
import React from 'react';
|
||||
|
||||
import { QueryOperationAction } from './QueryOperationAction';
|
||||
import { selectors } from '@grafana/e2e-selectors';
|
||||
|
||||
describe('QueryOperationAction', () => {
|
||||
it('renders', () => {
|
||||
expect(() => shallow(<QueryOperationAction title="test" icon="panel-add" onClick={() => {}} />)).not.toThrow();
|
||||
import { QueryOperationAction, QueryOperationActionProps } from './QueryOperationAction';
|
||||
|
||||
const setup = (propOverrides?: Partial<QueryOperationActionProps>) => {
|
||||
const props: QueryOperationActionProps = {
|
||||
icon: 'panel-add',
|
||||
title: 'test',
|
||||
onClick: jest.fn(),
|
||||
disabled: false,
|
||||
...propOverrides,
|
||||
};
|
||||
|
||||
render(<QueryOperationAction {...props} />);
|
||||
};
|
||||
|
||||
describe('QueryOperationAction tests', () => {
|
||||
it('should render component', () => {
|
||||
setup();
|
||||
|
||||
expect(
|
||||
screen.getByRole('button', { name: selectors.components.QueryEditorRow.actionButton('test') })
|
||||
).toBeInTheDocument();
|
||||
});
|
||||
describe('when disabled', () => {
|
||||
it('does not call onClick handler', () => {
|
||||
const clickSpy = jest.fn();
|
||||
const wrapper = shallow(<QueryOperationAction icon="panel-add" onClick={clickSpy} title="Test action" />);
|
||||
const actionEl = wrapper.find({ 'aria-label': 'Test action query operation action' });
|
||||
|
||||
expect(actionEl).toHaveLength(1);
|
||||
expect(clickSpy).not.toBeCalled();
|
||||
it('should call on click handler', async () => {
|
||||
const clickSpy = jest.fn();
|
||||
setup({ disabled: false, onClick: clickSpy });
|
||||
|
||||
actionEl.first().simulate('click');
|
||||
expect(clickSpy).not.toHaveBeenCalled();
|
||||
const queryButton = screen.getByRole('button', { name: selectors.components.QueryEditorRow.actionButton('test') });
|
||||
|
||||
expect(clickSpy).toBeCalledTimes(1);
|
||||
});
|
||||
await userEvent.click(queryButton);
|
||||
|
||||
expect(clickSpy).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('should not call on click handler when disabled', async () => {
|
||||
const clickSpy = jest.fn();
|
||||
setup({ disabled: true, onClick: clickSpy });
|
||||
|
||||
expect(clickSpy).not.toHaveBeenCalled();
|
||||
const queryButton = screen.getByRole('button', { name: selectors.components.QueryEditorRow.actionButton('test') });
|
||||
|
||||
await userEvent.click(queryButton);
|
||||
|
||||
expect(clickSpy).not.toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
@ -5,7 +5,7 @@ import { GrafanaTheme2 } from '@grafana/data';
|
||||
import { selectors } from '@grafana/e2e-selectors';
|
||||
import { IconButton, IconName, useStyles2 } from '@grafana/ui';
|
||||
|
||||
interface QueryOperationActionProps {
|
||||
export interface QueryOperationActionProps {
|
||||
icon: IconName;
|
||||
title: string;
|
||||
onClick: (e: React.MouseEvent) => void;
|
||||
|
Loading…
Reference in New Issue
Block a user