Merge branch 'master' into complex-table

Author: nerimartinez

.eslintrc.js

@@ -1,20 +1,51 @@
-/* eslint-env node */
 module.exports = {
   root: true,
-  ignorePatterns: ['*.config.js', '*.spec.js', 'dist/*'],
+
+  // Ignore every file but the patterns specified after '/*'
+  ignorePatterns: [
+    '/*',
+    '!/components', // all files inside /components
+    '!/tools', // all files inside /tools
+    '!/*.js', // all JS files in root dir
+  ],
+
   extends: [
     'plugin:vue/vue3-recommended',
     'eslint:recommended',
     'plugin:storybook/recommended',
   ],
 
   plugins: ['vue'],
-
-  env: {
-    'vue/setup-compiler-macros': true,
-  },
+  parser: 'vue-eslint-parser',
 
   rules: {
     'vue/multi-word-component-names': 'off',
   },
+
+  overrides: [
+    // Config for unit tests
+    {
+      files: ['*.spec.js'],
+      plugins: ['jest'],
+      extends: [
+        'plugin:jest/recommended',
+        'plugin:jest-formatting/strict',
+      ],
+      env: {
+        jest: true,
+        'jest/globals': true,
+      },
+      globals: {
+        global: 'writable',
+      },
+    },
+
+    // Config for files that run in node env (config files, etc)
+    {
+      files: ['*.config.js', '.eslintrc.js'],
+      env: {
+        node: true,
+      },
+    },
+  ],
 };

.storybook/main.js

@@ -1,4 +1,4 @@
-const path = require('path');
+const path = require('node:path');
 
 
 module.exports = {

components/jest.config.js

@@ -1,5 +1,8 @@
+/** @type {import('jest').Config} */
 module.exports = {
   rootDir: __dirname,
+  displayName: 'components',
+
   moduleFileExtensions: [
     'js',
     'json',
@@ -26,17 +29,13 @@ module.exports = {
 
   clearMocks: true,
 
-  testMatch: [
-    '<rootDir>/(**/*\\.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx))',
-  ],
-
-  collectCoverage: true,
-
   collectCoverageFrom: [
-    'src/**/*.{js,vue}',
+    '<rootDir>/src/**/*.{js,vue}',
   ],
 
-  coverageDirectory: '<rootDir>/test/coverage/',
+  testMatch: [
+    '<rootDir>/(**/*\\.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx))',
+  ],
 
   testEnvironment: 'jsdom',
   testEnvironmentOptions: {

components/src/core/helpers.spec.js

@@ -18,11 +18,11 @@ describe('clone', () => {
 });
 
 describe('has', () => {
-  it('should check if object has an own property of key', () => {
+  it('returns true if the object has the property', () => {
     expect(has('prop', { prop: undefined })).toBeTruthy();
   });
 
-  it('should check if object has an own property of key', () => {
+  it('returns false if the object does not have the property', () => {
     expect(has('prop1', { prop: undefined })).toBeFalsy();
   });
 });

components/src/core/injector/core/launcher.spec.js

@@ -44,33 +44,39 @@ describe('$init', () => {
 
     it('handler should set proper id to state', () => {
       handler({}, { $id: 'XXX' });
+
       expect(core.id).toBe('XXX');
     });
 
     it('should handler should set passed data to state', () => {
       handler({ foo: 'BAR' }, {});
+
       expect(core.state).toEqual({ foo: 'BAR' });
     });
 
     it('should emit "$size" event', () => {
       handler({}, {});
+
       expect(injector.emit.mock.calls[2]).toEqual(['$size', 'SIZE']);
     });
 
     it('should get sizes from $size method', () => {
       handler({}, {});
+
       expect(core.size).toHaveBeenCalled();
     });
 
     it('should set interval', () => {
       handler({}, {});
+
       expect(setInterval).toHaveBeenCalledWith(expect.any(Function), 300);
     });
 
     it('should set interval for sizing', () => {
       handler({}, {});
       injector.emit.mock.calls = [];
       setInterval.mock.calls[0][0]();
+
       expect(injector.emit).toHaveBeenCalledWith('$size', 'SIZE');
     });
   });

components/src/core/injector/index.spec.js

@@ -42,7 +42,16 @@ describe('createInjector on launcher error', () => {
     launcher.mockImplementation(() => Promise.reject(new Error('ERROR')));
   });
 
-  it('should throw an error', () => {
-    expect(createInjector()).rejects.toThrow('ERROR');
+  it('should throw an error', async () => {
+    let error;
+
+    try {
+      await createInjector();
+    } catch (e) {
+      error = e;
+    }
+
+    expect(error).toBeInstanceOf(Error);
+    expect(error.message).toEqual('ERROR');
   });
 });

components/src/index.spec.js

@@ -1,3 +1,4 @@
+/* eslint-disable vue/one-component-per-file */
 import createApp from './index';
 import injector from '~core/injector';
 import registerWidget from '~core/registerWidget';

components/src/widgets/button/widget.spec.js

@@ -15,6 +15,8 @@ describe('Button widget', () => {
         expect(result).toEqual(`
   background-color: #2C98F0;
   color: #FFF;
+  height: auto;
+  width: auto;
 `);
       });
     });

components/src/widgets/icon/widget.spec.js

@@ -59,7 +59,7 @@ describe('Icon', () => {
         expect(result).toEqual('12px');
       });
 
-      it('shouldn\`t add px if size prop is passed as String with "px"', () => {
+      it('shouldn\'t add px if size prop is passed as String with "px"', () => {
         const component = Icon.setup(
           {size:  '12px'},
           {expose: () => 'mock reqired for composition api'}

components/src/widgets/icon/widget.vue

@@ -12,7 +12,7 @@
   import * as icons from '@cloudblueconnect/material-svg';
   defineOptions({
     name: 'Icon',
-  })
+  });
   const props = defineProps({
     iconName: {
       type: String,
@@ -26,7 +26,7 @@
       type: [Number, String],
       default: '24',
     }
-  })
+  });
   const addUnits = (value) => {
     const regex = /^-?\d+$/;
     if (!regex.test(value)) return value;
@@ -39,7 +39,7 @@
       width: addUnits(props.size),
     }
   })
- 
+
   const icon = computed(() => {
     return icons[props.iconName];
   })