grafana/public/app/features/explore/QueryRowActions.test.tsx
Lukas Siatka 74924c8284 Explore: moves add query row button below query rows (#20522)
* Explore: updates Query Row component, moves latency to query row actions

* Explore: updates query row actions - adds latency and removes add row button

* Explore: updates explore toolbar props, adds index of the last query row

* Explore: updates toolbar, adds add new row button

* Explore: updates add new query row toolbar button title to add query

* Explore: updates query row actions - adds disabled property on latency button

* Explore: updates query row actions snapshot

* Explore: updates styles

* Explore: updates query row, removes latency

* Explore: updates query row actions, removed latency

* Explore: updates query row actions test and snapshot

* Explore: updates toolbar, moves add new query row button below query rows

* Explore: updates add query row button color and adds transparent background to latency div

* Explore: updates styles for add query row button responsiveness

* Explore: updates query row with latency button, fixes alignment of overall latency

* Explore: updates query row actions snapshot

* Explore: removes overall latency

* Explore: updates query row latency - removes mouseover-triggered style changes

* Explore: updates query row actions snapshot

* Explore: moves styles from scss to emotion

* Add row button: Removed responsiveness, reused query row styles

Co-authored-by: David <david.kaltschmidt@gmail.com>
2019-12-23 12:29:00 +01:00

40 lines
1.2 KiB
TypeScript

import React from 'react';
import { QueryRowActions, Props } from './QueryRowActions';
import { shallow } from 'enzyme';
const setup = (propOverrides?: object) => {
const props: Props = {
isDisabled: false,
isNotStarted: true,
canToggleEditorModes: true,
onClickToggleEditorMode: () => {},
onClickToggleDisabled: () => {},
onClickRemoveButton: () => {},
latency: 0,
};
Object.assign(props, propOverrides);
const wrapper = shallow(<QueryRowActions {...props} />);
return wrapper;
};
describe('QueryRowActions', () => {
it('should render component', () => {
const wrapper = setup();
expect(wrapper).toMatchSnapshot();
});
it('should render component without editor mode', () => {
const wrapper = setup({ canToggleEditorModes: false });
expect(wrapper.find({ 'aria-label': 'Edit mode button' })).toHaveLength(0);
});
it('should change icon to fa-eye-slash when query row result is hidden', () => {
const wrapper = setup({ isDisabled: true });
expect(wrapper.find('i.fa-eye-slash')).toHaveLength(1);
});
it('should change icon to fa-eye when query row result is not hidden', () => {
const wrapper = setup({ isDisabled: false });
expect(wrapper.find('i.fa-eye')).toHaveLength(1);
});
});