fix failing component tests

This commit is contained in:
Alina Beck 2019-12-19 12:48:13 +05:30
parent ea612bdf78
commit ad27404059
8 changed files with 27 additions and 30 deletions

View File

@ -74,7 +74,7 @@ describe('CommentForm.vue', () => {
it('calls `clear` method when the cancel button is clicked', async () => {
wrapper.vm.updateEditorContent('ok')
await wrapper.find('.cancelBtn').trigger('submit')
await wrapper.find('[data-test="cancel-button"]').trigger('submit')
expect(cancelMethodSpy).toHaveBeenCalledTimes(1)
})
@ -162,13 +162,13 @@ describe('CommentForm.vue', () => {
describe('cancel button is clicked', () => {
it('calls `closeEditWindow` method', async () => {
wrapper.vm.updateEditorContent('ok')
await wrapper.find('.cancelBtn').trigger('submit')
await wrapper.find('[data-test="cancel-button"]').trigger('submit')
expect(closeMethodSpy).toHaveBeenCalledTimes(1)
})
it('emits `showEditCommentMenu` event', async () => {
wrapper.vm.updateEditorContent('ok')
await wrapper.find('.cancelBtn').trigger('submit')
await wrapper.find('[data-test="cancel-button"]').trigger('submit')
expect(wrapper.emitted('showEditCommentMenu')).toEqual([[false]])
})
})

View File

@ -5,7 +5,7 @@
<!-- with client-only the content is not shown -->
<hc-editor ref="editor" :users="users" :value="form.content" @input="updateEditorContent" />
<div class="buttons">
<base-button :disabled="disabled && !update" @click="handleCancel">
<base-button :disabled="disabled && !update" @click="handleCancel" data-test="cancel-button">
{{ $t('actions.cancel') }}
</base-button>
<base-button type="submit" :loading="loading" :disabled="disabled || errors" primary>

View File

@ -63,12 +63,7 @@ describe('CommentList.vue', () => {
it('displays a comments counter', () => {
wrapper = Wrapper()
expect(wrapper.find('span.ds-tag').text()).toEqual('1')
})
it('displays a comments counter', () => {
wrapper = Wrapper()
expect(wrapper.find('span.ds-tag').text()).toEqual('1')
expect(wrapper.find('.count').text()).toEqual('1')
})
describe('scrollToAnchor mixin', () => {

View File

@ -39,7 +39,7 @@ describe('FilterMenu.vue', () => {
describe('click "clear-search-button" button', () => {
it('emits clearSearch', () => {
wrapper.find({ name: 'clear-search-button' }).trigger('click')
wrapper.find('[name="clear-search-button"]').trigger('click')
expect(wrapper.emitted().clearSearch).toHaveLength(1)
})
})

View File

@ -92,7 +92,7 @@ describe('FilterPosts.vue', () => {
it('starts with all categories button active', () => {
const wrapper = openFilterPosts()
allCategoriesButton = wrapper.findAll('button').at(1)
expect(allCategoriesButton.attributes().class).toContain('.base-button.--primary')
expect(allCategoriesButton.attributes().class).toContain('--primary')
})
it('calls TOGGLE_CATEGORY when clicked', () => {
@ -115,7 +115,7 @@ describe('FilterPosts.vue', () => {
getters['posts/filteredCategoryIds'] = jest.fn(() => ['cat9'])
const wrapper = openFilterPosts()
democracyAndPoliticsButton = wrapper.findAll('button').at(4)
expect(democracyAndPoliticsButton.attributes().class).toContain('base-button.--primary')
expect(democracyAndPoliticsButton.attributes().class).toContain('--primary')
})
it('sets language button attribute `primary` when corresponding language is filtered', () => {
@ -124,14 +124,14 @@ describe('FilterPosts.vue', () => {
spanishButton = wrapper
.findAll('button.language-buttons')
.at(languages.findIndex(l => l.code === 'es'))
expect(spanishButton.attributes().class).toContain('base-button.--primary')
expect(spanishButton.attributes().class).toContain('--primary')
})
it('sets "filter-by-followed-authors-only" button attribute `primary`', () => {
getters['posts/filteredByUsersFollowed'] = jest.fn(() => true)
const wrapper = openFilterPosts()
expect(
wrapper.find({ name: 'filter-by-followed-authors-only' }).classes('base-button.--primary'),
wrapper.find('.base-button[name="filter-by-followed-authors-only"]').classes('--primary'),
).toBe(true)
})
@ -139,7 +139,7 @@ describe('FilterPosts.vue', () => {
let wrapper
beforeEach(() => {
wrapper = openFilterPosts()
wrapper.find({ name: 'filter-by-followed-authors-only' }).trigger('click')
wrapper.find('.base-button[name="filter-by-followed-authors-only"]').trigger('click')
})
it('calls TOGGLE_FILTER_BY_FOLLOWED', () => {

View File

@ -1,4 +1,4 @@
import { config, shallowMount } from '@vue/test-utils'
import { config, mount } from '@vue/test-utils'
import NotificationMenu from './NotificationMenu'
const localVue = global.localVue
@ -22,9 +22,9 @@ describe('NotificationMenu.vue', () => {
}
})
describe('shallowMount', () => {
describe('mount', () => {
const Wrapper = () => {
return shallowMount(NotificationMenu, {
return mount(NotificationMenu, {
data,
mocks,
localVue,
@ -33,7 +33,7 @@ describe('NotificationMenu.vue', () => {
it('counter displays 0', () => {
wrapper = Wrapper()
expect(wrapper.find('base-button-stub').text()).toEqual('0')
expect(wrapper.find('.count').text()).toEqual('0')
})
it('no dropdown is rendered', () => {
@ -67,12 +67,12 @@ describe('NotificationMenu.vue', () => {
it('counter displays 0', () => {
wrapper = Wrapper()
expect(wrapper.find('base-button-stub').text()).toEqual('0')
expect(wrapper.find('.count').text()).toEqual('0')
})
it('button is not primary', () => {
it('counter is not colored', () => {
wrapper = Wrapper()
expect(wrapper.find('base-button-stub').props('primary')).toBe(false)
expect(wrapper.find('.count').classes()).toContain('--inactive')
})
})
@ -130,12 +130,12 @@ describe('NotificationMenu.vue', () => {
it('displays the number of unread notifications', () => {
wrapper = Wrapper()
expect(wrapper.find('base-button-stub').text()).toEqual('2')
expect(wrapper.find('.count').text()).toEqual('2')
})
it('renders primary button', () => {
it('renders the counter in red', () => {
wrapper = Wrapper()
expect(wrapper.find('base-button-stub').props('primary')).toBe(true)
expect(wrapper.find('.count').classes()).toContain('--danger')
})
})
})

View File

@ -119,11 +119,11 @@ describe('my-social-media.vue', () => {
})
it('displays the edit button', () => {
expect(wrapper.find('a[name="edit"]').exists()).toBe(true)
expect(wrapper.find('.base-button[data-test="edit-button"]').exists()).toBe(true)
})
it('displays the delete button', () => {
expect(wrapper.find('a[name="delete"]').exists()).toBe(true)
expect(wrapper.find('.base-button[data-test="delete-button"]').exists()).toBe(true)
})
})
@ -138,7 +138,7 @@ describe('my-social-media.vue', () => {
describe('editing social media link', () => {
beforeEach(() => {
const editButton = wrapper.find('a[name="edit"]')
const editButton = wrapper.find('.base-button[data-test="edit-button"]')
editButton.trigger('click')
input = wrapper.find('input#editSocialMedia')
})
@ -169,7 +169,7 @@ describe('my-social-media.vue', () => {
describe('deleting social media link', () => {
beforeEach(() => {
const deleteButton = wrapper.find('a[name="delete"]')
const deleteButton = wrapper.find('.base-button[data-test="delete-button"]')
deleteButton.trigger('click')
})

View File

@ -30,6 +30,7 @@
ghost
@click="handleEditSocialMedia(link)"
:title="$t('actions.edit')"
data-test="edit-button"
/>
<base-button
icon="trash"
@ -37,6 +38,7 @@
ghost
@click="handleDeleteSocialMedia(link)"
:title="$t('actions.delete')"
data-test="delete-button"
/>
</template>
</ds-list-item>