Skip to content

Commit

Permalink
update
Browse files Browse the repository at this point in the history
  • Loading branch information
theosanderson committed May 20, 2024
1 parent 1184aeb commit 520b574
Showing 1 changed file with 38 additions and 59 deletions.
Original file line number Diff line number Diff line change
@@ -1,13 +1,12 @@
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { render, screen, act } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { beforeEach, describe, expect, test, vi } from 'vitest';

import { SearchForm } from './SearchForm';
import { SearchFullUI } from './SearchFullUI';
import { testConfig, testOrganism } from '../../../vitest.setup.ts';
import type { GroupedMetadataFilter, MetadataFilter } from '../../types/config.ts';
import type { ReferenceGenomesSequenceNames } from '../../types/referencesGenomes.ts';
import type { ClientConfig } from '../../types/runtimeConfig.ts';
import { lapisUrl } from '../../../tests/e2e.fixture.ts';

Check failure on line 9 in website/src/components/SearchPage/SearchFullUI.spec.tsx

GitHub Actions / Check format and types

`../../../tests/e2e.fixture.ts` import should occur before import of `../../../vitest.setup.ts`

Check failure on line 9 in website/src/components/SearchPage/SearchFullUI.spec.tsx

GitHub Actions / Check format and types

'lapisUrl' is defined but never used

global.ResizeObserver = class FakeResizeObserver {
observe() {}

Check failure on line 12 in website/src/components/SearchPage/SearchFullUI.spec.tsx

GitHub Actions / Check format and types

Missing accessibility modifier on method definition observe

Check failure on line 12 in website/src/components/SearchPage/SearchFullUI.spec.tsx

GitHub Actions / Check format and types

Unexpected empty method 'observe'
@@ -20,8 +19,6 @@ vi.mock('../../config', () => ({
getLapisUrl: vi.fn().mockReturnValue('lapis.dummy.url'),
}));

const queryClient = new QueryClient();

const defaultSearchFormFilters: MetadataFilter[] = [
{
name: 'field1',
@@ -51,40 +48,34 @@ const defaultReferenceGenomesSequenceNames: ReferenceGenomesSequenceNames = {
genes: ['gene1', 'gene2'],
};

const defaultVisibilities = new Map(defaultSearchFormFilters.map((filter) => [filter.name, true]));

function renderSearchForm({
function renderSearchFullUI({
searchFormFilters = [...defaultSearchFormFilters],
clientConfig = testConfig.public,
referenceGenomesSequenceNames = defaultReferenceGenomesSequenceNames,
fieldValues = {},
visibilities = defaultVisibilities,
setAFieldValue = vi.fn(),
} = {}) {
const consolidatedMetadataSchema: (MetadataFilter | GroupedMetadataFilter)[] = searchFormFilters.map((filter) => ({
...filter,
grouped: false,
}));

render(
<QueryClientProvider client={queryClient}>
<SearchForm
organism={testOrganism}
consolidatedMetadataSchema={consolidatedMetadataSchema}
clientConfig={clientConfig}
fieldValues={fieldValues}
setAFieldValue={setAFieldValue}
lapisUrl='lapis.dummy.url'
visibilities={visibilities}
setAVisibility={vi.fn()}
referenceGenomesSequenceNames={referenceGenomesSequenceNames}
lapisSearchParameters={{}}
/>
</QueryClientProvider>,
);
const props = {
accessToken: 'dummyAccessToken',
referenceGenomesSequenceNames,
myGroups: [],
organism: testOrganism,
clientConfig,
schema: {
metadata: consolidatedMetadataSchema,
tableColumns: ['field1', 'field2', 'field3'],
primaryKey: 'field1',
},
lapisUrl : "/"
};

render(<SearchFullUI {...props} />);
}

describe('SearchForm', () => {
describe('SearchFullUI', () => {
beforeEach(() => {
Object.defineProperty(window, 'location', {
value: {
@@ -94,19 +85,16 @@ describe('SearchForm', () => {
});

test('should render the form with all fields that are searchable', async () => {
renderSearchForm();
renderSearchFullUI();

expect(screen.getByLabelText('Field 1')).toBeDefined();
expect(screen.getByText('Field 2')).toBeDefined();
expect(screen.getByLabelText('Field 3')).toBeDefined();
});

test('should redirect according to filters', async () => {
let valuer = '';
const setAFieldValue = vi.fn((field, value) => {
valuer = value;
});
renderSearchForm({ setAFieldValue });

renderSearchFullUI( );

const filterValue = 'test';
const labelText = 'Field 1';
@@ -122,14 +110,14 @@ describe('SearchForm', () => {
await act(async () => {
await new Promise((resolve) => setTimeout(resolve, 1000));
});

expect(window.history.state.path).toContain(`field1=${filterValue}`);

throw new Error('stop here' + valuer);

expect(setAFieldValue).toHaveBeenCalledWith('field1', filterValue);
});

test('should not render the form with fields with flag notSearchable', async () => {
renderSearchForm({
renderSearchFullUI({
searchFormFilters: [
...defaultSearchFormFilters,
{
@@ -146,58 +134,50 @@ describe('SearchForm', () => {
expect(screen.queryByPlaceholderText('NotSearchable')).not.toBeInTheDocument();
});

test('should display dates of timestamp fields', async () => {
test('should display timestamp field', async () => {
const timestampFieldName = 'timestampField';
renderSearchForm({
renderSearchFullUI({
searchFormFilters: [
{
name: timestampFieldName,
type: 'timestamp' as const,
initiallyVisible: true,

},
],
fieldValues: { [timestampFieldName]: '1706147200' },

});

const timestampLabel = screen.getByText('Timestamp field');
const timestampField = timestampLabel.nextElementSibling?.getElementsByTagName('input')[0];
if (!timestampField) {
throw new Error('Timestamp field not found');
}
expect(timestampField).toHaveValue('2024-01-25');

await userEvent.type(timestampField, '2025');

expect(window.location.href).toContain(`${timestampFieldName}=1737769600`);

});

test('should display dates of date fields', async () => {
test('should display date field', async () => {
const dateFieldName = 'dateField';
renderSearchForm({
renderSearchFullUI({
searchFormFilters: [
{
name: dateFieldName,
type: 'date' as const,
initiallyVisible: true,
},
],
fieldValues: { [dateFieldName]: '2024-01-25' },
]

});

const dateLabel = screen.getByText('Date field');
const dateField = dateLabel.nextElementSibling?.getElementsByTagName('input')[0];
if (!dateField) {
throw new Error('Date field not found');
}
expect(dateField).toHaveValue('2024-01-25');

await userEvent.type(dateField, '2025');

expect(window.location.href).toContain(`${dateFieldName}=2025-01-25`);
});

test('toggle field visibility', async () => {
renderSearchForm({
renderSearchFullUI({
visibilities: new Map([
['field1', true],
['field2', true],
@@ -217,9 +197,8 @@ describe('SearchForm', () => {

const closeButton = await screen.findByRole('button', { name: 'Close' });
await userEvent.click(closeButton);
// wait for the label to disappear
await screen.findByLabelText('Field 1');
screen.logTestingPlaygroundURL();


expect(screen.queryByLabelText('Field 1')).not.toBeInTheDocument();
});
});

0 comments on commit 520b574

Please sign in to comment.