9754d14182
* move reaction icons to base layout * fix reactions count specs?? * also fix article specs
68 lines
2.3 KiB
JavaScript
68 lines
2.3 KiB
JavaScript
import { h } from 'preact';
|
|
import { render, within } from '@testing-library/preact';
|
|
import '@testing-library/jest-dom';
|
|
import { i18nSupport } from '../../../__support__/i18n';
|
|
import { reactionImagesSupport } from '../../../__support__/reaction_images';
|
|
import { ReactionsCount } from '..';
|
|
import {
|
|
articleWithReactions,
|
|
articleWithoutReactions,
|
|
articleWithOneReaction,
|
|
} from '../../__tests__/utilities/articleUtilities.js';
|
|
|
|
describe('<ReactionsCount /> component', () => {
|
|
beforeAll(() => {
|
|
i18nSupport();
|
|
reactionImagesSupport();
|
|
});
|
|
|
|
it('should not display reactions data when there are no reactions', async () => {
|
|
const { queryByText } = render(
|
|
<ReactionsCount article={articleWithoutReactions} />,
|
|
);
|
|
|
|
expect(queryByText(/0 reactions/i)).not.toExist();
|
|
});
|
|
|
|
it('should display reaction count when there are exactly one reaction', async () => {
|
|
const { queryByText } = render(
|
|
<ReactionsCount article={articleWithOneReaction} />,
|
|
);
|
|
|
|
expect(queryByText(/1 reaction/i)).toExist();
|
|
});
|
|
|
|
it('should display reactions data when there are reactions', async () => {
|
|
const { queryByText } = render(
|
|
<ReactionsCount article={articleWithReactions} />,
|
|
);
|
|
|
|
expect(queryByText(/232 reactions/i)).toExist();
|
|
});
|
|
|
|
it('should display multiple reactions when there are reactions', async () => {
|
|
const { getByTestId } = render(
|
|
<ReactionsCount article={articleWithReactions} />,
|
|
);
|
|
|
|
const container = getByTestId('multiple-reactions-icons-container');
|
|
const { queryByAltText } = within(container);
|
|
|
|
// `articleWithReactions` has all reactions except exploding head
|
|
// also, we are not using `toHaveAttribute` directly because Jest inserts a
|
|
// base URL and we are only interested in the path
|
|
expect(queryByAltText('Like').getAttribute('src')).toContain(
|
|
'/assets/sparkle-heart.svg',
|
|
);
|
|
expect(queryByAltText('Unicorn').getAttribute('src')).toContain(
|
|
'/assets/multi-unicorn.svg',
|
|
);
|
|
expect(queryByAltText('Fire').getAttribute('src')).toContain(
|
|
'/assets/fire.svg',
|
|
);
|
|
expect(queryByAltText('Raised Hands').getAttribute('src')).toContain(
|
|
'/assets/raised-hands.svg',
|
|
);
|
|
expect(queryByAltText('Exploding Head')).not.toExist();
|
|
});
|
|
});
|