Skip to content

Commit 018eef1

Browse files
authored
fix(b-table): minor code optimizations to filter debouncing (#4167)
1 parent a8e2e56 commit 018eef1

File tree

2 files changed

+25
-16
lines changed

2 files changed

+25
-16
lines changed

src/components/table/helpers/mixin-filtering.js

Lines changed: 9 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -96,21 +96,18 @@ export default {
9696
// We need a deep watcher in case the user passes
9797
// an object when using `filter-function`
9898
deep: true,
99-
handler(newFilter, oldFilter) {
99+
handler(newCriteria, oldCriteria) {
100100
const timeout = this.computedFilterDebounce
101-
if (this.$_filterTimer) {
102-
clearTimeout(this.$_filterTimer)
103-
this.$_filterTimer = null
104-
}
105-
if (timeout) {
101+
clearTimeout(this.$_filterTimer)
102+
this.$_filterTimer = null
103+
if (timeout && timeout > 0) {
106104
// If we have a debounce time, delay the update of `localFilter`
107105
this.$_filterTimer = setTimeout(() => {
108-
this.$_filterTimer = null
109-
this.localFilter = this.filterSanitize(this.filter)
106+
this.localFilter = this.filterSanitize(newCriteria)
110107
}, timeout)
111108
} else {
112109
// Otherwise, immediately update `localFilter` with `newFilter` value
113-
this.localFilter = this.filterSanitize(newFilter)
110+
this.localFilter = this.filterSanitize(newCriteria)
114111
}
115112
}
116113
},
@@ -154,12 +151,9 @@ export default {
154151
this.isFiltered = Boolean(this.localFilter)
155152
})
156153
},
157-
beforeDestroy() {
158-
/* istanbul ignore next */
159-
if (this.$_filterTimer) {
160-
clearTimeout(this.$_filterTimer)
161-
this.$_filterTimer = null
162-
}
154+
beforeDestroy() /* istanbul ignore next */ {
155+
clearTimeout(this.$_filterTimer)
156+
this.$_filterTimer = null
163157
},
164158
methods: {
165159
filterSanitize(criteria) {

src/components/table/table-filtering.spec.js

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -238,6 +238,7 @@ describe('table > filtering', () => {
238238

239239
it('filter debouncing works', async () => {
240240
jest.useFakeTimers()
241+
let lastFilterTimer = null
241242
const wrapper = mount(BTable, {
242243
propsData: {
243244
fields: testFields,
@@ -254,6 +255,7 @@ describe('table > filtering', () => {
254255
expect(wrapper.emitted('input').length).toBe(1)
255256
expect(wrapper.emitted('input')[0][0]).toEqual(testItems)
256257
expect(wrapper.vm.$_filterTimer).toBe(null)
258+
lastFilterTimer = wrapper.vm.$_filterTimer
257259

258260
// Set filter to a single character
259261
wrapper.setProps({
@@ -262,6 +264,9 @@ describe('table > filtering', () => {
262264
await waitNT(wrapper.vm)
263265
expect(wrapper.emitted('input').length).toBe(1)
264266
expect(wrapper.vm.$_filterTimer).not.toBe(null)
267+
expect(wrapper.vm.$_filterTimer).not.toEqual(lastFilterTimer)
268+
lastFilterTimer = wrapper.vm.$_filterTimer
269+
expect(wrapper.vm.localFilter).not.toEqual('1')
265270

266271
// Change filter
267272
wrapper.setProps({
@@ -270,12 +275,17 @@ describe('table > filtering', () => {
270275
await waitNT(wrapper.vm)
271276
expect(wrapper.emitted('input').length).toBe(1)
272277
expect(wrapper.vm.$_filterTimer).not.toBe(null)
278+
expect(wrapper.vm.$_filterTimer).not.toEqual(lastFilterTimer)
279+
lastFilterTimer = wrapper.vm.$_filterTimer
280+
expect(wrapper.vm.localFilter).not.toEqual('z')
273281

274282
jest.runTimersToTime(101)
275283
await waitNT(wrapper.vm)
276284
expect(wrapper.emitted('input').length).toBe(2)
277285
expect(wrapper.emitted('input')[1][0]).toEqual([testItems[2]])
278-
expect(wrapper.vm.$_filterTimer).toBe(null)
286+
expect(wrapper.vm.$_filterTimer).toEqual(lastFilterTimer)
287+
lastFilterTimer = wrapper.vm.$_filterTimer
288+
expect(wrapper.vm.localFilter).toEqual('z')
279289

280290
// Change filter
281291
wrapper.setProps({
@@ -284,6 +294,10 @@ describe('table > filtering', () => {
284294
await waitNT(wrapper.vm)
285295
expect(wrapper.vm.$_filterTimer).not.toBe(null)
286296
expect(wrapper.emitted('input').length).toBe(2)
297+
expect(wrapper.vm.$_filterTimer).not.toEqual(lastFilterTimer)
298+
lastFilterTimer = wrapper.vm.$_filterTimer
299+
expect(wrapper.vm.localFilter).not.toEqual('1')
300+
expect(wrapper.vm.localFilter).toEqual('z')
287301

288302
// Change filter-debounce to no debouncing
289303
wrapper.setProps({
@@ -295,6 +309,7 @@ describe('table > filtering', () => {
295309
// Should immediately filter the items
296310
expect(wrapper.emitted('input').length).toBe(3)
297311
expect(wrapper.emitted('input')[2][0]).toEqual([testItems[1]])
312+
expect(wrapper.vm.localFilter).toEqual('1')
298313

299314
wrapper.destroy()
300315
})

0 commit comments

Comments
 (0)