Creates renderWithRedux util

Author: velopert

src/components/base/Header.tsx

@@ -74,6 +74,7 @@ const Header: React.SFC<HeaderProps> = ({
       <HeaderBlock
         floating={floating}
         style={{ marginTop: floating ? floatingMargin : 0 }}
+        data-testid="Header"
       >
         <div className="wrapper">
           <div className="brand">

src/components/velog/VelogPageTemplate.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import styled from 'styled-components';
+import PageTemplate from '../base/PageTemplate';
+
+const VelogPageTemplateBlock = styled(PageTemplate)``;
+
+export interface VelogPageTemplateProps {}
+
+const VelogPageTemplate: React.FC<VelogPageTemplateProps> = props => {
+  return <VelogPageTemplateBlock />;
+};
+
+export default VelogPageTemplate;

src/components/velog/__tests__/VelogPageTemplate.test.tsx

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { render } from 'react-testing-library';
+import VelogPageTemplate, {
+  VelogPageTemplateProps,
+} from '../VelogPageTemplate';
+import renderWithRedux from '../../../lib/renderWithRedux';
+
+describe('VelogPageTemplate', () => {
+  const setup = (props: Partial<VelogPageTemplateProps> = {}) => {
+    const initialProps: VelogPageTemplateProps = {};
+    const utils = renderWithRedux(
+      <VelogPageTemplate {...initialProps} {...props} />,
+    );
+    return {
+      ...utils,
+    };
+  };
+  it('renders Header', () => {
+    const { getByTestId } = setup();
+    getByTestId('Header');
+  });
+});

src/lib/renderWithRedux.tsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import { render } from 'react-testing-library';
+import { createStore } from 'redux';
+import { Provider } from 'react-redux';
+import rootReducer, { RootState } from '../modules';
+
+const renderWithRedux = (ui: React.ReactNode, initialState?: RootState) => {
+  const store = createStore(rootReducer, initialState);
+  return {
+    ...render(<Provider store={store}>{ui}</Provider>),
+    store,
+  };
+};
+
+export default renderWithRedux;

src/pages/velog/VelogPage.tsx

@@ -1,9 +1,10 @@
 import * as React from 'react';
+import VelogPageTemplate from '../../components/velog/VelogPageTemplate';
 
 export interface VelogPageProps {}
 
 const VelogPage: React.FC<VelogPageProps> = props => {
-  return <>HeyThere</>;
+  return <VelogPageTemplate>HeyThere</VelogPageTemplate>;
 };
 
 export default VelogPage;