51 lines
1.9 KiB
TypeScript
51 lines
1.9 KiB
TypeScript
import '@testing-library/jest-dom';
|
|
import { fireEvent, waitFor } from '@testing-library/preact';
|
|
import { h } from 'preact';
|
|
|
|
import { render } from 'tests/utils';
|
|
import * as commentsActions from 'store/comments/actions';
|
|
import type { StoreState } from 'store';
|
|
|
|
import { SortPicker } from './sort-picker';
|
|
|
|
const defaultState = { comments: {} as StoreState['comments'], hiddenUsers: {} };
|
|
const stateWithSort = { comments: { sort: '-active' } as StoreState['comments'] };
|
|
|
|
describe('<SortPicker />', () => {
|
|
it('should render sort picker with options', () => {
|
|
const { container, queryAllByText, queryByText } = render(<SortPicker />, defaultState);
|
|
|
|
expect(container.querySelectorAll('option')).toHaveLength(8);
|
|
expect(queryAllByText('Best')).toHaveLength(2);
|
|
expect(queryByText('Sort by')).toBeInTheDocument();
|
|
});
|
|
|
|
it('should has static class names', () => {
|
|
const { container } = render(<SortPicker />, defaultState);
|
|
|
|
expect(container.querySelector('.sort-picker')).toBeInTheDocument();
|
|
});
|
|
|
|
it('should render selected element', () => {
|
|
const { container, queryAllByText } = render(<SortPicker />, stateWithSort);
|
|
|
|
expect(queryAllByText('Recently updated')).toHaveLength(2);
|
|
expect(container.querySelector<HTMLOptionElement>('[value="-active"]')?.selected).toBeTruthy();
|
|
});
|
|
|
|
it('should change selected store', async () => {
|
|
const nextOption = '-controversy';
|
|
const updateSorting = jest.spyOn(commentsActions, 'updateSorting');
|
|
const { container } = render(<SortPicker />, defaultState);
|
|
const select = container.querySelector('select') as HTMLSelectElement;
|
|
|
|
expect(select).toBeInTheDocument();
|
|
|
|
fireEvent.change(select, { target: { value: nextOption } });
|
|
|
|
await waitFor(() => expect(updateSorting).toHaveBeenCalledWith(nextOption));
|
|
|
|
expect(container.querySelector<HTMLOptionElement>(`[value="${nextOption}"]`)?.selected).toBeTruthy();
|
|
});
|
|
});
|