merge

.eslintrc.js

@@ -28,7 +28,7 @@ module.exports = {
     // allow async-await
     'generator-star-spacing': 0,
     // set maximum line characters
-    'max-len': [2, 80, 4, {'ignoreUrls': true, 'ignoreTemplateLiterals': true, 'ignoreStrings': true}],
+    'max-len': [2, 140, 4, {'ignoreUrls': true, 'ignoreTemplateLiterals': true, 'ignoreStrings': true}],
     // allow debugger during development
     'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
     'no-return-assign': 0,

package.json

@@ -18,7 +18,9 @@
     "debug-build": "node --inspect --debug-brk build/build.js",
     "test": "cross-env NODE_ENV=test jest --no-cache --verbose",
     "test-coverage": "cross-env NODE_ENV=test jest --no-cache --coverage --verbose",
-    "lint": "eslint --ext .js,.vue src"
+    "lint": "eslint --ext .js,.vue src",
+    "precommit": "yarn run lint && yarn test",
+    "prepush": "yarn run lint && yarn test"
   },
   "description": "Vue.js 2 Semantic Component Framework",
   "devDependencies": {
@@ -57,6 +59,7 @@
     "extract-text-webpack-plugin": "^3.0.0",
     "friendly-errors-webpack-plugin": "^1.6.1",
     "function-bind": "^1.0.2",
+    "husky": "^0.14.3",
     "jest": "^20.0.4",
     "jest-cli": "^20.0.4",
     "jest-css-modules": "^1.1.0",

src/components/breadcrumbs/VBreadcrumbsItem.spec.js

@@ -0,0 +1,20 @@
+import { test } from '~util/testing'
+import VBreadcrumbsItem from '~components/breadcrumbs/VBreadcrumbsItem'
+
+test('VBreadcrumbsItem.js', ({ mount }) => {
+  it('should render component and match snapshot', () => {
+    const wrapper = mount(VBreadcrumbsItem)
+
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+
+  it('should render component with custom activeClass and match snapshot', () => {
+    const wrapper = mount(VBreadcrumbsItem, {
+      propsData: {
+        activeClass: 'breadcrumbs-item--active'
+      }
+    })
+
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+})

src/components/breadcrumbs/__snapshots__/VBreadcrumbsItem.spec.js.snap

@@ -0,0 +1,23 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`VBreadcrumbsItem.js should render component and match snapshot 1`] = `
+
+<li>
+  <a href="javascript:;"
+     class="breadcrumbs__item"
+  >
+  </a>
+</li>
+
+`;
+
+exports[`VBreadcrumbsItem.js should render component with custom activeClass and match snapshot 1`] = `
+
+<li>
+  <a href="javascript:;"
+     class="breadcrumbs__item"
+  >
+  </a>
+</li>
+
+`;

src/components/buttons/VBtn.spec.js

@@ -12,7 +12,7 @@ const stub = {
   render: h => h('button')
 }
 
-describe('VBtn.vue', () => {
+describe('VBtn.js', () => {
   it('should render component and match snapshot', () => {
     const wrapper = mount(VBtn)
 

src/components/buttons/VSpeedDial.spec.js

@@ -0,0 +1,35 @@
+import VSpeedDial from '~components/buttons/VSpeedDial'
+import clickOutside from '~directives/click-outside'
+import { test } from '~util/testing'
+
+VSpeedDial.directives = {
+  clickOutside
+}
+
+test('VSpeedDial.js', ({ mount }) => {
+  it('should render component and match snapshot', () => {
+    const wrapper = mount(VSpeedDial)
+
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+
+  it('should render component with custom transition and match snapshot', () => {
+    const wrapper = mount(VSpeedDial, {
+      propsData: {
+        transition: 'dialog-transition'
+      }
+    })
+
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+
+  it('should render component with custom direction and match snapshot', () => {
+    const wrapper = mount(VSpeedDial, {
+      propsData: {
+        direction: 'right'
+      }
+    })
+
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+})

src/components/buttons/__snapshots__/VBtn.spec.js.snap

@@ -1,13 +1,13 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`VBtn.vue should render a <button> tag when using to prop 1`] = `
+exports[`VBtn.js should render a <button> tag when using to prop 1`] = `
 
 <button class="btn btn--raised">
 </button>
 
 `;
 
-exports[`VBtn.vue should render an <a> tag when using href prop 1`] = `
+exports[`VBtn.js should render an <a> tag when using href prop 1`] = `
 
 <a href="http://www.google.com"
    class="btn btn--raised"
@@ -18,7 +18,7 @@ exports[`VBtn.vue should render an <a> tag when using href prop 1`] = `
 
 `;
 
-exports[`VBtn.vue should render component and match snapshot 1`] = `
+exports[`VBtn.js should render component and match snapshot 1`] = `
 
 <button type="button"
         class="btn btn--raised"
@@ -29,7 +29,7 @@ exports[`VBtn.vue should render component and match snapshot 1`] = `
 
 `;
 
-exports[`VBtn.vue should render specified tag when using tag prop 1`] = `
+exports[`VBtn.js should render specified tag when using tag prop 1`] = `
 
 <a href="javascript:;"
    class="btn btn--raised"

src/components/buttons/__snapshots__/VSpeedDial.spec.js.snap

@@ -0,0 +1,28 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`VSpeedDial.js should render component and match snapshot 1`] = `
+
+<div class="speed-dial speed-dial--direction-top">
+  <div class="speed-dial__list">
+  </div>
+</div>
+
+`;
+
+exports[`VSpeedDial.js should render component with custom direction and match snapshot 1`] = `
+
+<div class="speed-dial speed-dial--direction-right">
+  <div class="speed-dial__list">
+  </div>
+</div>
+
+`;
+
+exports[`VSpeedDial.js should render component with custom transition and match snapshot 1`] = `
+
+<div class="speed-dial speed-dial--direction-top">
+  <div class="speed-dial__list">
+  </div>
+</div>
+
+`;

src/components/cards/VCard.spec.js

@@ -2,7 +2,6 @@ import { test } from '~util/testing'
 import VCard from '~components/cards/VCard'
 
 test('VCard.js', ({ mount, functionalContext }) => {
-// describe('VCard.vue', () => {
   it('should render component and match snapshot', () => {
     const wrapper = mount(VCard, functionalContext())
 

src/components/cards/VCardMedia.spec.js

@@ -0,0 +1,65 @@
+import { mount } from 'avoriaz'
+import VCardMedia from '~components/cards/VCardMedia'
+
+describe('VCardMedia.js', () => {
+  it('should render component and match snapshot', () => {
+    const wrapper = mount(VCardMedia)
+
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+
+  it('should render component with contained background and match snapshot', () => {
+    const wrapper = mount(VCardMedia, {
+      propsData: {
+        contain: true
+      }
+    })
+
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+
+  it('should render component with custom height (string) and match snapshot', () => {
+    const wrapper = mount(VCardMedia, {
+      propsData: {
+        height: '100px'
+      }
+    })
+
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+
+  it('should render component with custom height (number) and match snapshot', () => {
+    const wrapper = mount(VCardMedia, {
+      propsData: {
+        height: 100
+      }
+    })
+
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+
+  it('should render matching components with custom height', () => {
+    const wrapper1 = mount(VCardMedia, {
+      propsData: {
+        height: '100px'
+      }
+    })
+    const wrapper2 = mount(VCardMedia, {
+      propsData: {
+        height: 100
+      }
+    })
+
+    expect(wrapper1.html()).toEqual(wrapper2.html())
+  })
+
+  it('should render component with custom background image and match snapshot', () => {
+    const wrapper = mount(VCardMedia, {
+      propsData: {
+        src: 'https://vuetifyjs.com/static/doc-images/cards/sunshine.jpg'
+      }
+    })
+
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+})

src/components/cards/VCardTitle.spec.js

@@ -0,0 +1,20 @@
+import { test } from '~util/testing'
+import VCardTitle from '~components/cards/VCardTitle'
+
+test('VCardTitle.js', ({ mount, functionalContext }) => {
+  it('should render component and match snapshot', () => {
+    const wrapper = mount(VCardTitle, functionalContext())
+
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+
+  it('should render component with specific padding applied', () => {
+    const wrapper = mount(VCardTitle, functionalContext({
+      props: {
+        'primary-title': true
+      }
+    }))
+
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+})