From 0e619d01b0fbe3234f7983b9f012bb25715e142a Mon Sep 17 00:00:00 2001 From: Winnie Hellmann Date: Wed, 20 Feb 2019 21:09:04 +0100 Subject: [PATCH 1/5] Move discussion_jump_to_next_button_spec.js to Jest --- .../notes/components/discussion_jump_to_next_button_spec.js | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename spec/{javascripts => frontend}/notes/components/discussion_jump_to_next_button_spec.js (100%) diff --git a/spec/javascripts/notes/components/discussion_jump_to_next_button_spec.js b/spec/frontend/notes/components/discussion_jump_to_next_button_spec.js similarity index 100% rename from spec/javascripts/notes/components/discussion_jump_to_next_button_spec.js rename to spec/frontend/notes/components/discussion_jump_to_next_button_spec.js From 8d74aab4289fb7a050e0163bf1affa9e62bb079e Mon Sep 17 00:00:00 2001 From: Winnie Hellmann Date: Wed, 20 Feb 2019 21:26:44 +0100 Subject: [PATCH 2/5] Load i18n Vue plugin for Jest tests --- spec/frontend/test_setup.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/spec/frontend/test_setup.js b/spec/frontend/test_setup.js index 4e4dd72a799..d892889b98d 100644 --- a/spec/frontend/test_setup.js +++ b/spec/frontend/test_setup.js @@ -1,3 +1,5 @@ +import Vue from 'vue'; +import Translate from '~/vue_shared/translate'; import axios from '~/lib/utils/axios_utils'; const testTimeoutInMs = 300; @@ -28,3 +30,5 @@ beforeEach(done => { done(); }); + +Vue.use(Translate); From dc9a67652d77a56038d3132aab1856e555e4c769 Mon Sep 17 00:00:00 2001 From: Winnie Hellmann Date: Wed, 20 Feb 2019 21:27:23 +0100 Subject: [PATCH 3/5] Transpile @gitlab/ui for Jest --- .babelrc.js => babel.config.js | 2 ++ jest.config.js | 1 + 2 files changed, 3 insertions(+) rename .babelrc.js => babel.config.js (94%) diff --git a/.babelrc.js b/babel.config.js similarity index 94% rename from .babelrc.js rename to babel.config.js index 1b05a67354e..e3de8ef2d83 100644 --- a/.babelrc.js +++ b/babel.config.js @@ -1,3 +1,5 @@ +/* eslint-disable import/no-commonjs, filenames/match-regex */ + const BABEL_ENV = process.env.BABEL_ENV || process.env.NODE_ENV || null; const presets = [ diff --git a/jest.config.js b/jest.config.js index 4dab7c2891a..fac2e435cef 100644 --- a/jest.config.js +++ b/jest.config.js @@ -31,4 +31,5 @@ module.exports = { '^.+\\.js$': 'babel-jest', '^.+\\.vue$': 'vue-jest', }, + transformIgnorePatterns: ['node_modules/(?!(@gitlab/ui)/)'], }; From fd8749697115a6d5188ab55cb173bfe4a0246a2d Mon Sep 17 00:00:00 2001 From: Winnie Hellmann Date: Wed, 20 Feb 2019 21:27:57 +0100 Subject: [PATCH 4/5] Remove localVue from discussion_jump_to_next_button_spec.js --- .../discussion_jump_to_next_button_spec.js | 15 ++++----------- 1 file changed, 4 insertions(+), 11 deletions(-) diff --git a/spec/frontend/notes/components/discussion_jump_to_next_button_spec.js b/spec/frontend/notes/components/discussion_jump_to_next_button_spec.js index c41b29fa788..2a4df126ff9 100644 --- a/spec/frontend/notes/components/discussion_jump_to_next_button_spec.js +++ b/spec/frontend/notes/components/discussion_jump_to_next_button_spec.js @@ -1,14 +1,11 @@ import jumpToNextDiscussionButton from '~/notes/components/discussion_jump_to_next_button.vue'; -import { shallowMount, createLocalVue } from '@vue/test-utils'; - -const localVue = createLocalVue(); +import { shallowMount } from '@vue/test-utils'; describe('jumpToNextDiscussionButton', () => { let wrapper; beforeEach(() => { wrapper = shallowMount(jumpToNextDiscussionButton, { - localVue, sync: false, }); }); @@ -17,17 +14,13 @@ describe('jumpToNextDiscussionButton', () => { wrapper.destroy(); }); - it('emits onClick event on button click', done => { + it('emits onClick event on button click', () => { const button = wrapper.find({ ref: 'button' }); button.trigger('click'); - localVue.nextTick(() => { - expect(wrapper.emitted()).toEqual({ - onClick: [[]], - }); - - done(); + expect(wrapper.emitted()).toEqual({ + onClick: [[]], }); }); }); From db735b66a0b19ab4f1f5048cf308bf588b64861e Mon Sep 17 00:00:00 2001 From: Winnie Hellmann Date: Wed, 20 Feb 2019 21:36:27 +0100 Subject: [PATCH 5/5] Add snapshot test to discussion_jump_to_next_button_spec.js --- ...iscussion_jump_to_next_button_spec.js.snap | 20 +++++++++++++++++++ .../discussion_jump_to_next_button_spec.js | 10 +++++++--- 2 files changed, 27 insertions(+), 3 deletions(-) create mode 100644 spec/frontend/notes/components/__snapshots__/discussion_jump_to_next_button_spec.js.snap diff --git a/spec/frontend/notes/components/__snapshots__/discussion_jump_to_next_button_spec.js.snap b/spec/frontend/notes/components/__snapshots__/discussion_jump_to_next_button_spec.js.snap new file mode 100644 index 00000000000..11d65ced180 --- /dev/null +++ b/spec/frontend/notes/components/__snapshots__/discussion_jump_to_next_button_spec.js.snap @@ -0,0 +1,20 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`JumpToNextDiscussionButton matches the snapshot 1`] = ` +
+ +
+`; diff --git a/spec/frontend/notes/components/discussion_jump_to_next_button_spec.js b/spec/frontend/notes/components/discussion_jump_to_next_button_spec.js index 2a4df126ff9..989b0458481 100644 --- a/spec/frontend/notes/components/discussion_jump_to_next_button_spec.js +++ b/spec/frontend/notes/components/discussion_jump_to_next_button_spec.js @@ -1,11 +1,11 @@ -import jumpToNextDiscussionButton from '~/notes/components/discussion_jump_to_next_button.vue'; +import JumpToNextDiscussionButton from '~/notes/components/discussion_jump_to_next_button.vue'; import { shallowMount } from '@vue/test-utils'; -describe('jumpToNextDiscussionButton', () => { +describe('JumpToNextDiscussionButton', () => { let wrapper; beforeEach(() => { - wrapper = shallowMount(jumpToNextDiscussionButton, { + wrapper = shallowMount(JumpToNextDiscussionButton, { sync: false, }); }); @@ -14,6 +14,10 @@ describe('jumpToNextDiscussionButton', () => { wrapper.destroy(); }); + it('matches the snapshot', () => { + expect(wrapper.vm.$el).toMatchSnapshot(); + }); + it('emits onClick event on button click', () => { const button = wrapper.find({ ref: 'button' });