test(snapshot): add snapshot testing for all components

src/components/BooksGrid/BooksGrid.test.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import { create } from 'react-test-renderer';
+import BooksGrid from './BooksGrid';
+
+const bookList = Array.from(Array(3).keys()).map((index) => ({
+  title: `Book ${index}`,
+  author: 'Sabertaz',
+  url: `https://example.com/${index}`,
+  description: `Book ${index} description`,
+}));
+
+describe('BooksGrid', () => {
+  test('should render correctly (snapshot)', () => {
+    const tree = create(<BooksGrid bookList={bookList} />).toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});

src/components/ErrorBoundary/ErrorBoundary.test.tsx

@@ -0,0 +1,14 @@
+import React from 'react';
+import { create } from 'react-test-renderer';
+import ErrorBoundary from './ErrorBoundary';
+
+describe('ErrorBoundary', () => {
+  test('should render correctly (snapshot)', () => {
+    const tree = create(
+      <ErrorBoundary>
+        <div>App</div>
+      </ErrorBoundary>
+    ).toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});

src/components/Footer/Footer.test.tsx

@@ -0,0 +1,22 @@
+import React from 'react';
+import { create } from 'react-test-renderer';
+import Footer from './Footer';
+
+const buildTime = new Date('2021-01-01').toString();
+const author = 'Sabertaz';
+const socialList = {
+  github: 'sabertazimi',
+  twitter: 'sabertazimi',
+  facebook: 'sabertazimi',
+  linkedin: 'sabertazimi',
+  weibo: 'sabertazimi',
+};
+
+describe('Footer', () => {
+  test('should render correctly (snapshot)', () => {
+    const tree = create(
+      <Footer buildTime={buildTime} author={author} socialList={socialList} />
+    ).toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});

src/components/PostsGrid/PostsGrid.test.tsx

@@ -0,0 +1,31 @@
+import React from 'react';
+import { create } from 'react-test-renderer';
+import PostsGrid from './PostsGrid';
+
+const basePosts = Array.from(Array(5).keys()).map((post) => ({
+  slug: `/${post}BasicNotes/`,
+  timeToRead: post,
+  title: `${post} Basic Notes`,
+}));
+const posts = basePosts.map((post, index) => ({
+  ...post,
+  subtitle: 'Be a Stupid Learner',
+  author: 'Sabertaz',
+  date: '2018-08-08T00:00:00.000Z',
+  tags: ['JavaScript', 'Frontend Development', 'Web Development'],
+  prevPost: {
+    slug: `/${index}BasicNotes/`,
+    title: `${index} Basic Notes`,
+  },
+  nextPost: {
+    slug: `/${index} AdvancedNotes/`,
+    title: `${index} Advanced Notes`,
+  },
+}));
+
+describe('PostsGrid', () => {
+  test('should render correctly (snapshot)', () => {
+    const tree = create(<PostsGrid posts={posts} />).toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});

src/components/PostsList/PostsList.test.tsx

@@ -0,0 +1,31 @@
+import React from 'react';
+import { create } from 'react-test-renderer';
+import PostsList from './PostsList';
+
+const basePosts = Array.from(Array(5).keys()).map((post) => ({
+  slug: `/${post}BasicNotes/`,
+  timeToRead: post,
+  title: `${post} Basic Notes`,
+}));
+const posts = basePosts.map((post, index) => ({
+  ...post,
+  subtitle: 'Be a Stupid Learner',
+  author: 'Sabertaz',
+  date: '2018-08-08T00:00:00.000Z',
+  tags: ['JavaScript', 'Frontend Development', 'Web Development'],
+  prevPost: {
+    slug: `/${index}BasicNotes/`,
+    title: `${index} Basic Notes`,
+  },
+  nextPost: {
+    slug: `/${index} AdvancedNotes/`,
+    title: `${index} Advanced Notes`,
+  },
+}));
+
+describe('PostsList', () => {
+  test('should render correctly (snapshot)', () => {
+    const tree = create(<PostsList posts={posts} />).toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});

src/components/SocialGroup/SocialGroup.test.tsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import { create } from 'react-test-renderer';
+import SocialGroup from './SocialGroup';
+
+const url = 'https://example.com/posts/post';
+
+describe('SocialGroup', () => {
+  test('should render correctly (snapshot)', () => {
+    const tree = create(<SocialGroup url={url} />).toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});

src/components/TagsCloud/TagsCloud.test.tsx

@@ -0,0 +1,26 @@
+import React from 'react';
+import { create } from 'react-test-renderer';
+import TagsCloud from './TagsCloud';
+
+const activeTag = 'JavaScript';
+const tags = {
+  Redux: 1,
+  React: 5,
+  JavaScript: 10,
+  'Frontend Development': 20,
+  'Web Development': 30,
+};
+
+describe('TagsCloud', () => {
+  test('should render correctly with active tag (snapshot)', () => {
+    const tree = create(
+      <TagsCloud activeTag={activeTag} tags={tags} />
+    ).toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  test('should render correctly without active tag (snapshot)', () => {
+    const tree = create(<TagsCloud activeTag="" tags={tags} />).toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});

src/components/TypingTitle/TypingTitle.test.tsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import { create } from 'react-test-renderer';
+import TypingTitle from './TypingTitle';
+
+const landingTitles = [`I'm a coder.`, `I'm a learner.`];
+
+describe('TypingTitle', () => {
+  test('should render correctly (snapshot)', () => {
+    const tree = create(<TypingTitle titles={landingTitles} />).toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});