From 0cfe2440bdf3cea0296affed693df1af68434cc9 Mon Sep 17 00:00:00 2001
From: Pawel Szafranski <pawel.szafranski@snow.dog>
Date: Fri, 24 Aug 2018 15:45:30 +0200
Subject: [PATCH] #97 - basic test for ShippingStep component

---
 test/ShippingMethods.test.js                 |  1 +
 test/ShippingStep.test.js                    | 58 ++++++++++++++++++++
 test/__snapshots__/ShippingStep.test.js.snap | 48 ++++++++++++++++
 3 files changed, 107 insertions(+)
 create mode 100644 test/ShippingStep.test.js
 create mode 100644 test/__snapshots__/ShippingStep.test.js.snap

diff --git a/test/ShippingMethods.test.js b/test/ShippingMethods.test.js
index f1009c3..6f59cab 100644
--- a/test/ShippingMethods.test.js
+++ b/test/ShippingMethods.test.js
@@ -35,6 +35,7 @@ describe('ShippingMethods.test.js', () => {
     mutations = {
       setItem: jest.fn()
     }
+
     store = new Vuex.Store({
       mutations
     })
diff --git a/test/ShippingStep.test.js b/test/ShippingStep.test.js
new file mode 100644
index 0000000..6b4bef2
--- /dev/null
+++ b/test/ShippingStep.test.js
@@ -0,0 +1,58 @@
+import Vuex from 'vuex'
+import { shallowMount, createLocalVue } from '@vue/test-utils'
+import TheShippingStep from '../view/frontend/web/js/components/steps/TheShippingStep.vue'
+import VeeValidate from 'vee-validate'
+
+const localVue = createLocalVue()
+localVue.use(Vuex)
+localVue.use(VeeValidate)
+
+describe('TheShippingStep.test.js', () => {
+  let store
+  let mutations
+  let wrapper
+
+  beforeEach(() => {
+    mutations = {
+      setItem: jest.fn()
+    }
+
+    store = new Vuex.Store({
+      mutations
+    })
+
+    wrapper = shallowMount(TheShippingStep, {
+      data: () => ({
+        customer: {
+          email: 'test@test.com',
+          emailAvailable: false
+        }
+      }),
+      computed: {
+        baseUrl: () => 'http://localhost/',
+        step: () => 'shipping',
+        shippingMethods: () => []
+      },
+      store,
+      localVue
+    })
+  })
+
+  // it('commits a setItem (setCustomerEmail) when a button is clicked', () => {
+  //   wrapper
+  //     .find(`.ddd`)
+  //     .trigger('click')
+
+  //   console.log(wrapper.find('.ddd'))
+  //   console.log('dddd')
+  //   expect(mutations.setItem.mock.calls).toHaveLength(1)
+  //   expect(mutations.setItem.mock.calls[0][1]).toEqual({
+  //     item: 'setCustomerEmail',
+  //     value: 'test@test.com'
+  //   })
+  // })
+
+  it('has the expected html structure', () => {
+    expect(wrapper.element).toMatchSnapshot()
+  })
+})
diff --git a/test/__snapshots__/ShippingStep.test.js.snap b/test/__snapshots__/ShippingStep.test.js.snap
new file mode 100644
index 0000000..86f61c4
--- /dev/null
+++ b/test/__snapshots__/ShippingStep.test.js.snap
@@ -0,0 +1,48 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`TheShippingStep.test.js has the expected html structure 1`] = `
+<section
+  class="shipping-address"
+>
+  <h1>
+    
+    Shipping Step
+  
+  </h1>
+   
+  <hr />
+   
+  <h2>
+    
+    Shipping address
+  
+  </h2>
+   
+  <form
+    class="shipping-address__form"
+  >
+    <baseinput-stub />
+     
+    <span>
+      
+            You already have an account with us.
+            Sign in 
+      <a
+        href="http://localhost/customer/account/login/"
+      >
+        here
+      </a>
+       or continue as guest.
+          
+    </span>
+     
+    <hr />
+     
+    <addressfields-stub />
+     
+    <shippingmethods-stub />
+     
+    <basebutton-stub />
+  </form>
+</section>
+`;