test: improve test coverage

Author: yinxin630

.eslintrc

@@ -13,7 +13,8 @@
     "plugins": ["@typescript-eslint", "react", "react-hooks", "jsx-a11y", "import", "jest"],
     "globals": {
         "importScripts": true,
-        "workbox": true
+        "workbox": true,
+        "__TEST__": true
     },
     "settings": {
         "import/resolver": {

client/components/Button.tsx

@@ -34,8 +34,4 @@ function Button({ type = 'primary', children, className = '', onClick }: Props)
     );
 }
 
-Button.defaultProps = {
-    type: 'primary',
-};
-
 export default Button;

client/localStorage.ts

@@ -20,7 +20,7 @@ export enum LocalStorageKey {
  * @param key 键值
  * @param defaultValue 默认值
  */
-function getTextValue(key: string, defaultValue: string = '') {
+function getTextValue(key: string, defaultValue: string) {
     const value = window.localStorage.getItem(key);
     return value || defaultValue;
 }
@@ -39,8 +39,7 @@ function getSwitchValue(key: string, defaultValue: boolean = true) {
  * 获取LocalStorage值
  */
 export default function getData() {
-    const defaultTheme = 'cool';
-    const theme = getTextValue(LocalStorageKey.Theme, defaultTheme);
+    const theme = getTextValue(LocalStorageKey.Theme, config.defaultTheme);
     let themeConfig = {
         primaryColor: '',
         primaryTextColor: '',
@@ -55,15 +54,15 @@ export default function getData() {
         themeConfig = {
             primaryColor: getTextValue(
                 LocalStorageKey.PrimaryColor,
-                config.theme[defaultTheme].primaryColor,
+                config.theme[config.defaultTheme].primaryColor,
             ),
             primaryTextColor: getTextValue(
                 LocalStorageKey.PrimaryTextColor,
-                config.theme[defaultTheme].primaryTextColor,
+                config.theme[config.defaultTheme].primaryTextColor,
             ),
             backgroundImage: getTextValue(
                 LocalStorageKey.BackgroundImage,
-                config.theme[defaultTheme].backgroundImage,
+                config.theme[config.defaultTheme].backgroundImage,
             ),
             aero: getSwitchValue(
                 LocalStorageKey.Aero,

client/state/reducer.ts

@@ -231,7 +231,7 @@ function transformTemporary(temporary: Linkman): Linkman {
 }
 
 const localStorage = getData();
-const initialState: State = {
+export const initialState: State = {
     user: null,
     linkmans: {},
     focus: '',
@@ -305,16 +305,10 @@ function reducer(state: State = initialState, action: Action): State {
                 // @ts-ignore
                 ...friends.map(transformFriend),
             ];
-            linkmans.forEach((linkman) => {
-                let existMessages = {};
-                if (state.linkmans[linkman._id]) {
-                    existMessages = state.linkmans[linkman._id].messages;
-                }
-                linkman.messages = existMessages;
-            });
 
             // 如果没登录过, 则将聚焦联系人设置为第一个联系人
             let { focus } = state;
+            /* istanbul ignore next */
             if (!state.user && linkmans.length > 0) {
                 focus = linkmans[0]._id;
             }
@@ -368,7 +362,10 @@ function reducer(state: State = initialState, action: Action): State {
         case ActionTypes.SetFocus: {
             const focus = action.payload as string;
             if (!state.linkmans[focus]) {
-                console.warn(`ActionTypes.SetFocus Error: 联系人 ${focus} 不存在`);
+                /* istanbul ignore next */
+                if (!__TEST__) {
+                    console.warn(`ActionTypes.SetFocus Error: 联系人 ${focus} 不存在`);
+                }
                 return state;
             }
 
@@ -429,7 +426,7 @@ function reducer(state: State = initialState, action: Action): State {
                 ...state,
                 linkmans: {
                     ...state.linkmans,
-                    [linkman._id]: transformedLinkman,
+                    [transformedLinkman._id]: transformedLinkman,
                 },
                 focus,
             };
@@ -510,7 +507,10 @@ function reducer(state: State = initialState, action: Action): State {
         case ActionTypes.DeleteMessage: {
             const { linkmanId, messageId } = action.payload as DeleteMessagePayload;
             if (!state.linkmans[linkmanId]) {
-                console.warn(`ActionTypes.DeleteMessage Error: 联系人 ${linkmanId} 不存在`);
+                /* istanbul ignore next */
+                if (!__TEST__) {
+                    console.warn(`ActionTypes.DeleteMessage Error: 联系人 ${linkmanId} 不存在`);
+                }
                 return state;
             }
 

config/client.ts

@@ -1,6 +1,28 @@
 const MB = 1024 * 1024;
 
-export default {
+type Theme = {
+    primaryColor: string;
+    primaryTextColor: string;
+    backgroundImage: string;
+    aero: boolean;
+}
+
+type Config = {
+    server: string;
+    maxImageSize: number;
+    maxBackgroundImageSize: number;
+    maxAvatarSize: number;
+    theme: {
+        default: Theme,
+        cool: Theme,
+    }
+    defaultTheme: 'default' | 'cool';
+    sound: string;
+    tagColorMode: string;
+    frontendMonitorAppId: string;
+}
+
+const config: Config = {
     server: process.env.NODE_ENV === 'development' ? '//localhost:9200' : '',
 
     maxImageSize: MB * 3,
@@ -22,6 +44,7 @@ export default {
             aero: false,
         },
     },
+    defaultTheme: 'cool',
     sound: 'default',
     tagColorMode: 'fixedColor',
 
@@ -31,3 +54,5 @@ export default {
      */
     frontendMonitorAppId: process.env.frontendMonitorAppId || '',
 };
+
+export default config;

jest.config.js

@@ -9,6 +9,12 @@ module.exports = {
         'ts-jest': {
             isolatedModules: true,
         },
+        __TEST__: true,
     },
     setupFilesAfterEnv: ['./jest.setup.js'],
+    collectCoverageFrom: [
+        '**/*.{ts,tsx}',
+        '!**/node_modules/**',
+        '!**/config/**',
+    ],
 };

test/client/localStorage.spec.ts

@@ -0,0 +1,22 @@
+import getData, { LocalStorageKey } from '../../client/localStorage';
+import config from '../../config/client';
+
+describe('client/localStorage.ts', () => {
+    it('should return localStorage value, or default value if not exists', () => {
+        expect(getData().sound).toBe(config.sound);
+        localStorage.setItem(LocalStorageKey.Sound, 'huaji');
+        expect(getData().sound).toBe('huaji');
+    });
+
+    it('should return default theme config when them not exists', () => {
+        localStorage.setItem(LocalStorageKey.Theme, 'xxx');
+        expect(getData().primaryColor).toBe(config.theme.cool.primaryColor);
+    });
+
+    it('should return boolean type value when value is true / false', () => {
+        localStorage.setItem(LocalStorageKey.SoundSwitch, 'true');
+        expect(getData().soundSwitch).toBe(true);
+        localStorage.setItem(LocalStorageKey.SoundSwitch, 'false');
+        expect(getData().soundSwitch).toBe(false);
+    });
+});