diff --git a/packages/vuetify/src/components/VData/VData.ts b/packages/vuetify/src/components/VData/VData.ts index 289273e3511..2274574e1b7 100644 --- a/packages/vuetify/src/components/VData/VData.ts +++ b/packages/vuetify/src/components/VData/VData.ts @@ -192,7 +192,6 @@ export default Vue.extend({ handler (options: DataOptions, old: DataOptions) { if (deepEqual(options, old)) return this.$emit('update:options', options) - this.$emit('pagination', this.pagination) }, deep: true, immediate: true, @@ -257,6 +256,12 @@ export default Vue.extend({ }, immediate: true, }, + pagination: { + handler () { + this.$emit('pagination', this.pagination) + }, + immediate: true, + }, }, methods: { diff --git a/packages/vuetify/src/components/VDataTable/__tests__/VDataTable.spec.ts b/packages/vuetify/src/components/VDataTable/__tests__/VDataTable.spec.ts index 0e36afb10c0..b858f411469 100644 --- a/packages/vuetify/src/components/VDataTable/__tests__/VDataTable.spec.ts +++ b/packages/vuetify/src/components/VDataTable/__tests__/VDataTable.spec.ts @@ -732,4 +732,63 @@ describe('VDataTable.ts', () => { expect(wrapper.html()).toMatchSnapshot() }) + + // https://github.com/vuetifyjs/vuetify/issues/10392 + it('should emit pagination event when filtering', async () => { + const headers = [ + { + text: 'Name', + value: 'name', + }, + { + text: 'ID', + value: 'id', + }, + ] + + const items = [ + { + name: 'Assistance', + id: 1, + }, + { + name: 'Candidat', + id: 2, + }, + ] + + const pagination = jest.fn() + + const wrapper = mountFunction({ + propsData: { + headers, + items, + itemKey: 'id', + }, + listeners: { + pagination, + }, + }) + + expect(pagination).toHaveBeenLastCalledWith({ + itemsLength: 2, + itemsPerPage: 10, + page: 1, + pageCount: 1, + pageStart: 0, + pageStop: 2, + }) + + wrapper.setProps({ search: 'candidat' }) + await wrapper.vm.$nextTick() + + expect(pagination).toHaveBeenLastCalledWith({ + itemsLength: 1, + itemsPerPage: 10, + page: 1, + pageCount: 1, + pageStart: 0, + pageStop: 1, + }) + }) })