mirror of https://github.com/grafana/grafana.git
79 lines
2.7 KiB
TypeScript
79 lines
2.7 KiB
TypeScript
import { render, screen } from '@testing-library/react';
|
|
import userEvent from '@testing-library/user-event';
|
|
|
|
import { createTheme, LogLevel } from '@grafana/data';
|
|
import { IconButton } from '@grafana/ui';
|
|
|
|
import { LOG_LINE_BODY_FIELD_NAME } from './LogDetailsBody';
|
|
import { LogRowMessageDisplayedFields, Props } from './LogRowMessageDisplayedFields';
|
|
import { createLogRow } from './__mocks__/logRow';
|
|
import { getLogRowStyles } from './getLogRowStyles';
|
|
|
|
const setup = (propOverrides: Partial<Props> = {}, detectedFields = ['place', 'planet']) => {
|
|
const theme = createTheme();
|
|
const styles = getLogRowStyles(theme);
|
|
const labels = {
|
|
place: 'Earth',
|
|
planet: 'Mars',
|
|
};
|
|
const props: Props = {
|
|
wrapLogMessage: false,
|
|
row: createLogRow({ entry: 'Logs are wonderful', logLevel: LogLevel.error, timeEpochMs: 1546297200000, labels }),
|
|
onOpenContext: () => {},
|
|
styles,
|
|
detectedFields,
|
|
mouseIsOver: true,
|
|
onBlur: jest.fn(),
|
|
...propOverrides,
|
|
};
|
|
|
|
render(
|
|
<table>
|
|
<tbody>
|
|
<tr>
|
|
<LogRowMessageDisplayedFields {...props} />
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
);
|
|
|
|
return props;
|
|
};
|
|
|
|
describe('LogRowMessageDisplayedFields', () => {
|
|
it('renders diplayed fields from a log row', () => {
|
|
setup();
|
|
expect(screen.queryByText(/Logs are wonderful/)).not.toBeInTheDocument();
|
|
expect(screen.getByText(/place=Earth/)).toBeInTheDocument();
|
|
expect(screen.getByText(/planet=Mars/)).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders diplayed fields and body from a log row', () => {
|
|
setup({}, ['place', 'planet', LOG_LINE_BODY_FIELD_NAME]);
|
|
expect(screen.queryByText(/Logs are wonderful/)).toBeInTheDocument();
|
|
expect(screen.getByText(/place=Earth/)).toBeInTheDocument();
|
|
expect(screen.getByText(/planet=Mars/)).toBeInTheDocument();
|
|
});
|
|
|
|
describe('With custom buttons', () => {
|
|
it('supports custom buttons before and after the default options', async () => {
|
|
const onBefore = jest.fn();
|
|
const logRowMenuIconsBefore = [
|
|
<IconButton name="eye-slash" onClick={onBefore} tooltip="Addon before" aria-label="Addon before" key={1} />,
|
|
];
|
|
const onAfter = jest.fn();
|
|
const logRowMenuIconsAfter = [
|
|
<IconButton name="rss" onClick={onAfter} tooltip="Addon after" aria-label="Addon after" key={1} />,
|
|
];
|
|
|
|
const { row } = setup({ logRowMenuIconsBefore, logRowMenuIconsAfter });
|
|
|
|
await userEvent.click(screen.getByLabelText('Addon before'));
|
|
await userEvent.click(screen.getByLabelText('Addon after'));
|
|
|
|
expect(onBefore).toHaveBeenCalledWith(expect.anything(), row);
|
|
expect(onAfter).toHaveBeenCalledWith(expect.anything(), row);
|
|
});
|
|
});
|
|
});
|