IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Explore: Relabel secondary actions buttons (#73605)

Browse Source
This commit is contained in:
Giordano Ricci 2023-08-22 14:36:53 +01:00 committed by GitHub
parent 997d21f6e5
commit 35818fa9ab
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 20 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/grafana-e2e-selectors/src/selectors/components.ts
View File

@ -183,7 +183,7 @@ export const Components = {
QueryTab: {
content: 'Query editor tab content',
queryInspectorButton: 'Query inspector button',
queryHistoryButton: 'Rich history button',
queryHistoryButton: 'data-testid query-history-button',
addQuery: 'Query editor add query button',
},
QueryHistory: {

24
public/app/features/explore/SecondaryActions.test.tsx
View File

@ -15,9 +15,9 @@ describe('SecondaryActions', () => {
/>
);
expect(screen.getByRole('button', { name: /Add row button/i })).toBeInTheDocument();
expect(screen.getByRole('button', { name: /Rich history button/i })).toBeInTheDocument();
expect(screen.getByRole('button', { name: /Query inspector button/i })).toBeInTheDocument();
expect(screen.getByRole('button', { name: /Add query/i })).toBeInTheDocument();
expect(screen.getByRole('button', { name: /Query history/i })).toBeInTheDocument();
expect(screen.getByRole('button', { name: /Query inspector/i })).toBeInTheDocument();
});
it('should not render hidden elements', () => {
@ -31,9 +31,9 @@ describe('SecondaryActions', () => {
/>
);
expect(screen.queryByRole('button', { name: /Add row button/i })).not.toBeInTheDocument();
expect(screen.queryByRole('button', { name: /Rich history button/i })).not.toBeInTheDocument();
expect(screen.getByRole('button', { name: /Query inspector button/i })).toBeInTheDocument();
expect(screen.queryByRole('button', { name: /Add query/i })).not.toBeInTheDocument();
expect(screen.queryByRole('button', { name: /Query history/i })).not.toBeInTheDocument();
expect(screen.getByRole('button', { name: /Query inspector/i })).toBeInTheDocument();
});
it('should disable add row button if addQueryRowButtonDisabled=true', () => {
@ -46,9 +46,9 @@ describe('SecondaryActions', () => {
/>
);
expect(screen.getByRole('button', { name: /Add row button/i })).toBeDisabled();
expect(screen.getByRole('button', { name: /Rich history button/i })).toBeInTheDocument();
expect(screen.getByRole('button', { name: /Query inspector button/i })).toBeInTheDocument();
expect(screen.getByRole('button', { name: /Add query/i })).toBeDisabled();
expect(screen.getByRole('button', { name: /Query history/i })).toBeInTheDocument();
expect(screen.getByRole('button', { name: /Query inspector/i })).toBeInTheDocument();
});
it('should map click handlers correctly', async () => {
@ -66,13 +66,13 @@ describe('SecondaryActions', () => {
/>
);
await user.click(screen.getByRole('button', { name: /Add row button/i }));
await user.click(screen.getByRole('button', { name: /Add query/i }));
expect(onClickAddRow).toBeCalledTimes(1);
await user.click(screen.getByRole('button', { name: /Rich history button/i }));
await user.click(screen.getByRole('button', { name: /Query history/i }));
expect(onClickHistory).toBeCalledTimes(1);
await user.click(screen.getByRole('button', { name: /Query inspector button/i }));
await user.click(screen.getByRole('button', { name: /Query inspector/i }));
expect(onClickQueryInspector).toBeCalledTimes(1);
});
});

10
public/app/features/explore/SecondaryActions.tsx
View File

@ -2,6 +2,7 @@ import { css } from '@emotion/css';
import React from 'react';
import { GrafanaTheme2 } from '@grafana/data';
import { Components } from '@grafana/e2e-selectors';
import { HorizontalGroup, ToolbarButton, useTheme2 } from '@grafana/ui';
type Props = {
@ -33,7 +34,7 @@ export function SecondaryActions(props: Props) {
{!props.addQueryRowButtonHidden && (
<ToolbarButton
variant="canvas"
aria-label="Add row button"
aria-label="Add query"
onClick={props.onClickAddQueryRowButton}
disabled={props.addQueryRowButtonDisabled}
icon="plus"
@ -44,8 +45,9 @@ export function SecondaryActions(props: Props) {
{!props.richHistoryRowButtonHidden && (
<ToolbarButton
variant={props.richHistoryButtonActive ? 'active' : 'canvas'}
aria-label="Rich history button"
aria-label="Query history"
onClick={props.onClickRichHistoryButton}
data-testid={Components.QueryTab.queryHistoryButton}
icon="history"
>
Query history
@ -53,11 +55,11 @@ export function SecondaryActions(props: Props) {
)}
<ToolbarButton
variant={props.queryInspectorButtonActive ? 'active' : 'canvas'}
aria-label="Query inspector button"
aria-label="Query inspector"
onClick={props.onClickQueryInspectorButton}
icon="info-circle"
>
Inspector
Query inspector
</ToolbarButton>
</HorizontalGroup>
</div>

2
public/app/features/explore/spec/helper/interactions.ts
View File

@ -27,7 +27,7 @@ export const runQuery = async (exploreId = 'left') => {
export const openQueryHistory = async (exploreId = 'left') => {
const selector = withinExplore(exploreId);
const button = selector.getByRole('button', { name: 'Rich history button' });
const button = selector.getByRole('button', { name: 'Query history' });
await userEvent.click(button);
expect(await selector.findByPlaceholderText('Search queries')).toBeInTheDocument();
};