mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Convert packages/grafana-ui/src/components/Logs/LogMessageAnsi.test.tsx
to RTL (#48918)
* convert LogLabels tests toRTL * convert LogMessageAnsi tests to RTL * convert LogMessageAnsi to RTL fix * remove comment from LogMessageAnsi tests
This commit is contained in:
parent
1c679e814b
commit
ab91af202c
@ -26,9 +26,6 @@ exports[`no enzyme tests`] = {
|
|||||||
"packages/grafana-ui/src/components/Graph/GraphTooltip/MultiModeGraphTooltip.test.tsx:1865444105": [
|
"packages/grafana-ui/src/components/Graph/GraphTooltip/MultiModeGraphTooltip.test.tsx:1865444105": [
|
||||||
[0, 17, 13, "RegExp match", "2409514259"]
|
[0, 17, 13, "RegExp match", "2409514259"]
|
||||||
],
|
],
|
||||||
"packages/grafana-ui/src/components/Logs/LogMessageAnsi.test.tsx:1630730648": [
|
|
||||||
[0, 19, 13, "RegExp match", "2409514259"]
|
|
||||||
],
|
|
||||||
"packages/grafana-ui/src/components/Logs/LogRowContextProvider.test.tsx:2719724375": [
|
"packages/grafana-ui/src/components/Logs/LogRowContextProvider.test.tsx:2719724375": [
|
||||||
[0, 17, 13, "RegExp match", "2409514259"]
|
[0, 17, 13, "RegExp match", "2409514259"]
|
||||||
],
|
],
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { shallow } from 'enzyme';
|
import { render, screen, within } from '@testing-library/react';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import { createTheme } from '@grafana/data';
|
import { createTheme } from '@grafana/data';
|
||||||
@ -7,44 +7,39 @@ import { UnThemedLogMessageAnsi as LogMessageAnsi } from './LogMessageAnsi';
|
|||||||
|
|
||||||
describe('<LogMessageAnsi />', () => {
|
describe('<LogMessageAnsi />', () => {
|
||||||
it('renders string without ANSI codes', () => {
|
it('renders string without ANSI codes', () => {
|
||||||
const wrapper = shallow(<LogMessageAnsi value="Lorem ipsum" theme={createTheme()} />);
|
render(<LogMessageAnsi value="Lorem ipsum" theme={createTheme()} />);
|
||||||
|
|
||||||
expect(wrapper.find('span').exists()).toBe(false);
|
expect(screen.queryByTestId('ansiLogLine')).not.toBeInTheDocument();
|
||||||
expect(wrapper.text()).toBe('Lorem ipsum');
|
expect(screen.queryByText('Lorem ipsum')).toBeInTheDocument();
|
||||||
});
|
});
|
||||||
it('renders string with ANSI codes', () => {
|
it('renders string with ANSI codes', () => {
|
||||||
const value = 'Lorem \u001B[31mipsum\u001B[0m et dolor';
|
const value = 'Lorem \u001B[31mipsum\u001B[0m et dolor';
|
||||||
const wrapper = shallow(<LogMessageAnsi value={value} theme={createTheme()} />);
|
render(<LogMessageAnsi value={value} theme={createTheme()} />);
|
||||||
|
|
||||||
expect(wrapper.find('span')).toHaveLength(1);
|
expect(screen.queryByTestId('ansiLogLine')).toBeInTheDocument();
|
||||||
expect(wrapper.find('span').first().prop('style')).toMatchObject(
|
expect(screen.getAllByTestId('ansiLogLine')).toHaveLength(1);
|
||||||
expect.objectContaining({
|
expect(screen.getAllByTestId('ansiLogLine').at(0)).toHaveAttribute('style', expect.stringMatching('color'));
|
||||||
color: expect.any(String),
|
|
||||||
})
|
const { getByText } = within(screen.getAllByTestId('ansiLogLine').at(0)!);
|
||||||
);
|
expect(getByText('ipsum')).toBeInTheDocument();
|
||||||
expect(wrapper.find('span').first().text()).toBe('ipsum');
|
|
||||||
});
|
});
|
||||||
it('renders string with ANSI codes with correctly converted css classnames', () => {
|
it('renders string with ANSI codes with correctly converted css classnames', () => {
|
||||||
const value = 'Lorem \u001B[1;32mIpsum';
|
const value = 'Lorem \u001B[1;32mIpsum';
|
||||||
const wrapper = shallow(<LogMessageAnsi value={value} theme={createTheme()} />);
|
render(<LogMessageAnsi value={value} theme={createTheme()} />);
|
||||||
|
|
||||||
expect(wrapper.find('span')).toHaveLength(1);
|
expect(screen.queryByTestId('ansiLogLine')).toBeInTheDocument();
|
||||||
expect(wrapper.find('span').first().prop('style')).toMatchObject(
|
expect(screen.getAllByTestId('ansiLogLine')).toHaveLength(1);
|
||||||
expect.objectContaining({
|
|
||||||
fontWeight: expect.any(String),
|
expect(screen.getAllByTestId('ansiLogLine').at(0)).toHaveAttribute('style', expect.stringMatching('font-weight'));
|
||||||
})
|
|
||||||
);
|
|
||||||
});
|
});
|
||||||
it('renders string with ANSI dim code with appropriate themed color', () => {
|
it('renders string with ANSI dim code with appropriate themed color', () => {
|
||||||
const value = 'Lorem \u001B[1;2mIpsum';
|
const value = 'Lorem \u001B[1;2mIpsum';
|
||||||
const theme = createTheme();
|
const theme = createTheme();
|
||||||
const wrapper = shallow(<LogMessageAnsi value={value} theme={theme} />);
|
render(<LogMessageAnsi value={value} theme={theme} />);
|
||||||
|
|
||||||
expect(wrapper.find('span')).toHaveLength(1);
|
expect(screen.queryByTestId('ansiLogLine')).toBeInTheDocument();
|
||||||
expect(wrapper.find('span').first().prop('style')).toMatchObject(
|
expect(screen.getAllByTestId('ansiLogLine')).toHaveLength(1);
|
||||||
expect.objectContaining({
|
|
||||||
color: theme.colors.text.secondary,
|
expect(screen.getAllByTestId('ansiLogLine').at(0)).toHaveStyle({ color: theme.colors.text.secondary });
|
||||||
})
|
|
||||||
);
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
Loading…
Reference in New Issue
Block a user