diff --git a/public/app/features/explore/QueryRows.test.tsx b/public/app/features/explore/QueryRows.test.tsx index 1c58e07cf61..7883286ac6e 100644 --- a/public/app/features/explore/QueryRows.test.tsx +++ b/public/app/features/explore/QueryRows.test.tsx @@ -85,9 +85,13 @@ describe('Explore QueryRows', () => { // waiting for the d&d component to fully render. await screen.findAllByText('someDs query editor'); - let duplicateButton = screen.getByLabelText(/Duplicate query/i); + // Open the actions menu + const actionsMenuButton = screen.getByLabelText(/Query actions menu/i); + fireEvent.click(actionsMenuButton); - fireEvent.click(duplicateButton); + // Click duplicate query in the menu + const duplicateMenuItem = await screen.findByText(/Duplicate query/i); + fireEvent.click(duplicateMenuItem); // We should have another row with refId B expect(await screen.findByLabelText('Query editor row title B')).toBeInTheDocument(); diff --git a/public/app/features/query/components/QueryEditorRow.tsx b/public/app/features/query/components/QueryEditorRow.tsx index c3b3dbdd617..a8f15f34198 100644 --- a/public/app/features/query/components/QueryEditorRow.tsx +++ b/public/app/features/query/components/QueryEditorRow.tsx @@ -490,6 +490,7 @@ export class QueryEditorRow extends PureComponent { renderScenario({ onAddQuery, onQueryCopied }); const queryEditorRows = await screen.findAllByTestId('query-editor-row'); - queryEditorRows.map(async (childQuery) => { - const duplicateQueryButton = queryByLabelText(childQuery, 'Duplicate query') as HTMLElement; - expect(duplicateQueryButton).toBeInTheDocument(); + for (const childQuery of queryEditorRows) { + // Open the actions menu + const actionsMenuButton = queryByLabelText(childQuery, 'Query actions menu') as HTMLElement; + expect(actionsMenuButton).toBeInTheDocument(); + fireEvent.click(actionsMenuButton); - fireEvent.click(duplicateQueryButton); - }); + // Click duplicate query in the menu + const duplicateMenuItem = await screen.findByText('Duplicate query'); + expect(duplicateMenuItem).toBeInTheDocument(); + fireEvent.click(duplicateMenuItem); + } expect(onAddQuery).toHaveBeenCalledTimes(queryEditorRows.length); expect(onQueryCopied).toHaveBeenCalledTimes(queryEditorRows.length); @@ -269,13 +275,15 @@ describe('QueryEditorRows', () => { renderScenario({ onQueriesChange, onQueryRemoved }); const queryEditorRows = await screen.findAllByTestId('query-editor-row'); - queryEditorRows.map(async (childQuery) => { - const deleteQueryButton = queryByLabelText(childQuery, 'Remove query') as HTMLElement; + for (const childQuery of queryEditorRows) { + const deleteQueryButton = within(childQuery).getByTestId( + selectors.components.QueryEditorRow.actionButton('Remove query') + ); expect(deleteQueryButton).toBeInTheDocument(); fireEvent.click(deleteQueryButton); - }); + } expect(onQueriesChange).toHaveBeenCalledTimes(queryEditorRows.length); expect(onQueryRemoved).toHaveBeenCalledTimes(queryEditorRows.length); diff --git a/public/locales/en-US/grafana.json b/public/locales/en-US/grafana.json index e8d4b15d05f..518cca5106f 100644 --- a/public/locales/en-US/grafana.json +++ b/public/locales/en-US/grafana.json @@ -12248,6 +12248,10 @@ } }, "query": { + "query-editor-row": { + "focused-message_one": "Query {{refId}} is focused, {{count}} queries are hidden from view.", + "focused-message_other": "Query {{refId}} is focused, {{count}} queries are hidden from view." + }, "query-editor-row-header": { "hidden": "Hidden", "query-name-div-title-edit-query-name": "Edit query name" @@ -12297,11 +12301,15 @@ }, "query-operation": { "header": { + "actions-menu": "Query actions menu", + "collapse": "Show all queries", "collapse-row": "Collapse query row", "datasource-help": "Show data source help", "drag-and-drop": "Drag and drop to reorder", "duplicate-query": "Duplicate query", "expand-row": "Expand query row", + "focus": "Focus query", + "hide-datasource-help": "Hide data source help", "hide-response": "Hide response", "remove-query": "Remove query", "show-response": "Show response"