APIDB-5731 Update packages and add Vlt-Table features (#63)

APIDB-5731 Update packages and add Vlt-Table features (#63)

.eslintrc.js

@@ -3,50 +3,63 @@
 module.exports = {
   root: true,
   parserOptions: {
-    parser: 'babel-eslint'
+    parser: '@babel/eslint-parser',
   },
   env: {
     browser: true,
     jest: true,
   },
   // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
   // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
-  extends: ['plugin:vue/essential', 'airbnb-base'],
+  extends: ['plugin:vue/essential', 'plugin:prettier/recommended', 'airbnb-base'],
   // required to lint *.vue files
-  plugins: [
-    'vue'
-  ],
+  plugins: ['vue', 'prettier'],
   // check if imports actually resolve
   settings: {
     'import/resolver': {
       webpack: {
-        config: 'webpack.config.js'
-      }
-    }
+        config: 'webpack.config.js',
+      },
+    },
   },
   // add your custom rules here
   rules: {
     // don't require .vue extension when importing
-    'import/extensions': ['error', 'always', {
-      js: 'never',
-      vue: 'never'
-    }],
+    'import/extensions': [
+      'error',
+      'always',
+      {
+        js: 'never',
+        vue: 'never',
+      },
+    ],
     // disallow reassignment of function parameters
     // disallow parameter object manipulation except for specific exclusions
-    'no-param-reassign': ['error', {
-      props: true,
-      ignorePropertyModificationsFor: [
-        'state', // for vuex state
-        'acc', // for reduce accumulators
-        'e' // for e.returnvalue
-      ]
-    }],
+    'no-param-reassign': [
+      'error',
+      {
+        props: true,
+        ignorePropertyModificationsFor: [
+          'state', // for vuex state
+          'acc', // for reduce accumulators
+          'e', // for e.returnvalue
+        ],
+      },
+    ],
     // allow optionalDependencies
-    'import/no-extraneous-dependencies': ['error', {
-      optionalDependencies: ['test/unit/index.js']
-    }],
+    'import/no-extraneous-dependencies': [
+      'error',
+      {
+        optionalDependencies: ['test/unit/index.js'],
+      },
+    ],
     // allow debugger during development
     'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
-    'arrow-parens': ['warn', 'always'],
-  }
-}
+    'arrow-parens': [1, 'as-needed'],
+    'comma-dangle': 0, // handled by prettier
+    'vue/html-indent': 0, // managed by prettier
+    indent: 0, // managed by prettier
+    'max-len': 0,
+    'object-curly-newline': 0,
+  },
+};

.gitignore

@@ -3,7 +3,7 @@ node_modules/
 dist/
 npm-debug.log
 yarn-error.log
-coverage/
+coverage-frontend/
 
 # Editor directories and files
 .idea

.prettierrc

@@ -1,5 +1,6 @@
 {
-  "singleQuote": true,
   "trailingComma": "es5",
-  "arrowParens": "always"
-}
+  "singleQuote": true,
+  "printWidth": 120,
+  "vueIndentScriptAndStyle": true
+}

README.md

@@ -1,60 +1,75 @@
 # volta-vue
 
+![Coverage lines](./coverage/badge-lines.svg)
+![Coverage functions](./coverage/badge-functions.svg)
+![Coverage branches](./coverage/badge-branches.svg)
+![Coverage statements](./coverage/badge-statements.svg)
+
 > Vue.js single file components for Vonage [Volta](https://github.com/Nexmo/volta) authored with [vue-loader](https://github.com/vuejs/vue-loader)
 
 ## Contributing
+
 ### Steps
+
 1. Create a branch from the **develop** branch
 2. Make your changes and commit to your branch
 3. Create a pull request to merge your branch to **develop**
 
 ### Guidelines
+
 - Create one branch per feature/fix
 - Branches should be deleted after being merged in to **develop**
 
 ## Getting Started with NPM
-``` bash
+
+```bash
 npm install @vonagevolta/vue
 ```
 
 ### Fonts
+
 Set the font variable value before loading the volta style sheet
-``` bash
+
+```bash
 $Vlt-font-url: '~@vonagevolta/core/fonts/';
 @import '~@vonagevolta/core/scss/volta';
 ```
 
 ### Icons
+
 Icons have a dependency on [svg-sprite-loader](https://github.com/kisenka/svg-sprite-loader)
 
-``` bash
+```bash
 npm install svg-sprite-loader --save-dev
 ```
 
-*Webpack config*
-``` bash
+_Webpack config_
+
+```bash
 {
   test: /\.svg$/,
   loader: 'svg-sprite-loader',
   options: {
-    symbolId: 'V' 
+    symbolId: 'V'
   }
-} 
+}
 ```
 
-*App.vue*
-``` bash
+_App.vue_
+
+```bash
 import VoltaIcons from '@vonagevolta/core/dist/symbol/volta-icons.svg';
 ...
 data () {
-  return { 
+  return {
     VoltaIcons
   }
 }
 ```
 
-*In your vue component*
-``` bash
+_In your vue component_
+
+```bash
 <template>
   <vlt-icon icon="help" />
 </template>
@@ -72,21 +87,24 @@ data () {
 ```
 
 ## Running tests
+
 We use [Vue Test Utils](https://vue-test-utils.vuejs.org/) with [Jest](https://jestjs.io/en/) for unit testing.
-You can run all the tests: 
-``` bash
+You can run all the tests:
+
+```bash
 npm test
 ```
+
 Or a single test:
-``` bash
+
+```bash
 npm test test/radio/VltRadio.spec.js
 ```
 
-
 ## Viewing the docs
 
 Clone repo
 
-``` bash
+```bash
 npm run dev
 ```

babel.config.js

@@ -0,0 +1,12 @@
+module.exports = {
+  presets: [
+    [
+      '@babel/preset-env',
+      {
+        targets: {
+          esmodules: true,
+        },
+      },
+    ],
+  ],
+};

jest.config.js

@@ -0,0 +1,22 @@
+/**
+ * Mock the time zone so that running tests on a local computer
+ * and on Jenkins yields the same time zone
+ */
+
+process.env.TZ = 'UTC';
+
+module.exports = {
+  testEnvironment: 'node',
+  setupFiles: ['<rootDir>/testSetup.js'],
+  moduleFileExtensions: ['js', 'vue'],
+  transform: {
+    '.*\\.(vue)$': 'vue-jest',
+    '^.+\\.js$': 'babel-jest',
+  },
+  collectCoverage: false,
+  coverageDirectory: 'coverage-frontend',
+  collectCoverageFrom: ['**/components/**/*.vue', '!**/node_modules/**'],
+  coverageReporters: ['json-summary', 'text', 'lcov'],
+  snapshotSerializers: ['jest-serializer-vue'],
+  watchPathIgnorePatterns: ['node_modules'],
+};