#97 - basic test for ShippingStep component

test/ShippingMethods.test.js

@@ -35,6 +35,7 @@ describe('ShippingMethods.test.js', () => {
     mutations = {
       setItem: jest.fn()
     }
+
     store = new Vuex.Store({
       mutations
     })

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: '[email protected]',
+          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: '[email protected]'
+  //   })
+  // })
+
+  it('has the expected html structure', () => {
+    expect(wrapper.element).toMatchSnapshot()
+  })
+})

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>
+`;