public/grafana
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Tempo: Virtualize tags select to improve performance (#90269)

Browse Source 
* Virtualize tags select to improve performance

* Fix tests

* Fix tests

* Fix tests
This commit is contained in:
Andre Pereira
2024-07-11 10:45:20 +01:00
committed by GitHub
parent 0a1b9f94d5
commit 4eb09789c1
3 changed files with 21 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/app/plugins/datasource/tempo/SearchTraceQLEditor/SearchField.test.tsx
+6 -2
View File
@@ -130,14 +130,18 @@ describe('SearchField', () => {
if (select) {
// Select tag22 as the tag
await user.click(select);
jest.advanceTimersByTime(1000);
await act(async () => {
jest.advanceTimersByTime(1000);
});
const tag22 = await screen.findByText('tag22');
await user.click(tag22);
expect(updateFilter).toHaveBeenCalledWith({ ...filter, tag: 'tag22', value: [] });
// Select tag1 as the tag
await user.click(select);
jest.advanceTimersByTime(1000);
await act(async () => {
jest.advanceTimersByTime(1000);
});
const tag1 = await screen.findByText('tag1');
await user.click(tag1);
expect(updateFilter).toHaveBeenCalledWith({ ...filter, tag: 'tag1', value: [] });
public/app/plugins/datasource/tempo/SearchTraceQLEditor/SearchField.tsx
+2 -1
View File
@@ -165,7 +165,8 @@ const SearchField = ({
placeholder="Select tag"
isClearable
aria-label={`select ${filter.id} tag`}
allowCustomValue={true}
allowCustomValue
virtualized
/>
)}
<Select
public/app/plugins/datasource/tempo/SearchTraceQLEditor/TagsInput.test.tsx
+13 -10
View File
@@ -1,4 +1,4 @@
import { render, screen, waitFor } from '@testing-library/react';
import { act, render, screen, waitFor } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { TraceqlFilter, TraceqlSearchScope } from '../dataquery.gen';
@@ -39,12 +39,12 @@ describe('TagsInput', () => {
const tag = screen.getByText('Select tag');
expect(tag).toBeInTheDocument();
await user.click(tag);
jest.advanceTimersByTime(1000);
await act(async () => {
jest.advanceTimersByTime(1000);
});
await waitFor(() => {
expect(screen.getByText('foo')).toBeInTheDocument();
expect(screen.getByText('bar')).toBeInTheDocument();
expect(screen.getByText('$templateVariable1')).toBeInTheDocument();
expect(screen.getByText('$templateVariable2')).toBeInTheDocument();
});
});
@@ -54,12 +54,13 @@ describe('TagsInput', () => {
const tag = screen.getByText('Select tag');
expect(tag).toBeInTheDocument();
await user.click(tag);
jest.advanceTimersByTime(1000);
await act(async () => {
jest.advanceTimersByTime(1000);
});
await waitFor(() => {
expect(screen.getByText('cluster')).toBeInTheDocument();
expect(screen.getByText('container')).toBeInTheDocument();
expect(screen.getByText('$templateVariable1')).toBeInTheDocument();
expect(screen.getByText('$templateVariable2')).toBeInTheDocument();
});
});
@@ -69,7 +70,9 @@ describe('TagsInput', () => {
const tag = screen.getByText('Select tag');
expect(tag).toBeInTheDocument();
await user.click(tag);
jest.advanceTimersByTime(1000);
await act(async () => {
jest.advanceTimersByTime(1000);
});
await waitFor(() => {
expect(screen.getByText('db')).toBeInTheDocument();
expect(screen.getByText('$templateVariable1')).toBeInTheDocument();
@@ -83,13 +86,13 @@ describe('TagsInput', () => {
const tag = screen.getByText('Select tag');
expect(tag).toBeInTheDocument();
await user.click(tag);
jest.advanceTimersByTime(1000);
await act(async () => {
jest.advanceTimersByTime(1000);
});
await waitFor(() => {
expect(screen.getByText('cluster')).toBeInTheDocument();
expect(screen.getByText('container')).toBeInTheDocument();
expect(screen.getByText('db')).toBeInTheDocument();
expect(screen.getByText('$templateVariable1')).toBeInTheDocument();
expect(screen.getByText('$templateVariable2')).toBeInTheDocument();
});
});
});