Basic unit tests

Author: Łukasz Florczak

src/mixins/preparations.js

@@ -48,6 +48,10 @@ const mixin = {
 		 *  Prepare slides active/current classes
 		 */
 		prepareSlidesClasses () {
+			if (this.currentSlide === null) {
+				return false
+			}
+
 			// Remove active & current classes
 			for (let i = 0; i < this.slidesCount; i++) {
 				this.slides[i].classList.remove('agile__slide--active')
@@ -84,7 +88,7 @@ const mixin = {
 			if (this.settings.unagile) {
 				this.translateX = 0
 			} else {
-				if (this.currentSlide === null) {
+				if (this.currentSlide === null && this.slidesCount) {
 					this.currentSlide = this.settings.initialSlide
 				}
 

tests/unit/example.spec.js

@@ -0,0 +1,2 @@
+const testsContext = require.context('./specs', true, /\.spec$/)
+testsContext.keys().forEach(testsContext)

tests/unit/index.js

@@ -0,0 +1,37 @@
+import { expect } from 'chai'
+import { shallowMount } from '@vue/test-utils'
+import Agile from '@/Agile.vue'
+
+const slides = '<div>1</div><div>2</div><div>3</div><div>4</div><div>5</div><div>6</div>'
+
+describe('Events emitting:', () => {
+	describe('@afterChange', () => {
+		it('should be called after a current slide changes', async () => {
+			const wrapper = shallowMount(Agile, {
+				slots: {
+					default: slides
+				}
+			})
+
+			const nextButton = wrapper.find({ ref: 'nextButton' })
+			await nextButton.trigger('click')
+
+			expect(wrapper.emitted().afterChange).to.deep.equal([[{ currentSlide: 1 }]])
+		})
+	})
+
+	describe('@beforeChange', () => {
+		it('should be called before a current slide changes', () => {
+			const wrapper = shallowMount(Agile, {
+				slots: {
+					default: slides
+				}
+			})
+
+			const nextButton = wrapper.find({ ref: 'nextButton' })
+			nextButton.trigger('click')
+
+			expect(wrapper.emitted().beforeChange).to.deep.equal([[{ currentSlide: 0, nextSlide: 1 }]])
+		})
+	})
+})

tests/unit/specs/events.spec.js

@@ -0,0 +1,16 @@
+import { expect } from 'chai'
+import { shallowMount } from '@vue/test-utils'
+import Agile from '@/Agile.vue'
+
+describe('Renders:', () => {
+	it('should render nav buttons', () => {
+		const wrapper = shallowMount(Agile, {
+			slots: {
+				prevButton: 'prev',
+				nextButton: 'next'
+			}
+		})
+		expect(wrapper.text()).to.include('prev')
+		expect(wrapper.text()).to.include('next')
+	})
+})