blessing-skin-server/resources/assets/tests/views/skinlib/List.test.ts
2019-03-26 17:42:27 +08:00

240 lines
6.4 KiB
TypeScript

import Vue from 'vue'
import { mount } from '@vue/test-utils'
import { Button } from 'element-ui'
import List from '@/views/skinlib/List.vue'
jest.mock('element-ui/lib/select', () => ({
install(vue: typeof Vue) {
vue.component('ElSelect', {
render(h) {
return h('select', {
on: {
change: (event: Event) => this.$emit(
'change',
(event.target as HTMLSelectElement).value
),
},
attrs: {
value: this.value,
},
}, this.$slots.default)
},
props: {
value: String,
},
model: {
prop: 'value',
event: 'change',
},
})
},
}))
jest.mock('element-ui/lib/option', () => ({
install(vue: typeof Vue) {
vue.component('ElOption', {
render(h) {
return h('option', { attrs: { value: this.value } }, this.label)
},
props: {
label: String,
value: String,
},
})
},
}))
test('fetch data before mounting', () => {
Vue.prototype.$http.get.mockResolvedValue({
items: [], total_pages: 0, current_uid: 0,
})
mount(List)
expect(Vue.prototype.$http.get).toBeCalledWith(
'/skinlib/data',
{
filter: 'skin', uploader: 0, sort: 'time', keyword: '', page: 1,
}
)
})
test('empty skin library', () => {
Vue.prototype.$http.get.mockResolvedValue({
items: [], total_pages: 0, current_uid: 0,
})
const wrapper = mount(List)
expect(wrapper.text()).toContain('general.noResult')
})
test('toggle texture type', () => {
Vue.prototype.$http.get.mockResolvedValue({
items: [], total_pages: 0, current_uid: 0,
})
const wrapper = mount(List)
const select = wrapper.find({ name: 'ElSelect' })
const breadcrumb = wrapper.find('.breadcrumb')
expect(breadcrumb.text()).toContain('skinlib.filter.skin')
select.setValue('steve')
select.trigger('change')
expect(breadcrumb.text()).toContain('skinlib.filter.steve')
expect(Vue.prototype.$http.get).toBeCalledWith(
'/skinlib/data',
{
filter: 'steve', uploader: 0, sort: 'time', keyword: '', page: 1,
}
)
select.setValue('alex')
select.trigger('change')
expect(breadcrumb.text()).toContain('skinlib.filter.alex')
expect(Vue.prototype.$http.get).toBeCalledWith(
'/skinlib/data',
{
filter: 'alex', uploader: 0, sort: 'time', keyword: '', page: 1,
}
)
select.setValue('cape')
select.trigger('change')
expect(breadcrumb.text()).toContain('general.cape')
expect(Vue.prototype.$http.get).toBeCalledWith(
'/skinlib/data',
{
filter: 'cape', uploader: 0, sort: 'time', keyword: '', page: 1,
}
)
})
test('check specified uploader', async () => {
Vue.prototype.$http.get.mockResolvedValue({
items: [], total_pages: 0, current_uid: 1,
})
const wrapper = mount(List)
await wrapper.vm.$nextTick()
const breadcrumb = wrapper.find('.breadcrumb')
const button = wrapper
.find('.advanced-filter')
.findAll(Button)
.at(2)
expect(breadcrumb.text()).toContain('skinlib.filter.allUsers')
button.trigger('click')
expect(breadcrumb.text()).toContain('skinlib.filter.uploader')
expect(Vue.prototype.$http.get).toBeCalledWith(
'/skinlib/data',
{
filter: 'skin', uploader: 1, sort: 'time', keyword: '', page: 1,
}
)
})
test('sort items', () => {
Vue.prototype.$http.get.mockResolvedValue({
items: [], total_pages: 0, current_uid: 0,
})
const wrapper = mount(List)
const buttons = wrapper.find('.advanced-filter').findAll(Button)
const sortByLikes = buttons.at(0)
const sortByTime = buttons.at(1)
sortByLikes.trigger('click')
expect(Vue.prototype.$http.get).toBeCalledWith(
'/skinlib/data',
{
filter: 'skin', uploader: 0, sort: 'likes', keyword: '', page: 1,
}
)
expect(wrapper.text()).toContain('skinlib.sort.likes')
sortByTime.trigger('click')
expect(Vue.prototype.$http.get).toBeCalledWith(
'/skinlib/data',
{
filter: 'skin', uploader: 0, sort: 'time', keyword: '', page: 1,
}
)
expect(wrapper.text()).toContain('skinlib.sort.time')
})
test('search by keyword', () => {
Vue.prototype.$http.get.mockResolvedValue({
items: [], total_pages: 0, current_uid: 0,
})
const wrapper = mount(List)
wrapper.setData({ keyword: 'a' })
wrapper.find('form').trigger('submit')
expect(Vue.prototype.$http.get).toBeCalledWith(
'/skinlib/data',
{
filter: 'skin', uploader: 0, sort: 'time', keyword: 'a', page: 1,
}
)
wrapper.setData({ keyword: 'b' })
wrapper.find('[data-test="btn-search"]').trigger('click')
expect(Vue.prototype.$http.get).toBeCalledWith(
'/skinlib/data',
{
filter: 'skin', uploader: 0, sort: 'time', keyword: 'b', page: 1,
}
)
})
test('reset all filters', () => {
Vue.prototype.$http.get.mockResolvedValue({
items: [], total_pages: 0, current_uid: 0,
})
const wrapper = mount(List)
wrapper.findAll('option').at(3)
.setSelected()
wrapper.setData({ keyword: 'abc' })
const buttons = wrapper.find('.advanced-filter').findAll(Button)
buttons.at(1).trigger('click')
Vue.prototype.$http.get.mockClear()
buttons.at(3).trigger('click')
expect(Vue.prototype.$http.get).toBeCalledTimes(1)
})
test('is anonymous', () => {
Vue.prototype.$http.get.mockResolvedValue({
items: [], total_pages: 0, current_uid: 0,
})
const wrapper = mount<Vue & { anonymous: boolean }>(List)
expect(wrapper.vm.anonymous).toBeTrue()
})
test('on page changed', () => {
Vue.prototype.$http.get.mockResolvedValue({
items: [], total_pages: 0, current_uid: 0,
})
const wrapper = mount<Vue & { pageChanged(page: number): void }>(List)
wrapper.vm.pageChanged(2)
expect(Vue.prototype.$http.get).toBeCalledWith(
'/skinlib/data',
{
filter: 'skin', uploader: 0, sort: 'time', keyword: '', page: 2,
}
)
})
test('on like toggled', async () => {
Vue.prototype.$http.get.mockResolvedValue({
items: [{
tid: 1, liked: false, likes: 0,
}],
total_pages: 1,
current_uid: 0,
})
const wrapper = mount<Vue & {
onLikeToggled(tid: number, like: boolean): void,
items: Array<{ liked: boolean, likes: number }>
}>(List)
await wrapper.vm.$nextTick()
wrapper.vm.onLikeToggled(0, true)
expect(wrapper.vm.items[0].liked).toBeTrue()
expect(wrapper.vm.items[0].likes).toBe(1)
wrapper.vm.onLikeToggled(0, false)
expect(wrapper.vm.items[0].liked).toBeFalse()
expect(wrapper.vm.items[0].likes).toBe(0)
})