Laracon US 2018 Live Blog

📢 That's it! Thank you for following along with me, and see you next year!

Samantha Geitz, Full-Stack Testing Strategies

"Jest Do It!"

👩‍💻 Code will be available on GitHub later

describe('GifGif', () => {
    it('renders', () => {
        let wrapper = mount(GifGif);
    })
});

Next...

import { shallowMount } from '@vue/test-utils';
it('updates the selected pronounciation', () => {
    // Check that the radio button updates our vue
    let wrapper = shallowMount(GifGif); // shallowMount only mounts that component
    wrapper.find('#jif').trigger('click');
    expect(wrapper.vm.picked).toBe('jif');
    wrapper.find('#gif').trigger('click');
    expect(wrapper.vm.picked).toBe('gif');
});
it('submits a vote', () => {
    let vote = {
        picked: 'gif',
        reason: 'Because',
        name: 'Samantha'
    };

    // trigger the radio button of pronounciation
    wrapper.find('#gif').trigger('click');
    expect(wrapper.vm.picked).toBe('gif');

    // update the reason input
    wrapper.find('#reason').trigger('click');
    expect(wrapper.vm.picked).toBe('gif');

    // update the name input

    // Click the submit button

    // Check that the vote is added to votes

    // Check that the vote is rendered somewhere
});
it('submits a vote', () => {
    let vote = {
        picked: 'gif',
        reason: 'Because',
        name: 'Samantha'
    };

    expect(wrapper.vm.votes.length).toBe(0);

    // trigger the radio button of pronounciation
    wrapper.find('#gif').trigger('click');
    expect(wrapper.vm.picked).toBe('gif');

    // update the reason input
    let reason = wrapper.find('#reason')
    reason.element.value = 'Because'
    reason.trigger('input')
    expect(wrapper.vm.newVote.reason).toBe('Because');

    // update the name input
    let name = wrapper.find('#name')
    name.element.value = 'Because'
    name.trigger('input')
    expect(wrapper.vm.newVote.name).toBe('Because');

    // Click the submit button
    wrapper.find('#submit').trigger('click')

    // Check that the vote is added to votes
    expect(wrapper.vm.votes.length).toBe(1);

    // Check that the vote is rendered somewhere
});

Finally, let's try and test from the API

Post to a votes route, pretty basic

axios.post('/api/votes', this.newVote).then(() => {
    this.votes.push(this.newVote)
    this.newVote = {
        picked: '',
        reason: '',
        name: ''
    }
});

Current Talk

Wednesday, July 25, 2018
Adam WathanFreek Van der HertenJason FriedSamantha GeitzJason McCrearyEvan YouTaylor Otwell

Thursday, July 26, 2018
Jocelyn GleiMatt StaufferRyan HolidayTJ MillerWes BosColin DeCarloCaleb PorzioBob Martin