diff --git a/.eslintrc.js b/.eslintrc.js
index 94f517ea6..aaeaedc8d 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -195,6 +195,7 @@ module.exports = {
devDependencies: [
'webpack/**',
'app/soapbox/test_setup.js',
+ 'app/soapbox/test_helpers.js',
'app/**/__tests__/**',
'app/**/__mocks__/**',
],
diff --git a/app/soapbox/actions/__tests__/about-test.js b/app/soapbox/actions/__tests__/about-test.js
index 28e7e726f..73c7b5d4f 100644
--- a/app/soapbox/actions/__tests__/about-test.js
+++ b/app/soapbox/actions/__tests__/about-test.js
@@ -6,7 +6,7 @@ import {
} from '../about';
import { Map as ImmutableMap } from 'immutable';
import { __stub as stubApi } from 'soapbox/api';
-import { mockStore } from 'soapbox/test_setup';
+import { mockStore } from 'soapbox/test_helpers';
describe('fetchAboutPage()', () => {
it('creates the expected actions on success', () => {
diff --git a/app/soapbox/actions/__tests__/auth-test.js b/app/soapbox/actions/__tests__/auth-test.js
index 367abfae1..a013c700f 100644
--- a/app/soapbox/actions/__tests__/auth-test.js
+++ b/app/soapbox/actions/__tests__/auth-test.js
@@ -4,7 +4,7 @@ import {
} from '../auth';
import { ALERT_SHOW } from '../alerts';
import { Map as ImmutableMap } from 'immutable';
-import { mockStore } from 'soapbox/test_setup';
+import { mockStore } from 'soapbox/test_helpers';
describe('logOut()', () => {
it('creates expected actions', () => {
diff --git a/app/soapbox/components/__tests__/__snapshots__/avatar-test.js.snap b/app/soapbox/components/__tests__/__snapshots__/avatar-test.js.snap
index 37a817e64..c3139fe69 100644
--- a/app/soapbox/components/__tests__/__snapshots__/avatar-test.js.snap
+++ b/app/soapbox/components/__tests__/__snapshots__/avatar-test.js.snap
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[` Autoplay renders a animated avatar 1`] = `
+exports[` Autoplay renders an animated avatar 1`] = `
renders correctly 1`] = `
+
+ Patron
+
+`;
diff --git a/app/soapbox/components/__tests__/__snapshots__/column-test.js.snap b/app/soapbox/components/__tests__/__snapshots__/column-test.js.snap
new file mode 100644
index 000000000..d6fef9f59
--- /dev/null
+++ b/app/soapbox/components/__tests__/__snapshots__/column-test.js.snap
@@ -0,0 +1,8 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` renders correctly with minimal props 1`] = `
+
+`;
diff --git a/app/soapbox/components/__tests__/__snapshots__/column_back_button-test.js.snap b/app/soapbox/components/__tests__/__snapshots__/column_back_button-test.js.snap
new file mode 100644
index 000000000..b7fb5b8b3
--- /dev/null
+++ b/app/soapbox/components/__tests__/__snapshots__/column_back_button-test.js.snap
@@ -0,0 +1,15 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` renders correctly 1`] = `
+
+`;
diff --git a/app/soapbox/components/__tests__/__snapshots__/column_back_button_slim-test.js.snap b/app/soapbox/components/__tests__/__snapshots__/column_back_button_slim-test.js.snap
new file mode 100644
index 000000000..87c89f910
--- /dev/null
+++ b/app/soapbox/components/__tests__/__snapshots__/column_back_button_slim-test.js.snap
@@ -0,0 +1,21 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` renders correctly 1`] = `
+
+`;
diff --git a/app/soapbox/components/__tests__/__snapshots__/column_header-test.js.snap b/app/soapbox/components/__tests__/__snapshots__/column_header-test.js.snap
new file mode 100644
index 000000000..0890bddb7
--- /dev/null
+++ b/app/soapbox/components/__tests__/__snapshots__/column_header-test.js.snap
@@ -0,0 +1,24 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` renders correctly with minimal props 1`] = `
+
+`;
diff --git a/app/soapbox/components/__tests__/__snapshots__/emoji_selector-test.js.snap b/app/soapbox/components/__tests__/__snapshots__/emoji_selector-test.js.snap
new file mode 100644
index 000000000..6b6307012
--- /dev/null
+++ b/app/soapbox/components/__tests__/__snapshots__/emoji_selector-test.js.snap
@@ -0,0 +1,56 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` renders correctly 1`] = `
+
+ ",
+ }
+ }
+ />
+ ",
+ }
+ }
+ />
+ ",
+ }
+ }
+ />
+ ",
+ }
+ }
+ />
+ ",
+ }
+ }
+ />
+ ",
+ }
+ }
+ />
+
+`;
diff --git a/app/soapbox/components/__tests__/__snapshots__/timeline_queue_button_header-test.js.snap b/app/soapbox/components/__tests__/__snapshots__/timeline_queue_button_header-test.js.snap
new file mode 100644
index 000000000..849b98606
--- /dev/null
+++ b/app/soapbox/components/__tests__/__snapshots__/timeline_queue_button_header-test.js.snap
@@ -0,0 +1,38 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` renders correctly 1`] = `
+
+`;
+
+exports[` renders correctly 2`] = `
+
+`;
+
+exports[` renders correctly 3`] = `
+
+`;
diff --git a/app/soapbox/components/__tests__/avatar-test.js b/app/soapbox/components/__tests__/avatar-test.js
index 5a72fc19a..f7f430c7a 100644
--- a/app/soapbox/components/__tests__/avatar-test.js
+++ b/app/soapbox/components/__tests__/avatar-test.js
@@ -12,10 +12,10 @@ describe('', () => {
avatar_static: '/static/alice.jpg',
});
- const size = 100;
+ const size = 100;
describe('Autoplay', () => {
- it('renders a animated avatar', () => {
+ it('renders an animated avatar', () => {
const component = renderer.create();
const tree = component.toJSON();
diff --git a/app/soapbox/components/__tests__/badge-test.js b/app/soapbox/components/__tests__/badge-test.js
new file mode 100644
index 000000000..5a42f0531
--- /dev/null
+++ b/app/soapbox/components/__tests__/badge-test.js
@@ -0,0 +1,11 @@
+import React from 'react';
+import renderer from 'react-test-renderer';
+import Badge from '../badge';
+
+describe('', () => {
+ it('renders correctly', () => {
+ const component = renderer.create();
+ const tree = component.toJSON();
+ expect(tree).toMatchSnapshot();
+ });
+});
diff --git a/app/soapbox/components/__tests__/column-test.js b/app/soapbox/components/__tests__/column-test.js
new file mode 100644
index 000000000..7c873cc10
--- /dev/null
+++ b/app/soapbox/components/__tests__/column-test.js
@@ -0,0 +1,11 @@
+import React from 'react';
+import renderer from 'react-test-renderer';
+import Column from '../column';
+
+describe('', () => {
+ it('renders correctly with minimal props', () => {
+ const component = renderer.create();
+ const tree = component.toJSON();
+ expect(tree).toMatchSnapshot();
+ });
+});
diff --git a/app/soapbox/components/__tests__/column_back_button-test.js b/app/soapbox/components/__tests__/column_back_button-test.js
new file mode 100644
index 000000000..9bd393135
--- /dev/null
+++ b/app/soapbox/components/__tests__/column_back_button-test.js
@@ -0,0 +1,11 @@
+import React from 'react';
+import ColumnBackButton from '../column_back_button';
+import { createComponentWithIntl } from 'soapbox/test_helpers';
+
+describe('', () => {
+ it('renders correctly', () => {
+ const component = createComponentWithIntl();
+ const tree = component.toJSON();
+ expect(tree).toMatchSnapshot();
+ });
+});
diff --git a/app/soapbox/components/__tests__/column_back_button_slim-test.js b/app/soapbox/components/__tests__/column_back_button_slim-test.js
new file mode 100644
index 000000000..36a3e4e62
--- /dev/null
+++ b/app/soapbox/components/__tests__/column_back_button_slim-test.js
@@ -0,0 +1,11 @@
+import React from 'react';
+import ColumnBackButtonSlim from '../column_back_button_slim';
+import { createComponentWithIntl } from 'soapbox/test_helpers';
+
+describe('', () => {
+ it('renders correctly', () => {
+ const component = createComponentWithIntl();
+ const tree = component.toJSON();
+ expect(tree).toMatchSnapshot();
+ });
+});
diff --git a/app/soapbox/components/__tests__/column_header-test.js b/app/soapbox/components/__tests__/column_header-test.js
new file mode 100644
index 000000000..f3f027b9c
--- /dev/null
+++ b/app/soapbox/components/__tests__/column_header-test.js
@@ -0,0 +1,11 @@
+import React from 'react';
+import ColumnHeader from '../column_header';
+import { createComponentWithIntl } from 'soapbox/test_helpers';
+
+describe('', () => {
+ it('renders correctly with minimal props', () => {
+ const component = createComponentWithIntl();
+ const tree = component.toJSON();
+ expect(tree).toMatchSnapshot();
+ });
+});
diff --git a/app/soapbox/components/__tests__/emoji_selector-test.js b/app/soapbox/components/__tests__/emoji_selector-test.js
new file mode 100644
index 000000000..c475aae4b
--- /dev/null
+++ b/app/soapbox/components/__tests__/emoji_selector-test.js
@@ -0,0 +1,11 @@
+import React from 'react';
+import renderer from 'react-test-renderer';
+import EmojiSelector from '../emoji_selector';
+
+describe('', () => {
+ it('renders correctly', () => {
+ const component = renderer.create();
+ const tree = component.toJSON();
+ expect(tree).toMatchSnapshot();
+ });
+});
diff --git a/app/soapbox/components/__tests__/timeline_queue_button_header-test.js b/app/soapbox/components/__tests__/timeline_queue_button_header-test.js
new file mode 100644
index 000000000..cb3b60900
--- /dev/null
+++ b/app/soapbox/components/__tests__/timeline_queue_button_header-test.js
@@ -0,0 +1,39 @@
+import React from 'react';
+import TimelineQueueButtonHeader from '../timeline_queue_button_header';
+import { createComponentWithIntl } from 'soapbox/test_helpers';
+import { defineMessages } from 'react-intl';
+
+const messages = defineMessages({
+ queue: { id: 'status_list.queue_label', defaultMessage: 'Click to see {count} new {count, plural, one {post} other {posts}}' },
+});
+
+describe('', () => {
+ it('renders correctly', () => {
+ expect(createComponentWithIntl(
+ {}} // eslint-disable-line react/jsx-no-bind
+ count={0}
+ message={messages.queue}
+ />
+ ).toJSON()).toMatchSnapshot();
+
+ expect(createComponentWithIntl(
+ {}} // eslint-disable-line react/jsx-no-bind
+ count={1}
+ message={messages.queue}
+ />
+ ).toJSON()).toMatchSnapshot();
+
+ expect(createComponentWithIntl(
+ {}} // eslint-disable-line react/jsx-no-bind
+ count={9999999}
+ message={messages.queue}
+ />
+ ).toJSON()).toMatchSnapshot();
+ });
+});
diff --git a/app/soapbox/test_helpers.js b/app/soapbox/test_helpers.js
new file mode 100644
index 000000000..41541ac43
--- /dev/null
+++ b/app/soapbox/test_helpers.js
@@ -0,0 +1,18 @@
+'use strict';
+
+import React from 'react';
+import thunk from 'redux-thunk';
+import renderer from 'react-test-renderer';
+import { IntlProvider } from 'react-intl';
+import configureMockStore from 'redux-mock-store';
+
+// Mock Redux
+// https://redux.js.org/recipes/writing-tests/
+const middlewares = [thunk];
+export const mockStore = configureMockStore(middlewares);
+
+// Testing i18n components
+// https://formatjs.io/docs/react-intl/testing/#helper-function-2
+export const createComponentWithIntl = (children, props = { locale: 'en' }) => {
+ return renderer.create({children});
+};
diff --git a/app/soapbox/test_setup.js b/app/soapbox/test_setup.js
index b185523f0..05f248813 100644
--- a/app/soapbox/test_setup.js
+++ b/app/soapbox/test_setup.js
@@ -2,15 +2,12 @@
import { configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
-import thunk from 'redux-thunk';
-import configureMockStore from 'redux-mock-store';
import { __clear as clearApiMocks } from 'soapbox/api';
+// Enzyme
const adapter = new Adapter();
configure({ adapter });
+// API mocking
jest.mock('soapbox/api');
afterEach(() => clearApiMocks());
-
-const middlewares = [thunk];
-export const mockStore = configureMockStore(middlewares);
diff --git a/jest.config.js b/jest.config.js
index 77fb55c23..f82434062 100644
--- a/jest.config.js
+++ b/jest.config.js
@@ -23,6 +23,7 @@ module.exports = {
'!app/soapbox/locales/locale-data/*.js',
'!app/soapbox/service_worker/entry.js',
'!app/soapbox/test_setup.js',
+ '!app/soapbox/test_helpers.js',
],
'coverageDirectory': '/coverage',
'moduleDirectories': [