More component test TS fixes
This commit is contained in:
parent
0c7f1628b0
commit
2dd1631162
10 changed files with 35 additions and 21 deletions
|
@ -5,6 +5,8 @@ import { render, screen } from '../../jest/test-helpers';
|
||||||
import { normalizeAccount } from '../../normalizers';
|
import { normalizeAccount } from '../../normalizers';
|
||||||
import Account from '../account';
|
import Account from '../account';
|
||||||
|
|
||||||
|
import type { ReducerAccount } from 'soapbox/reducers/accounts';
|
||||||
|
|
||||||
describe('<Account />', () => {
|
describe('<Account />', () => {
|
||||||
it('renders account name and username', () => {
|
it('renders account name and username', () => {
|
||||||
const account = normalizeAccount({
|
const account = normalizeAccount({
|
||||||
|
@ -12,7 +14,7 @@ describe('<Account />', () => {
|
||||||
acct: 'justin-username',
|
acct: 'justin-username',
|
||||||
display_name: 'Justin L',
|
display_name: 'Justin L',
|
||||||
avatar: 'test.jpg',
|
avatar: 'test.jpg',
|
||||||
});
|
}) as ReducerAccount;
|
||||||
|
|
||||||
const store = {
|
const store = {
|
||||||
accounts: ImmutableMap({
|
accounts: ImmutableMap({
|
||||||
|
@ -20,7 +22,7 @@ describe('<Account />', () => {
|
||||||
}),
|
}),
|
||||||
};
|
};
|
||||||
|
|
||||||
render(<Account account={account} />, null, store);
|
render(<Account account={account} />, undefined, store);
|
||||||
expect(screen.getByTestId('account')).toHaveTextContent('Justin L');
|
expect(screen.getByTestId('account')).toHaveTextContent('Justin L');
|
||||||
expect(screen.getByTestId('account')).toHaveTextContent(/justin-username/i);
|
expect(screen.getByTestId('account')).toHaveTextContent(/justin-username/i);
|
||||||
});
|
});
|
||||||
|
@ -33,7 +35,7 @@ describe('<Account />', () => {
|
||||||
display_name: 'Justin L',
|
display_name: 'Justin L',
|
||||||
avatar: 'test.jpg',
|
avatar: 'test.jpg',
|
||||||
verified: true,
|
verified: true,
|
||||||
});
|
}) as ReducerAccount;
|
||||||
|
|
||||||
const store = {
|
const store = {
|
||||||
accounts: ImmutableMap({
|
accounts: ImmutableMap({
|
||||||
|
@ -41,7 +43,7 @@ describe('<Account />', () => {
|
||||||
}),
|
}),
|
||||||
};
|
};
|
||||||
|
|
||||||
render(<Account account={account} />, null, store);
|
render(<Account account={account} />, undefined, store);
|
||||||
expect(screen.getByTestId('verified-badge')).toBeInTheDocument();
|
expect(screen.getByTestId('verified-badge')).toBeInTheDocument();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -52,7 +54,7 @@ describe('<Account />', () => {
|
||||||
display_name: 'Justin L',
|
display_name: 'Justin L',
|
||||||
avatar: 'test.jpg',
|
avatar: 'test.jpg',
|
||||||
verified: false,
|
verified: false,
|
||||||
});
|
}) as ReducerAccount;
|
||||||
|
|
||||||
const store = {
|
const store = {
|
||||||
accounts: ImmutableMap({
|
accounts: ImmutableMap({
|
||||||
|
@ -60,7 +62,7 @@ describe('<Account />', () => {
|
||||||
}),
|
}),
|
||||||
};
|
};
|
||||||
|
|
||||||
render(<Account account={account} />, null, store);
|
render(<Account account={account} />, undefined, store);
|
||||||
expect(screen.queryAllByTestId('verified-badge')).toHaveLength(0);
|
expect(screen.queryAllByTestId('verified-badge')).toHaveLength(0);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -5,6 +5,8 @@ import { normalizeAccount } from 'soapbox/normalizers';
|
||||||
import { render, screen } from '../../jest/test-helpers';
|
import { render, screen } from '../../jest/test-helpers';
|
||||||
import Avatar from '../avatar';
|
import Avatar from '../avatar';
|
||||||
|
|
||||||
|
import type { ReducerAccount } from 'soapbox/reducers/accounts';
|
||||||
|
|
||||||
describe('<Avatar />', () => {
|
describe('<Avatar />', () => {
|
||||||
const account = normalizeAccount({
|
const account = normalizeAccount({
|
||||||
username: 'alice',
|
username: 'alice',
|
||||||
|
@ -12,7 +14,7 @@ describe('<Avatar />', () => {
|
||||||
display_name: 'Alice',
|
display_name: 'Alice',
|
||||||
avatar: '/animated/alice.gif',
|
avatar: '/animated/alice.gif',
|
||||||
avatar_static: '/static/alice.jpg',
|
avatar_static: '/static/alice.jpg',
|
||||||
});
|
}) as ReducerAccount;
|
||||||
|
|
||||||
const size = 100;
|
const size = 100;
|
||||||
|
|
||||||
|
|
|
@ -1,25 +1,28 @@
|
||||||
import { fromJS } from 'immutable';
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
|
import { normalizeAccount } from 'soapbox/normalizers';
|
||||||
|
|
||||||
import { render, screen } from '../../jest/test-helpers';
|
import { render, screen } from '../../jest/test-helpers';
|
||||||
import AvatarOverlay from '../avatar_overlay';
|
import AvatarOverlay from '../avatar_overlay';
|
||||||
|
|
||||||
|
import type { ReducerAccount } from 'soapbox/reducers/accounts';
|
||||||
|
|
||||||
describe('<AvatarOverlay', () => {
|
describe('<AvatarOverlay', () => {
|
||||||
const account = fromJS({
|
const account = normalizeAccount({
|
||||||
username: 'alice',
|
username: 'alice',
|
||||||
acct: 'alice',
|
acct: 'alice',
|
||||||
display_name: 'Alice',
|
display_name: 'Alice',
|
||||||
avatar: '/animated/alice.gif',
|
avatar: '/animated/alice.gif',
|
||||||
avatar_static: '/static/alice.jpg',
|
avatar_static: '/static/alice.jpg',
|
||||||
});
|
}) as ReducerAccount;
|
||||||
|
|
||||||
const friend = fromJS({
|
const friend = normalizeAccount({
|
||||||
username: 'eve',
|
username: 'eve',
|
||||||
acct: 'eve@blackhat.lair',
|
acct: 'eve@blackhat.lair',
|
||||||
display_name: 'Evelyn',
|
display_name: 'Evelyn',
|
||||||
avatar: '/animated/eve.gif',
|
avatar: '/animated/eve.gif',
|
||||||
avatar_static: '/static/eve.jpg',
|
avatar_static: '/static/eve.jpg',
|
||||||
});
|
}) as ReducerAccount;
|
||||||
|
|
||||||
it('renders a overlay avatar', () => {
|
it('renders a overlay avatar', () => {
|
||||||
render(<AvatarOverlay account={account} friend={friend} />);
|
render(<AvatarOverlay account={account} friend={friend} />);
|
||||||
|
|
|
@ -5,9 +5,11 @@ import { normalizeAccount } from 'soapbox/normalizers';
|
||||||
import { render, screen } from '../../jest/test-helpers';
|
import { render, screen } from '../../jest/test-helpers';
|
||||||
import DisplayName from '../display-name';
|
import DisplayName from '../display-name';
|
||||||
|
|
||||||
|
import type { ReducerAccount } from 'soapbox/reducers/accounts';
|
||||||
|
|
||||||
describe('<DisplayName />', () => {
|
describe('<DisplayName />', () => {
|
||||||
it('renders display name + account name', () => {
|
it('renders display name + account name', () => {
|
||||||
const account = normalizeAccount({ acct: 'bar@baz' });
|
const account = normalizeAccount({ acct: 'bar@baz' }) as ReducerAccount;
|
||||||
render(<DisplayName account={account} />);
|
render(<DisplayName account={account} />);
|
||||||
|
|
||||||
expect(screen.getByTestId('display-name')).toHaveTextContent('bar@baz');
|
expect(screen.getByTestId('display-name')).toHaveTextContent('bar@baz');
|
||||||
|
|
|
@ -6,6 +6,7 @@ import EmojiSelector from '../emoji_selector';
|
||||||
describe('<EmojiSelector />', () => {
|
describe('<EmojiSelector />', () => {
|
||||||
it('renders correctly', () => {
|
it('renders correctly', () => {
|
||||||
const children = <EmojiSelector />;
|
const children = <EmojiSelector />;
|
||||||
|
// @ts-ignore
|
||||||
children.__proto__.addEventListener = () => {};
|
children.__proto__.addEventListener = () => {};
|
||||||
|
|
||||||
render(children);
|
render(children);
|
||||||
|
|
|
@ -4,6 +4,8 @@ import { render, screen, rootState } from '../../jest/test-helpers';
|
||||||
import { normalizeStatus, normalizeAccount } from '../../normalizers';
|
import { normalizeStatus, normalizeAccount } from '../../normalizers';
|
||||||
import QuotedStatus from '../quoted-status';
|
import QuotedStatus from '../quoted-status';
|
||||||
|
|
||||||
|
import type { ReducerStatus } from 'soapbox/reducers/statuses';
|
||||||
|
|
||||||
describe('<QuotedStatus />', () => {
|
describe('<QuotedStatus />', () => {
|
||||||
it('renders content', () => {
|
it('renders content', () => {
|
||||||
const account = normalizeAccount({
|
const account = normalizeAccount({
|
||||||
|
@ -16,11 +18,11 @@ describe('<QuotedStatus />', () => {
|
||||||
account,
|
account,
|
||||||
content: 'hello world',
|
content: 'hello world',
|
||||||
contentHtml: 'hello world',
|
contentHtml: 'hello world',
|
||||||
});
|
}) as ReducerStatus;
|
||||||
|
|
||||||
const state = rootState.setIn(['accounts', '1', account]);
|
const state = rootState.setIn(['accounts', '1'], account);
|
||||||
|
|
||||||
render(<QuotedStatus status={status} />, null, state);
|
render(<QuotedStatus status={status} />, undefined, state);
|
||||||
screen.getByText(/hello world/i);
|
screen.getByText(/hello world/i);
|
||||||
expect(screen.getByTestId('quoted-status')).toHaveTextContent(/hello world/i);
|
expect(screen.getByTestId('quoted-status')).toHaveTextContent(/hello world/i);
|
||||||
});
|
});
|
||||||
|
|
|
@ -28,7 +28,7 @@ describe('<ScrollTopButton />', () => {
|
||||||
message={messages.queue}
|
message={messages.queue}
|
||||||
/>,
|
/>,
|
||||||
);
|
);
|
||||||
expect(screen.getByText('Click to see 1 new post', { hidden: true })).toBeInTheDocument();
|
expect(screen.getByText('Click to see 1 new post')).toBeInTheDocument();
|
||||||
|
|
||||||
render(
|
render(
|
||||||
<ScrollTopButton
|
<ScrollTopButton
|
||||||
|
@ -38,6 +38,6 @@ describe('<ScrollTopButton />', () => {
|
||||||
message={messages.queue}
|
message={messages.queue}
|
||||||
/>,
|
/>,
|
||||||
);
|
);
|
||||||
expect(screen.getByText('Click to see 9999999 new posts', { hidden: true })).toBeInTheDocument();
|
expect(screen.getByText('Click to see 9999999 new posts')).toBeInTheDocument();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -36,7 +36,7 @@ describe('<PollFooter />', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
const user = userEvent.setup();
|
const user = userEvent.setup();
|
||||||
const store = mockStore(rootReducer(undefined, {}));
|
const store = mockStore(rootReducer(undefined, {} as any));
|
||||||
render(
|
render(
|
||||||
<Provider store={store}>
|
<Provider store={store}>
|
||||||
<IntlProvider locale='en'>
|
<IntlProvider locale='en'>
|
||||||
|
|
|
@ -30,7 +30,7 @@ describe('<Datepicker />', () => {
|
||||||
);
|
);
|
||||||
|
|
||||||
let daySelect: HTMLElement;
|
let daySelect: HTMLElement;
|
||||||
daySelect = document.querySelector('[data-testid="datepicker-day"]');
|
daySelect = document.querySelector('[data-testid="datepicker-day"]') as HTMLElement;
|
||||||
expect(queryAllByRole(daySelect, 'option')).toHaveLength(29);
|
expect(queryAllByRole(daySelect, 'option')).toHaveLength(29);
|
||||||
|
|
||||||
await userEvent.selectOptions(
|
await userEvent.selectOptions(
|
||||||
|
|
|
@ -12,11 +12,13 @@ import '@testing-library/jest-dom';
|
||||||
import NotificationsContainer from '../features/ui/containers/notifications_container';
|
import NotificationsContainer from '../features/ui/containers/notifications_container';
|
||||||
import { default as rootReducer } from '../reducers';
|
import { default as rootReducer } from '../reducers';
|
||||||
|
|
||||||
|
import type { StateRecord } from 'soapbox/reducers';
|
||||||
|
|
||||||
// Mock Redux
|
// Mock Redux
|
||||||
// https://redux.js.org/recipes/writing-tests/
|
// https://redux.js.org/recipes/writing-tests/
|
||||||
const middlewares = [thunk];
|
const middlewares = [thunk];
|
||||||
const mockStore = configureMockStore(middlewares);
|
const mockStore = configureMockStore(middlewares);
|
||||||
let rootState = rootReducer(undefined, {} as Action);
|
let rootState = rootReducer(undefined, {} as Action) as unknown as ReturnType<typeof StateRecord>;
|
||||||
|
|
||||||
/** Apply actions to the state, one at a time. */
|
/** Apply actions to the state, one at a time. */
|
||||||
const applyActions = (state: any, actions: any, reducer: any) => {
|
const applyActions = (state: any, actions: any, reducer: any) => {
|
||||||
|
|
Loading…
Reference in a new issue