make compact config and script (#172)

* fix unit test code * adjust package script * adjust webpack config file * adjust babel config * adjust jest config file * adjust electron build config
AhKi · Apr 18, 2019 · b64de0c · b64de0c
2 parents 9bbfc4c + 83600b3
commit b64de0c
Show file tree

Hide file tree

Showing 24 changed files with 906 additions and 530 deletions.
diff --git a/.babelrc b/.babelrc
diff --git a/.eslintignore b/.eslintignore
diff --git a/.gitattributes b/.gitattributes
diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md
diff --git a/README.md b/README.md
@@ -64,23 +64,25 @@ This project use [yarn](https://yarnpkg.com/lang/en/) for package manager.
 git clone https://github.com/AhKi/oh-my-desk.git
 cd oh-my-desk
 ```
+**Download Dependency**
+```
+yarn
+```
 
 **Start Project**
-
 ```
-yarn && yarn start 
+yarn start 
 ```
 
-**Show Unit test coverage**
-
+**Unit test**
 ```
-yarn && yarn test
+yarn test
+yarn show:coverage // if you want to show coverage
 ```
 
-**Build**
-
+**Packaging(Make install file)**
 ```
-yarn && yarn package
+yarn package
 ```
 
 ## Documentation

diff --git a/app/renderer/pages/widget/components/WebWidget/WebWidget.spec.jsx b/app/renderer/pages/widget/components/WebWidget/WebWidget.spec.jsx
@@ -143,7 +143,7 @@ describe('test WebWidget', () => {
         it('match times handling event', () => {
           configureLoader();
 
-          expect(addEventListener).toHaveBeenCalledTimes(2);
+          expect(addEventListener).toHaveBeenCalledTimes(3);
         });
 
         describe('match each handled event ', () => {
@@ -180,6 +180,18 @@ describe('test WebWidget', () => {
                 });
                 break;
               }
+              case 'page-title-updated': {
+                it('when page title is updated', () => {
+                  wrapper.instance().setState = setState;
+
+                  mock[1]({ title: 'mock-title' });
+
+                  expect(setState).toHaveBeenNthCalledWith(1, {
+                    title: 'mock-title',
+                  });
+                });
+                break;
+              }
               default: {
                 throw new Error('Need to add new test case');
               }

diff --git a/app/renderer/pages/widget/components/WebWidget/__snapshots__/WebWidget.spec.jsx.snap b/app/renderer/pages/widget/components/WebWidget/__snapshots__/WebWidget.spec.jsx.snap
@@ -11,6 +11,24 @@ exports[`test WebWidget should match to snapshot when default render 1`] = `
   <div
     className="WebWidget"
   >
+    <HelmetWrapper
+      defer={true}
+      encodeSpecialCharacters={true}
+    >
+      <SideEffect(NullComponent)
+        defer={true}
+        encodeSpecialCharacters={true}
+        title=""
+        titleAttributes={Object {}}
+      >
+        <NullComponent
+          defer={true}
+          encodeSpecialCharacters={true}
+          title=""
+          titleAttributes={Object {}}
+        />
+      </SideEffect(NullComponent)>
+    </HelmetWrapper>
     <Connect(toJS(WidgetHeader))
       currentUrl=""
       isLoading={false}

diff --git a/.eslintrc → config/.eslintrc b/.eslintrc → config/.eslintrc
diff --git a/config/babel/babel.config.js b/config/babel/babel.config.js
@@ -0,0 +1,28 @@
+const { APP_PATH } = require('../path');
+
+module.exports = {
+  presets: ['@babel/env', '@babel/react'],
+  plugins: [
+    '@babel/plugin-proposal-object-rest-spread',
+    '@babel/plugin-proposal-class-properties',
+    ['module-resolver', {
+      root: [APP_PATH],
+      alias: {
+        actions: `${APP_PATH}/actions`,
+        assets: `${APP_PATH}/assets`,
+        config: `${APP_PATH}/config`,
+        constants: `${APP_PATH}/constants`,
+        components: `${APP_PATH}/components`,
+        main: `${APP_PATH}/main`,
+        renderer: `${APP_PATH}/renderer`,
+        process: `${APP_PATH}/process`,
+        setting: `${APP_PATH}/renderer/pages/setting`,
+        widget: `${APP_PATH}/renderer/pages/widget`,
+        scss: `${APP_PATH}/renderer/scss`,
+        utils: `${APP_PATH}/utils`,
+        store: `${APP_PATH}/store`,
+      },
+      extensions: ['.js', '.jsx'],
+    }],
+  ],
+};
diff --git a/config/babel/babel.jest.js b/config/babel/babel.jest.js
@@ -0,0 +1,3 @@
+module.exports = require('babel-jest').createTransformer(
+  require('./babel.config.js'),
+);
diff --git a/config/babel/babel.register.js b/config/babel/babel.register.js
@@ -0,0 +1,5 @@
+const { CONFIG_PATH } = require('../path');
+
+require('@babel/register')({
+  configFile: `${CONFIG_PATH}/babel/babel.config.js`,
+});
diff --git a/electron-builder.yml → config/electron-builder.yml b/electron-builder.yml → config/electron-builder.yml
diff --git a/config/enzyme.config.js b/config/enzyme.config.js
@@ -0,0 +1,4 @@
+const { configure } = require('enzyme/build');
+const Adapter = require('enzyme-adapter-react-16/build');
+
+configure({ adapter: new Adapter() });
diff --git a/jest.config.js → config/jest/jest.config.js b/jest.config.js → config/jest/jest.config.js
@@ -1,6 +1,6 @@
 module.exports = {
   collectCoverageFrom: [
-    'app/**/*.{js,jsx}',
+    '<rootDir>/app/**/*.{js,jsx}',
   ],
   moduleNameMapper: {
     '\\.(css|scss)$': '<rootDir>/app/__mocks__/styleMock.js',
@@ -18,10 +18,14 @@ module.exports = {
     '^widget(.*)$': '<rootDir>/app/renderer/pages/widget$1',
     '^utils(.*)$': '<rootDir>/app/utils$1',
   },
+  transform: {
+    '^.+\\.jsx?$': '<rootDir>/config/babel/babel.jest.js',
+  },
+  rootDir: '../../',
   globals: {
-    __dirname: '/Users/user-name/project/oh-my-desk/app',
+    __dirname: '<rootDir>',
   },
-  setupTestFrameworkScriptFile: '<rootDir>/enzyme.config.js',
+  setupTestFrameworkScriptFile: '<rootDir>/config/enzyme.config.js',
   snapshotSerializers: [
     'enzyme-to-json/serializer',
   ],

diff --git a/jest.e2e.config.js → config/jest/jest.e2e.config.js b/jest.e2e.config.js → config/jest/jest.e2e.config.js
@@ -16,6 +16,7 @@ module.exports = {
     '^widget(.*)$': '<rootDir>/app/renderer/pages/widget$1',
     '^utils(.*)$': '<rootDir>/app/utils$1',
   },
+  rootDir: '../../',
   globals: {
     __dirname: '/Users/user-name/project/oh-my-desk/app',
   },

diff --git a/config/lint-staged.config.js b/config/lint-staged.config.js
@@ -0,0 +1,6 @@
+module.exports = {
+  linters: {
+    '**/*.{js,jsx}': 'eslint',
+  },
+  ignore: ['**/*.config.js'],
+};
diff --git a/config/path.js b/config/path.js
@@ -0,0 +1,11 @@
+const path = require('path');
+
+const ROOT_PATH = path.join(__dirname, '..');
+
+module.exports = {
+  ROOT_PATH,
+  APP_PATH: path.join(ROOT_PATH, 'app'),
+  BUILD_PATH: path.join(ROOT_PATH, 'build'),
+  CONFIG_PATH: path.join(ROOT_PATH, 'config'),
+  TEST_PATH: path.join(ROOT_PATH, 'test'),
+};
diff --git a/webpack.basic.config.js → config/webpack/webpack.basic.config.js b/webpack.basic.config.js → config/webpack/webpack.basic.config.js
@@ -1,13 +1,14 @@
 const path = require('path');
 const webpack = require('webpack');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
+const { APP_PATH, ROOT_PATH, CONFIG_PATH } = require('../path');
 
 module.exports = {
   entry: {
-    widget: './app/renderer/pages/widget/index.jsx',
-    preloadScript: './app/renderer/pages/widget/preloadScript.js',
-    preference: './app/renderer/pages/preference/index.jsx',
-    search: './app/renderer/pages/search/index.jsx',
+    widget: path.join(APP_PATH, 'renderer/pages/widget/index.jsx'),
+    preloadScript: path.join(APP_PATH, 'renderer/pages/widget/preloadScript.js'),
+    preference: path.join(APP_PATH, 'renderer/pages/preference/index.jsx'),
+    search: path.join(APP_PATH, 'renderer/pages/search/index.jsx'),
   },
   target: 'electron-renderer',
   module: {
@@ -16,14 +17,22 @@ module.exports = {
       {
         test: /\.jsx?$/,
         include: [
-          path.join(__dirname, '/app'),
+          APP_PATH,
         ],
         exclude: /node_modules/,
         use: [
           {
             loader: 'babel-loader',
+            options: {
+              configFile: path.join(CONFIG_PATH, 'babel/babel.config.js'),
+            },
+          },
+          {
+            loader: 'eslint-loader',
+            options: {
+              configFile: path.join(CONFIG_PATH, '.eslintrc'),
+            },
           },
-          'eslint-loader',
         ]
       },
       {
@@ -37,7 +46,7 @@ module.exports = {
             loader: 'sass-resources-loader',
             options: {
               resources: [
-                path.join(__dirname, 'app/renderer/scss', '**/_*.scss'),
+                path.join(APP_PATH, 'renderer/scss', '**/_*.scss'),
               ],
             },
           }
@@ -48,7 +57,7 @@ module.exports = {
         loader: 'file-loader',
         options: {
           name: '[path][name].[ext]',
-          publicPath: process.env.NODE_ENV === 'development' ? path.join(__dirname) : undefined,
+          publicPath: process.env.NODE_ENV === 'development' ? ROOT_PATH : undefined,
           outputPath: process.env.NODE_ENV === 'development' ? '/' : undefined,
         },
       },
@@ -63,45 +72,43 @@ module.exports = {
     new HtmlWebpackPlugin({
       chunks: ['widget'],
       filename: 'widget.html',
-      template: path.join(__dirname, './app/renderer/pages/widget/widget.html'),
+      template: path.join(APP_PATH, 'renderer/pages/widget/widget.html'),
       inject: 'body',
     }),
     new HtmlWebpackPlugin({
       chunks: ['preference'],
       filename: 'preference.html',
-      template: path.join(__dirname, './app/renderer/pages/preference/preference.html'),
+      template: path.join(APP_PATH, 'renderer/pages/preference/preference.html'),
       inject: 'body',
     }),
     new HtmlWebpackPlugin({
       chunks: ['search'],
       filename: 'search.html',
-      template: path.join(__dirname, './app/renderer/pages/search/search.html'),
+      template: path.join(APP_PATH, 'renderer/pages/search/search.html'),
       inject: 'body',
     }),
     new webpack.DefinePlugin({
       'process.env': {
         NODE_ENV: JSON.stringify(process.env.NODE_ENV),
         IS_DEVTOOLS: JSON.stringify(process.env.IS_DEVTOOLS),
       },
-      '__DEV__': process.env.NODE_ENV === 'development',
-      '__PROD__': process.env.NODE_ENV === 'production',
     }),
   ],
   resolve: {
     alias: {
-      actions: path.resolve(__dirname, 'app/actions'),
-      assets: path.resolve(__dirname, 'app/assets'),
-      config: path.resolve(__dirname, 'app/config.js'),
-      constants: path.resolve(__dirname, 'app/constants'),
-      components: path.resolve(__dirname, 'app/components'),
-      main: path.resolve(__dirname, 'app/main'),
-      renderer: path.resolve(__dirname, 'app/renderer'),
-      process: path.resolve(__dirname, 'app/process'),
-      setting: path.resolve(__dirname, 'app/renderer/pages/setting'),
-      widget: path.resolve(__dirname, 'app/renderer/pages/widget'),
-      scss: path.resolve(__dirname, 'app/renderer/scss'),
-      utils: path.resolve(__dirname, 'app/utils'),
-      store: path.resolve(__dirname, 'app/store'),
+      actions: `${APP_PATH}/actions`,
+      assets: `${APP_PATH}/assets`,
+      config: `${APP_PATH}/config`,
+      constants: `${APP_PATH}/constants`,
+      components: `${APP_PATH}/components`,
+      main: `${APP_PATH}/main`,
+      renderer: `${APP_PATH}/renderer`,
+      process: `${APP_PATH}/process`,
+      setting: `${APP_PATH}/setting`,
+      widget: `${APP_PATH}/pages/widget`,
+      scss: `${APP_PATH}/renderer/scss`,
+      utils: `${APP_PATH}/utils`,
+      store: `${APP_PATH}/store`,
     },
     extensions: ['.js', '.jsx'],
   },