Merge pull request #118 from coreui/dev-jest-testing

tests: add missing unit and e2e testing

CHANGELOG.md

@@ -1,5 +1,22 @@
 ## [vue](./README.md) version `changelog`
 
+##### `v2.0.0-rc.0`
+- test(unit): add some views testing 
+- test(e2e): add testing for mobile `sidebar-show` 
+- refactor: card headers margins
+- chore: update `vue` to `2.5.17`
+- chore: update `vue-template-compiler` to `2.5.17`
+- chore: update `@vue/cli-plugin-babel` to `3.0.1`
+- chore: update `@vue/cli-plugin-e2e-nightwatch` to `3.0.1`
+- chore: update `@vue/cli-plugin-eslint` to `3.0.1`
+- chore: update `@vue/cli-plugin-unit-jest` to `3.0.1`
+- chore: update `@vue/cli-service` to `3.0.1`
+- chore: update `@vue/test-utils` to `1.0.0-beta.24`
+- chore: update `babel-jest` to `23.4.2`
+- chore: update `node-sass` to `4.9.3`
+- chore: update `sass-loader` to `7.1.0`
+- chore: update `vue-chartjs` to `3.4.0`
+
 ##### `v2.0.0-beta.13`
 - fix(jest.config.js): solves - _SecurityError: localStorage is not available for opaque origins_
 - chore: update `bootstrap` to `4.1.3`

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coreui/coreui-free-vue-admin-template",
-  "version": "2.0.0-beta.13",
+  "version": "2.0.0-rc.0",
   "description": "Open Source Bootstrap Admin Template",
   "author": "Łukasz Holeczek",
   "homepage": "http://coreui.io",
@@ -22,28 +22,28 @@
     "bootstrap-vue": "^2.0.0-rc.11",
     "chart.js": "^2.7.2",
     "core-js": "^2.5.7",
-    "css-vars-ponyfill": "^1.8.0",
+    "css-vars-ponyfill": "^1.9.0",
     "flag-icon-css": "^3.0.0",
     "font-awesome": "^4.7.0",
     "perfect-scrollbar": "^1.4.0",
     "simple-line-icons": "^2.4.1",
-    "vue": "^2.5.16",
+    "vue": "^2.5.17",
-    "vue-chartjs": "^3.3.2",
+    "vue-chartjs": "^3.4.0",
     "vue-perfect-scrollbar": "^0.1.0",
     "vue-router": "^3.0.1"
   },
   "devDependencies": {
-    "@vue/cli-plugin-babel": "^3.0.0-rc.7",
+    "@vue/cli-plugin-babel": "^3.0.1",
-    "@vue/cli-plugin-e2e-nightwatch": "^3.0.0-rc.7",
+    "@vue/cli-plugin-e2e-nightwatch": "^3.0.1",
-    "@vue/cli-plugin-eslint": "^3.0.0-rc.7",
+    "@vue/cli-plugin-eslint": "^3.0.1",
-    "@vue/cli-plugin-unit-jest": "^3.0.0-rc.7",
+    "@vue/cli-plugin-unit-jest": "^3.0.1",
-    "@vue/cli-service": "^3.0.0-rc.7",
+    "@vue/cli-service": "^3.0.1",
-    "@vue/test-utils": "^1.0.0-beta.21",
+    "@vue/test-utils": "^1.0.0-beta.24",
     "babel-core": "^7.0.0-bridge.0",
-    "babel-jest": "^23.4.0",
+    "babel-jest": "^23.4.2",
-    "node-sass": "^4.9.2",
+    "node-sass": "^4.9.3",
-    "sass-loader": "^7.0.3",
+    "sass-loader": "^7.1.0",
-    "vue-template-compiler": "^2.5.16"
+    "vue-template-compiler": "^2.5.17"
   },
   "browserslist": [
     "> 1%",

src/views/base/ProgressBars.vue

@@ -29,15 +29,15 @@
           <i class="fa fa-align-justify"></i> <strong> Progress </strong><small>labels</small>
         </div>
         <div>
-          <h5>No label</h5>
+          <h6>No label</h6>
           <b-progress :value="value" :max="max2" class="mb-3"></b-progress>
-          <h5>Value label</h5>
+          <h6>Value label</h6>
           <b-progress :value="value" :max="max2" show-value class="mb-3"></b-progress>
-          <h5>Progress label</h5>
+          <h6>Progress label</h6>
           <b-progress :value="value" :max="max2" show-progress class="mb-3"></b-progress>
-          <h5>Value label with precision</h5>
+          <h6>Value label with precision</h6>
           <b-progress :value="value" :max="max2" :precision="2" show-value class="mb-3"></b-progress>
-          <h5>Progress label with precision</h5>
+          <h6>Progress label with precision</h6>
           <b-progress :value="value" :max="max2" :precision="2" show-progress class="mb-3"></b-progress>
         </div>
       </b-card>
@@ -48,9 +48,9 @@
           <i class="fa fa-align-justify"></i><strong> Progress </strong><small>width</small>
         </div>
         <div>
-          <h5>Default width</h5>
+          <h6>Default width</h6>
           <b-progress :value="value3" class="mb-3"></b-progress>
-          <h5>Custom widths</h5>
+          <h6>Custom widths</h6>
           <b-progress :value="value3" class="w-75 mb-2"></b-progress>
           <b-progress :value="value3" class="w-50 mb-2"></b-progress>
           <b-progress :value="value3" class="w-25"></b-progress>
@@ -63,9 +63,9 @@
           <i class="fa fa-align-justify"></i><strong> Progress </strong><small>height</small>
         </div>
         <div>
-          <h5>Default height</h5>
+          <h6>Default height</h6>
           <b-progress :value="value3" show-progress class="mb-3"></b-progress>
-          <h5>Custom heights</h5>
+          <h6>Custom heights</h6>
           <b-progress height="2rem" :value="value3" show-progress class="mb-2"></b-progress>
           <b-progress height="20px" :value="value3" show-progress class="mb-2"></b-progress>
           <b-progress height="2px" :value="value3"></b-progress>

src/views/base/Tooltips.vue

@@ -78,7 +78,7 @@
             <b-btn id="tooltipButton-showEvent" variant="primary">I have a tooltip</b-btn>
           </div>
           <div class="p-2">
-            <b-btn class="px-1" @click="onOpen">Open</b-btn>
+            <b-btn class="px-1 mr-1" @click="onOpen">Open</b-btn>
             <b-btn class="px-1" @click="onClose">Close</b-btn>
           </div>
 
@@ -98,7 +98,7 @@
             <b-btn id="tooltipButton-disable" variant="primary">I have a tooltip</b-btn>
           </div>
           <div class="p-2">
-            <b-btn @click="disabled = !disabled">
+            <b-btn @click="disabled = !disabled" class="mr-1">
               {{ disabled ? 'Enable' : 'Disable' }} Tooltip by prop
             </b-btn>
 

src/views/buttons/BrandButtons.vue

@@ -4,9 +4,11 @@
       <b-col cols="12">
         <b-card>
           <div slot="header">
-            <strong>Brand Button</strong> <small>Usage ex.</small><code style="text-transform:lowercase">&lt;b-button variant="facebook"&gt;&lt;span&gt;Facebook&lt;/span&gt;&lt;/b-button&gt;</code>
+            <strong>Brand Button</strong>
           </div>
-          <h6>Size Small <small>Add this <code>size="sm"</code></small></h6>
+          <small>Usage </small><code style="text-transform:lowercase">&lt;b-button variant="facebook"&gt;&lt;span&gt;Facebook&lt;/span&gt;&lt;/b-button&gt;</code>
+          <hr/>
+          <h6>Size Small <small>Add <code>size="sm"</code></small></h6>
           <p>
             <b-button size="sm" class="btn-brand" variant="facebook"><i class="fa fa-facebook"></i><span>Facebook</span></b-button>
             <b-button size="sm" class="btn-brand" variant="twitter"><i class="fa fa-twitter"></i><span>Twitter</span></b-button>
@@ -62,7 +64,7 @@
             <b-button variant="foursquare" class="btn-brand"><i class="fa fa-foursquare"></i><span>Forsquare</span></b-button>
             <b-button variant="vimeo" class="btn-brand"><i class="fa fa-vimeo"></i><span>Vimeo</span></b-button>
           </p>
-          <h6>Size Large <small>Add this <code>size="lg"</code></small></h6>
+          <h6>Size Large <small>Add <code>size="lg"</code></small></h6>
           <p>
             <b-button size="lg" variant="facebook" class="btn-brand"><i class="fa fa-facebook"></i><span>Facebook</span></b-button>
             <b-button size="lg" variant="twitter" class="btn-brand"><i class="fa fa-twitter"></i><span>Twitter</span></b-button>
@@ -95,9 +97,11 @@
       <b-col cols="12">
         <b-card>
           <div slot="header">
-            <strong>Brand Button</strong> <small>Only icons. Usage ex.</small> <code style="text-transform:lowercase">&lt;b-button variant="facebook icon"&gt;&lt;span&gt;Facebook&lt;/span&gt;&lt;/b-button&gt;</code>
+            <strong>Brand Button </strong> <small>Icons only</small>
           </div>
-          <h6>Size Small <small>Add this <code>size="sm"</code></small></h6>
+          <small>Usage </small> <code style="text-transform:lowercase">&lt;b-button variant="facebook icon"&gt;&lt;span&gt;Facebook&lt;/span&gt;&lt;/b-button&gt;</code>
+          <hr/>
+          <h6>Size Small <small>Add <code>size="sm"</code></small></h6>
           <p>
             <b-button size="sm" variant="facebook icon" class="btn-brand"><i class="fa fa-facebook"></i></b-button>
             <b-button size="sm" variant="twitter icon" class="btn-brand"><i class="fa fa-twitter"></i></b-button>
@@ -153,7 +157,7 @@
             <b-button variant="foursquare icon" class="btn-brand"><i class="fa fa-foursquare"></i></b-button>
             <b-button variant="vimeo icon" class="btn-brand"><i class="fa fa-vimeo"></i></b-button>
           </p>
-          <h6>Size Large <small>Add this <code>size="lg"</code></small></h6>
+          <h6>Size Large <small>Add <code>size="lg"</code></small></h6>
           <p>
             <b-button size="lg" variant="facebook icon" class="btn-brand"><i class="fa fa-facebook"></i></b-button>
             <b-button size="lg" variant="twitter icon" class="btn-brand"><i class="fa fa-twitter"></i></b-button>
@@ -187,9 +191,11 @@
       <b-col cols="12">
         <b-card>
           <div slot="header">
-            <strong>Brand Button</strong> <small>Only text. Usage ex.</small> <code style="text-transform:lowercase">&lt;b-button variant="facebook text"&gt;&lt;span&gt;Facebook&lt;/span&gt;&lt;/b-button&gt;</code>
+            <strong>Brand Button </strong> <small>Text only</small>
           </div>
-          <h6>Size Small <small>Add this <code>size="sm"</code></small></h6>
+          <small>Usage </small> <code style="text-transform:lowercase">&lt;b-button variant="facebook text"&gt;&lt;span&gt;Facebook&lt;/span&gt;&lt;/b-button&gt;</code>
+          <hr/>
+          <h6>Size Small <small>Add <code>size="sm"</code></small></h6>
           <p>
             <b-button size="sm" variant="facebook text" class="btn-brand"><span>Facebook</span></b-button>
             <b-button size="sm" variant="twitter text" class="btn-brand"><span>Twitter</span></b-button>
@@ -245,7 +251,7 @@
             <b-button variant="foursquare text" class="btn-brand"><span>Forsquare</span></b-button>
             <b-button variant="vimeo text" class="btn-brand"><span>Vimeo</span></b-button>
           </p>
-          <h6>Size Large <small>Add this <code>size="lg"</code></small></h6>
+          <h6>Size Large <small>Add <code>size="lg"</code></small></h6>
           <p>
             <b-button size="lg" variant="facebook text" class="btn-brand"><span>Facebook</span></b-button>
             <b-button size="lg" variant="twitter text" class="btn-brand"><span>Twitter</span></b-button>
@@ -281,7 +287,7 @@
 
 <script>
 export default {
-  name: 'social-buttons'
+  name: 'brand-buttons'
 }
 </script>
 

src/views/buttons/StandardButtons.vue

@@ -686,3 +686,9 @@ export default {
   }
 }
 </script>
+
+<style scoped>
+  .btn.disabled {
+    cursor: auto;
+  }
+</style>

tests/e2e/specs/test.js

@@ -80,6 +80,24 @@ module.exports = {
         this.assert.cssClassNotPresent('/html/body', 'brand-minimized')
       })
 
+    browser
+    .resizeWindow(800, 600)
+    .pause(500)
+
+    browser
+    .pause(500)
+    .click('/html/body/div/header/button[1]', function (response) {
+      console.log('response', typeof response)
+      this.assert.cssClassPresent('/html/body', 'sidebar-show')
+    })
+
+    browser
+    .pause(500)
+    .click('/html/body/div/div/div/nav/section/ul/li[1]/div/a', function (response) {
+      console.log('response', typeof response)
+      this.assert.cssClassNotPresent('/html/body', 'sidebar-show')
+    })
+
     browser
       .pause(5000)
       .end()

tests/unit/Alerts.spec.js

@@ -0,0 +1,32 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Alerts from '@/views/notifications/Alerts'
+
+Vue.use(BootstrapVue)
+
+describe('Alerts.vue', () => {
+  it('has a name', () => {
+    expect(Alerts.name).toMatch('alerts')
+  })
+  it('has a created hook', () => {
+    expect(typeof Alerts.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Alerts.data).toMatch('function')
+    const defaultData = Alerts.data()
+    expect(defaultData.showDismissibleAlert).toBe(false)
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Alerts)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Alerts', () => {
+    const wrapper = shallowMount(Alerts)
+    expect(wrapper.is(Alerts)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Alerts)
+    expect(wrapper.find('header.card-header > div').text()).toMatch('Bootstrap Alert docs')
+  })
+})

tests/unit/App.spec.js

@@ -0,0 +1,11 @@
+import Vue from 'vue'
+import BootstrapVue from 'bootstrap-vue'
+import App from '@/App'
+
+Vue.use(BootstrapVue)
+
+describe('App.vue', () => {
+  it('has a name', () => {
+    expect(App.name).toMatch('app')
+  })
+})

tests/unit/Badges.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Badges from '@/views/notifications/Badges'
+
+Vue.use(BootstrapVue)
+
+describe('Badges.vue', () => {
+  it('has a name', () => {
+    expect(Badges.name).toMatch('badges')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Badges)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Badges', () => {
+    const wrapper = shallowMount(Badges)
+    expect(wrapper.is(Badges)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Badges)
+    expect(wrapper.find('header.card-header > div').text()).toMatch('Bootstrap Badge docs')
+  })
+})

tests/unit/BrandButtons.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import BrandButtons from '@/views/buttons/BrandButtons'
+
+Vue.use(BootstrapVue)
+
+describe('BrandButtons.vue', () => {
+  it('has a name', () => {
+    expect(BrandButtons.name).toMatch('brand-buttons')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(BrandButtons)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is BrandButtons', () => {
+    const wrapper = shallowMount(BrandButtons)
+    expect(wrapper.is(BrandButtons)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(BrandButtons)
+    expect(wrapper.find('div.card-header > div > strong').text()).toMatch('Brand Button')
+  })
+})

tests/unit/Breadcrumbs.spec.js

@@ -0,0 +1,32 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Breadcrumbs from '@/views/base/Breadcrumbs'
+
+Vue.use(BootstrapVue)
+
+describe('Breadcrumbs.vue', () => {
+  it('has a name', () => {
+    expect(Breadcrumbs.name).toMatch('breadcrumbs')
+  })
+  it('has a created hook', () => {
+    expect(typeof Breadcrumbs.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Breadcrumbs.data).toMatch('function')
+    const defaultData = Breadcrumbs.data()
+    expect(typeof defaultData.items).toMatch('object')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Breadcrumbs)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Breadcrumbs', () => {
+    const wrapper = shallowMount(Breadcrumbs)
+    expect(wrapper.is(Breadcrumbs)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Breadcrumbs)
+    expect(wrapper.find('header.card-header > div > strong').text()).toMatch('Bootstrap Breadcrumb')
+  })
+})

tests/unit/ButtonDropdowns.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Dropdowns from '@/views/buttons/Dropdowns'
+
+Vue.use(BootstrapVue)
+
+describe('Dropdowns.vue', () => {
+  it('has a name', () => {
+    expect(Dropdowns.name).toMatch('dropdowns')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Dropdowns)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Dropdowns', () => {
+    const wrapper = shallowMount(Dropdowns)
+    expect(wrapper.is(Dropdowns)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Dropdowns)
+    expect(wrapper.find('header.card-header > div > strong').text()).toMatch('Bootstrap Dropdown')
+  })
+})

tests/unit/ButtonGroups.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import ButtonGroups from '@/views/buttons/ButtonGroups'
+
+Vue.use(BootstrapVue)
+
+describe('ButtonGroups.vue', () => {
+  it('has a name', () => {
+    expect(ButtonGroups.name).toMatch('button-groups')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(ButtonGroups)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is ButtonGroups', () => {
+    const wrapper = shallowMount(ButtonGroups)
+    expect(wrapper.is(ButtonGroups)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(ButtonGroups)
+    expect(wrapper.find('header.card-header').text()).toMatch('Bootstrap button group')
+  })
+})

tests/unit/Cards.spec.js

@@ -0,0 +1,32 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Cards from '@/views/base/Cards'
+
+Vue.use(BootstrapVue)
+
+describe('Cards.vue', () => {
+  it('has a name', () => {
+    expect(Cards.name).toMatch('cards')
+  })
+  it('has a created hook', () => {
+    expect(typeof Cards.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Cards.data).toMatch('function')
+    const defaultData = Cards.data()
+    expect(defaultData.show).toBe(true)
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Cards)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Cards', () => {
+    const wrapper = shallowMount(Cards)
+    expect(wrapper.is(Cards)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Cards)
+    expect(wrapper.find('div.card-header > div').text()).toMatch('Card title')
+  })
+})

tests/unit/Carousels.spec.js

@@ -0,0 +1,32 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Carousels from '@/views/base/Carousels'
+
+Vue.use(BootstrapVue)
+
+describe('Carousels.vue', () => {
+  it('has a name', () => {
+    expect(Carousels.name).toMatch('carousels')
+  })
+  it('has a created hook', () => {
+    expect(typeof Carousels.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Carousels.data).toMatch('function')
+    const defaultData = Carousels.data()
+    expect(defaultData.slide).toBe(0)
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Carousels)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Carousels', () => {
+    const wrapper = shallowMount(Carousels)
+    expect(wrapper.is(Carousels)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Carousels)
+    expect(wrapper.find('header.card-header > div > strong').text()).toMatch('Bootstrap Carousel')
+  })
+})

tests/unit/Charts.spec.js

@@ -0,0 +1,20 @@
+import Vue from 'vue'
+import { shallowMount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Charts from '@/views/Charts'
+
+Vue.use(BootstrapVue)
+
+describe('Charts.vue', () => {
+  it('has a name', () => {
+    expect(Charts.name).toMatch('charts')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Charts)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Charts', () => {
+    const wrapper = shallowMount(Charts)
+    expect(wrapper.is(Charts)).toBe(true)
+  })
+})

tests/unit/Collapses.spec.js

@@ -0,0 +1,32 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Collapses from '@/views/base/Collapses'
+
+Vue.use(BootstrapVue)
+
+describe('Collapses.vue', () => {
+  it('has a name', () => {
+    expect(Collapses.name).toMatch('collapses')
+  })
+  it('has a created hook', () => {
+    expect(typeof Collapses.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Collapses.data).toMatch('function')
+    const defaultData = Collapses.data()
+    expect(defaultData.showCollapse).toBe(true)
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Collapses)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Collapses', () => {
+    const wrapper = shallowMount(Collapses)
+    expect(wrapper.is(Collapses)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Collapses)
+    expect(wrapper.find('header.card-header > div > strong').text()).toMatch('Bootstrap Collapse')
+  })
+})

tests/unit/Colors.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Colors from '@/views/theme/Colors'
+
+Vue.use(BootstrapVue)
+
+describe('Colors.vue', () => {
+  it('has a name', () => {
+    expect(Colors.name).toMatch('colors')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Colors)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Colors', () => {
+    const wrapper = shallowMount(Colors)
+    expect(wrapper.is(Colors)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Colors)
+    expect(wrapper.find('header.card-header > div').text()).toMatch('Theme colors')
+  })
+})

tests/unit/CoreUIIcons.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import CoreUIIcons from '@/views/icons/CoreUIIcons'
+
+Vue.use(BootstrapVue)
+
+describe('CoreUIIcons.vue', () => {
+  it('has a name', () => {
+    expect(CoreUIIcons.name).toMatch('CoreUIIcons')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(CoreUIIcons)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is CoreUIIcons', () => {
+    const wrapper = shallowMount(CoreUIIcons)
+    expect(wrapper.is(CoreUIIcons)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(CoreUIIcons)
+    expect(wrapper.find('div.card-header').text()).toMatch('CoreUI Icons New')
+  })
+})

tests/unit/Dashboard.spec.js

@@ -6,6 +6,9 @@ import Dashboard from '@/views/Dashboard'
 Vue.use(BootstrapVue)
 
 describe('Dashboard.vue', () => {
+  it('has a name', () => {
+    expect(Dashboard.name).toMatch('dashboard')
+  })
   it('has a created hook', () => {
     expect(typeof Dashboard.data).toMatch('function')
   })
@@ -22,8 +25,8 @@ describe('Dashboard.vue', () => {
     const wrapper = shallowMount(Dashboard)
     expect(wrapper.is(Dashboard)).toBe(true)
   })
-  // it('should render correct content', () => {
+  it('should render correct content', () => {
-  //   const wrapper = shallowMount(Dashboard)
+    const wrapper = shallowMount(Dashboard)
-  //   expect(wrapper.find('h4 > #traffic').text()).toMatch('Traffic')
+    expect(wrapper.find('#traffic').text()).toMatch('Traffic')
-  // })
+  })
 })

tests/unit/DefaultAside.spec.js

@@ -0,0 +1,11 @@
+import Vue from 'vue'
+import BootstrapVue from 'bootstrap-vue'
+import DefaultAside from '@/containers/DefaultAside'
+
+Vue.use(BootstrapVue)
+
+describe('DefaultAside.vue', () => {
+  it('has a name', () => {
+    expect(DefaultAside.name).toMatch('DefaultAside')
+  })
+})

tests/unit/DefaultContainer.spec.js

@@ -0,0 +1,19 @@
+import Vue from 'vue'
+import BootstrapVue from 'bootstrap-vue'
+import DefaultContainer from '@/containers/DefaultContainer'
+
+Vue.use(BootstrapVue)
+
+describe('DefaultContainer.vue', () => {
+  it('has a name', () => {
+    expect(DefaultContainer.name).toMatch('full')
+  })
+  it('has a created hook', () => {
+    expect(typeof DefaultContainer.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof DefaultContainer.data).toMatch('function')
+    const defaultData = DefaultContainer.data()
+    expect(typeof defaultData.nav).toMatch('object')
+  })
+})

tests/unit/DefaultHeaderDropdownAccnt.spec.js

@@ -0,0 +1,19 @@
+import Vue from 'vue'
+import BootstrapVue from 'bootstrap-vue'
+import DefaultHeaderDropdownAccnt from '@/containers/DefaultHeaderDropdownAccnt'
+
+Vue.use(BootstrapVue)
+
+describe('DefaultHeaderDropdownAccnt.vue', () => {
+  it('has a name', () => {
+    expect(DefaultHeaderDropdownAccnt.name).toMatch('DefaultHeaderDropdownAccnt')
+  })
+  it('has a created hook', () => {
+    expect(typeof DefaultHeaderDropdownAccnt.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof DefaultHeaderDropdownAccnt.data).toMatch('function')
+    const defaultData = DefaultHeaderDropdownAccnt.data()
+    expect(defaultData.itemsCount).toBe(42)
+  })
+})

tests/unit/Flags.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Flags from '@/views/icons/Flags'
+
+Vue.use(BootstrapVue)
+
+describe('Flags.vue', () => {
+  it('has a name', () => {
+    expect(Flags.name).toMatch('flags')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Flags)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Flags', () => {
+    const wrapper = shallowMount(Flags)
+    expect(wrapper.is(Flags)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Flags)
+    expect(wrapper.find('div.card-header').text()).toMatch('Flags')
+  })
+})

tests/unit/FontAwesome.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import FontAwesome from '@/views/icons/FontAwesome'
+
+Vue.use(BootstrapVue)
+
+describe('FontAwesome.vue', () => {
+  it('has a name', () => {
+    expect(FontAwesome.name).toMatch('font-awesome')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(FontAwesome)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is FontAwesome', () => {
+    const wrapper = shallowMount(FontAwesome)
+    expect(wrapper.is(FontAwesome)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(FontAwesome)
+    expect(wrapper.find('div.card-header').text()).toMatch('50 New Icons in 4.7')
+  })
+})

tests/unit/Forms.spec.js

@@ -0,0 +1,32 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Forms from '@/views/base/Forms'
+
+Vue.use(BootstrapVue)
+
+describe('Forms.vue', () => {
+  it('has a name', () => {
+    expect(Forms.name).toMatch('forms')
+  })
+  it('has a created hook', () => {
+    expect(typeof Forms.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Forms.data).toMatch('function')
+    const defaultData = Forms.data()
+    expect(defaultData.show).toBe(true)
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Forms)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Forms', () => {
+    const wrapper = shallowMount(Forms)
+    expect(wrapper.is(Forms)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Forms)
+    expect(wrapper.find('div.card-header > div > strong').text()).toMatch('Credit Card')
+  })
+})

tests/unit/Jumbotrons.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Jumbotrons from '@/views/base/Jumbotrons'
+
+Vue.use(BootstrapVue)
+
+describe('Jumbotrons.vue', () => {
+  it('has a name', () => {
+    expect(Jumbotrons.name).toMatch('jumbotrons')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Jumbotrons)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Jumbotrons', () => {
+    const wrapper = shallowMount(Jumbotrons)
+    expect(wrapper.is(Jumbotrons)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Jumbotrons)
+    expect(wrapper.find('header.card-header > div > strong').text()).toMatch('Bootstrap Jumbotron')
+  })
+})

tests/unit/ListGroups.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import ListGroups from '@/views/base/ListGroups'
+
+Vue.use(BootstrapVue)
+
+describe('ListGroups.vue', () => {
+  it('has a name', () => {
+    expect(ListGroups.name).toMatch('list-groups')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(ListGroups)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is ListGroups', () => {
+    const wrapper = shallowMount(ListGroups)
+    expect(wrapper.is(ListGroups)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(ListGroups)
+    expect(wrapper.find('header.card-header > div > strong').text()).toMatch('Bootstrap list group')
+  })
+})

tests/unit/Login.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Login from '@/views/Pages/Login'
+
+Vue.use(BootstrapVue)
+
+describe('Login.vue', () => {
+  it('has a name', () => {
+    expect(Login.name).toMatch('Login')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Login)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Login', () => {
+    const wrapper = shallowMount(Login)
+    expect(wrapper.is(Login)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = shallowMount(Login)
+    expect(wrapper.find('h1').text()).toMatch('Login')
+  })
+})

tests/unit/Modals.spec.js

@@ -0,0 +1,32 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Modals from '@/views/notifications/Modals'
+
+Vue.use(BootstrapVue)
+
+describe('Modals.vue', () => {
+  it('has a name', () => {
+    expect(Modals.name).toMatch('modals')
+  })
+  it('has a created hook', () => {
+    expect(typeof Modals.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Modals.data).toMatch('function')
+    const defaultData = Modals.data()
+    expect(defaultData.largeModal).toBe(false)
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Modals)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Modals', () => {
+    const wrapper = shallowMount(Modals)
+    expect(wrapper.is(Modals)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Modals)
+    expect(wrapper.find('div.card-header > div').text()).toMatch('Bootstrap Modals')
+  })
+})

tests/unit/Navbars.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Navbars from '@/views/base/Navbars'
+
+Vue.use(BootstrapVue)
+
+describe('Navbars.vue', () => {
+  it('has a name', () => {
+    expect(Navbars.name).toMatch('navbars')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Navbars)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Navbars', () => {
+    const wrapper = shallowMount(Navbars)
+    expect(wrapper.is(Navbars)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Navbars)
+    expect(wrapper.find('header.card-header > div > strong').text()).toMatch('Bootstrap Navbar')
+  })
+})

tests/unit/Navs.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Navs from '@/views/base/Navs'
+
+Vue.use(BootstrapVue)
+
+describe('Navs.vue', () => {
+  it('has a name', () => {
+    expect(Navs.name).toMatch('navs')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Navs)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Navbars', () => {
+    const wrapper = shallowMount(Navs)
+    expect(wrapper.is(Navs)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Navs)
+    expect(wrapper.find('header.card-header > div > strong').text()).toMatch('Bootstrap Navs')
+  })
+})

tests/unit/Page404.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Page404 from '@/views/Pages/Page404'
+
+Vue.use(BootstrapVue)
+
+describe('Page404.vue', () => {
+  it('has a name', () => {
+    expect(Page404.name).toMatch('Page404')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Page404)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Page500', () => {
+    const wrapper = shallowMount(Page404)
+    expect(wrapper.is(Page404)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = shallowMount(Page404)
+    expect(wrapper.find('h1').text()).toMatch('404')
+  })
+})

tests/unit/Page500.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Page500 from '@/views/Pages/Page500'
+
+Vue.use(BootstrapVue)
+
+describe('Page500.vue', () => {
+  it('has a name', () => {
+    expect(Page500.name).toMatch('Page500')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Page500)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Page500', () => {
+    const wrapper = shallowMount(Page500)
+    expect(wrapper.is(Page500)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = shallowMount(Page500)
+    expect(wrapper.find('h1').text()).toMatch('500')
+  })
+})

tests/unit/Paginations.spec.js

@@ -0,0 +1,32 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Paginations from '@/views/base/Paginations'
+
+Vue.use(BootstrapVue)
+
+describe('Paginations.vue', () => {
+  it('has a name', () => {
+    expect(Paginations.name).toMatch('paginations')
+  })
+  it('has a created hook', () => {
+    expect(typeof Paginations.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Paginations.data).toMatch('function')
+    const defaultData = Paginations.data()
+    expect(defaultData.currentPage).toBe(3)
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Paginations)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Paginations', () => {
+    const wrapper = shallowMount(Paginations)
+    expect(wrapper.is(Paginations)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Paginations)
+    expect(wrapper.find('header.card-header > div > strong').text()).toMatch('Bootstrap Pagination')
+  })
+})

tests/unit/Popovers.spec.js

@@ -0,0 +1,32 @@
+import Vue from 'vue'
+import { mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Popovers from '@/views/base/Popovers'
+
+Vue.use(BootstrapVue)
+
+describe('Popovers.vue', () => {
+  it('has a name', () => {
+    expect(Popovers.name).toMatch('popovers')
+  })
+  it('has a created hook', () => {
+    expect(typeof Popovers.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Popovers.data).toMatch('function')
+    const defaultData = Popovers.data()
+    expect(defaultData.show).toBe(false)
+  })
+  it('is Vue instance', () => {
+    const wrapper = mount(Popovers)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Popovers', () => {
+    const wrapper = mount(Popovers)
+    expect(wrapper.is(Popovers)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Popovers)
+    expect(wrapper.find('header.card-header > div > strong').text()).toMatch('Bootstrap Popovers')
+  })
+})

tests/unit/ProgressBars.spec.js

@@ -0,0 +1,32 @@
+import Vue from 'vue'
+import { mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import ProgressBars from '@/views/base/ProgressBars'
+
+Vue.use(BootstrapVue)
+
+describe('ProgressBars.vue', () => {
+  it('has a name', () => {
+    expect(ProgressBars.name).toMatch('progress-bars')
+  })
+  it('has a created hook', () => {
+    expect(typeof ProgressBars.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof ProgressBars.data).toMatch('function')
+    const defaultData = ProgressBars.data()
+    expect(defaultData.counter).toBe(45)
+  })
+  it('is Vue instance', () => {
+    const wrapper = mount(ProgressBars)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is ProgressBars', () => {
+    const wrapper = mount(ProgressBars)
+    expect(wrapper.is(ProgressBars)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(ProgressBars)
+    expect(wrapper.find('header.card-header > div > strong').text()).toMatch('Bootstrap Progress')
+  })
+})

tests/unit/Register.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Register from '@/views/Pages/Register'
+
+Vue.use(BootstrapVue)
+
+describe('Register.vue', () => {
+  it('has a name', () => {
+    expect(Register.name).toMatch('Register')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Register)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Register', () => {
+    const wrapper = shallowMount(Register)
+    expect(wrapper.is(Register)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = shallowMount(Register)
+    expect(wrapper.find('h1').text()).toMatch('Register')
+  })
+})

tests/unit/SimpleLineIcons.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import SimpleLineIcons from '@/views/icons/SimpleLineIcons'
+
+Vue.use(BootstrapVue)
+
+describe('SimpleLineIcons.vue', () => {
+  it('has a name', () => {
+    expect(SimpleLineIcons.name).toMatch('simple-line-icons')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(SimpleLineIcons)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is SimpleLineIcons', () => {
+    const wrapper = shallowMount(SimpleLineIcons)
+    expect(wrapper.is(SimpleLineIcons)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(SimpleLineIcons)
+    expect(wrapper.find('div.card-header').text()).toMatch('Simple Line Icons')
+  })
+})

tests/unit/StandardButtons.spec.js

@@ -0,0 +1,33 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import StandardButtons from '@/views/buttons/StandardButtons'
+
+Vue.use(BootstrapVue)
+
+describe('StandardButtons.vue', () => {
+  it('has a name', () => {
+    expect(StandardButtons.name).toMatch('standard-buttons')
+  })
+  it('has a created hook', () => {
+    expect(typeof StandardButtons.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof StandardButtons.data).toMatch('function')
+    const defaultData = StandardButtons.data()
+    expect(defaultData.togglePress).toBe(false)
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(StandardButtons)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is StandardButtons', () => {
+    const wrapper = shallowMount(StandardButtons)
+    expect(wrapper.is(StandardButtons)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(StandardButtons)
+    expect(wrapper.find('div.card-header > strong').text()).toMatch('Standard buttons')
+    expect(wrapper.find('div.card-header > div > strong').text()).toMatch('Toggle pressed state')
+  })
+})

tests/unit/Switches.spec.js

@@ -0,0 +1,33 @@
+import Vue from 'vue'
+import { mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Switches from '@/views/base/Switches'
+
+Vue.use(BootstrapVue)
+
+describe('Switches.vue', () => {
+  it('has a name', () => {
+    expect(Switches.name).toMatch('switches')
+  })
+  it('has a created hook', () => {
+    expect(typeof Switches.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Switches.data).toMatch('function')
+    const defaultData = Switches.data()
+    expect(typeof defaultData.fields).toMatch('object')
+    expect(defaultData.checker).toMatch('yes')
+  })
+  it('is Vue instance', () => {
+    const wrapper = mount(Switches)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Switches', () => {
+    const wrapper = mount(Switches)
+    expect(wrapper.is(Switches)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Switches)
+    expect(wrapper.find('div.card-header > div').text()).toMatch('Switch default')
+  })
+})

tests/unit/Table.spec.js

@@ -0,0 +1,32 @@
+import Vue from 'vue'
+import { mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Table from '@/views/base/Table'
+
+Vue.use(BootstrapVue)
+
+describe('Table.vue', () => {
+  it('has a name', () => {
+    expect(Table.name).toMatch('c-table')
+  })
+  it('has a created hook', () => {
+    expect(typeof Table.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Table.data).toMatch('function')
+    const defaultData = Table.data()
+    expect(defaultData.currentPage).toBe(1)
+  })
+  it('is Vue instance', () => {
+    const wrapper = mount(Table)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Table', () => {
+    const wrapper = mount(Table)
+    expect(wrapper.is(Table)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Table)
+    expect(wrapper.find('div.card-header > div').text()).toMatch('Table')
+  })
+})

tests/unit/Tables.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Tables from '@/views/base/Tables'
+
+Vue.use(BootstrapVue)
+
+describe('Tables.vue', () => {
+  it('has a name', () => {
+    expect(Tables.name).toMatch('tables')
+  })
+  it('is Vue instance', () => {
+    const wrapper = mount(Tables)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Tables', () => {
+    const wrapper = mount(Tables)
+    expect(wrapper.is(Tables)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Tables)
+    expect(wrapper.find('div.card-header > div').text()).toMatch('Simple Table')
+  })
+})

tests/unit/Tabs.spec.js

@@ -0,0 +1,33 @@
+import Vue from 'vue'
+import { mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Tabs from '@/views/base/Tabs'
+
+Vue.use(BootstrapVue)
+
+describe('Tabs.vue', () => {
+  it('has a name', () => {
+    expect(Tabs.name).toMatch('tabs')
+  })
+  it('has a created hook', () => {
+    expect(typeof Tabs.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Tabs.data).toMatch('function')
+    const defaultData = Tabs.data()
+    expect(defaultData.tabs).toEqual(["Calculator", "Shopping cart", "Charts"])
+    expect(defaultData.tabIndex).toEqual([0, 0])
+  })
+  it('is Vue instance', () => {
+    const wrapper = mount(Tabs)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Tabs', () => {
+    const wrapper = mount(Tabs)
+    expect(wrapper.is(Tabs)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Tabs)
+    expect(wrapper.find('div.card-header > div').text()).toMatch('Tabs')
+  })
+})

tests/unit/Tooltips.spec.js

@@ -0,0 +1,33 @@
+import Vue from 'vue'
+import { mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Tooltips from '@/views/base/Tooltips'
+
+Vue.use(BootstrapVue)
+
+describe('Tooltips.vue', () => {
+  it('has a name', () => {
+    expect(Tooltips.name).toMatch('tooltips')
+  })
+  it('has a created hook', () => {
+    expect(typeof Tooltips.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Tooltips.data).toMatch('function')
+    const defaultData = Tooltips.data()
+    expect(defaultData.show).toBe(true)
+    expect(defaultData.disabled).toBe(false)
+  })
+  it('is Vue instance', () => {
+    const wrapper = mount(Tooltips)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Tooltips', () => {
+    const wrapper = mount(Tooltips)
+    expect(wrapper.is(Tooltips)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = mount(Tooltips)
+    expect(wrapper.find('header.card-header > div > strong').text()).toMatch('Bootstrap Tooltips')
+  })
+})

tests/unit/Typography.spec.js

@@ -0,0 +1,24 @@
+import Vue from 'vue'
+import { shallowMount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Typography from '@/views/theme/Typography'
+
+Vue.use(BootstrapVue)
+
+describe('Typography.vue', () => {
+  it('has a name', () => {
+    expect(Typography.name).toMatch('typography')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Typography)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Typography', () => {
+    const wrapper = shallowMount(Typography)
+    expect(wrapper.is(Typography)).toBe(true)
+  })
+  it('should render correct content', () => {
+    const wrapper = shallowMount(Typography)
+    expect(wrapper.find('.card-header').text()).toMatch('Headings')
+  })
+})

tests/unit/Users.spec.js

@@ -0,0 +1,35 @@
+import Vue from 'vue'
+import { shallowMount, mount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Users from '@/views/users/Users'
+
+Vue.use(BootstrapVue)
+
+describe('Users.vue', () => {
+  it('has a name', () => {
+    expect(Users.name).toMatch('Users')
+  })
+  it('has a created hook', () => {
+    expect(typeof Users.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Users.data).toMatch('function')
+    const defaultData = Users.data()
+    expect(defaultData.currentPage).toBe(1)
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Users)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Users', () => {
+    const wrapper = shallowMount(Users)
+    expect(wrapper.is(Users)).toBe(true)
+  })
+  it('renders props.caption when passed', () => {
+    const caption = 'Users List'
+    const wrapper = mount(Users, {
+      propsData: { caption }
+    })
+    expect(wrapper.find('div.card-header > div').text()).toMatch(caption)
+  })
+})

tests/unit/Widgets.spec.js

@@ -0,0 +1,28 @@
+import Vue from 'vue'
+import { shallowMount } from '@vue/test-utils'
+import BootstrapVue from 'bootstrap-vue'
+import Widgets from '@/views/Widgets'
+
+Vue.use(BootstrapVue)
+
+describe('Widgets.vue', () => {
+  it('has a name', () => {
+    expect(Widgets.name).toMatch('widgets')
+  })
+  it('has a created hook', () => {
+    expect(typeof Widgets.data).toMatch('function')
+  })
+  it('sets the correct default data', () => {
+    expect(typeof Widgets.data).toMatch('function')
+    const defaultData = Widgets.data()
+    expect(defaultData.msg).toMatch('Widgets')
+  })
+  it('is Vue instance', () => {
+    const wrapper = shallowMount(Widgets)
+    expect(wrapper.isVueInstance()).toBe(true)
+  })
+  it('is Widgets', () => {
+    const wrapper = shallowMount(Widgets)
+    expect(wrapper.is(Widgets)).toBe(true)
+  })
+})