bootstrap-vue · jacobmllr95 · Sep 16, 2020 · Sep 16, 2020 · Sep 16, 2020
diff --git a/src/components/table/README.md b/src/components/table/README.md
@@ -3000,7 +3000,7 @@ your app handles the various inconsistencies with events.
       :current-page="currentPage"
       :per-page="perPage"
       :filter="filter"
-      :filterIncludedFields="filterOn"
+      :filter-included-fields="filterOn"
       :sort-by.sync="sortBy"
       :sort-desc.sync="sortDesc"
       :sort-direction="sortDirection"

diff --git a/src/components/table/helpers/mixin-filtering.js b/src/components/table/helpers/mixin-filtering.js
@@ -49,10 +49,10 @@ export default {
   },
   computed: {
     computedFilterIgnored() {
-      return this.filterIgnoredFields ? concat(this.filterIgnoredFields).filter(identity) : null
+      return concat(this.filterIgnoredFields || []).filter(identity)
     },
     computedFilterIncluded() {
-      return this.filterIncludedFields ? concat(this.filterIncludedFields).filter(identity) : null
+      return concat(this.filterIncludedFields || []).filter(identity)
     },
     computedFilterDebounce() {
       const ms = toInteger(this.filterDebounce, 0)

diff --git a/src/components/table/helpers/sanitize-row.js b/src/components/table/helpers/sanitize-row.js
@@ -31,8 +31,8 @@ const sanitizeRow = (row, ignoreFields, includeFields, fieldsObj = {}) => {
   const allowedKeys = keys(formattedRow).filter(
     key =>
       !IGNORED_FIELD_KEYS[key] &&
-      !(isArray(ignoreFields) && arrayIncludes(ignoreFields, key)) &&
-      !(isArray(includeFields) && !arrayIncludes(includeFields, key))
+      !(isArray(ignoreFields) && ignoreFields.length > 0 && arrayIncludes(ignoreFields, key)) &&
+      !(isArray(includeFields) && includeFields.length > 0 && !arrayIncludes(includeFields, key))
   )
 
   return pick(formattedRow, allowedKeys)

diff --git a/src/components/table/table-filtering.spec.js b/src/components/table/table-filtering.spec.js
@@ -207,6 +207,63 @@ describe('table > filtering', () => {
     wrapper.destroy()
   })
 
+  it('`filter-ignored-fields` prop works', async () => {
+    const wrapper = mount(BTable, {
+      propsData: {
+        fields: testFields,
+        items: testItems,
+        filter: '',
+        filterIgnoredFields: []
+      }
+    })
+
+    expect(wrapper).toBeDefined()
+    await waitNT(wrapper.vm)
+
+    expect(wrapper.findAll('tbody > tr').length).toBe(3)
+
+    // Search for a value in "a" column
+    await wrapper.setProps({ filter: '3' })
+    await waitNT(wrapper.vm)
+    expect(wrapper.findAll('tbody > tr').length).toBe(1)
+
+    // Ignore "a" column from filtering
+    await wrapper.setProps({ filterIgnoredFields: ['a'] })
+    await waitNT(wrapper.vm)
+    expect(wrapper.findAll('tbody > tr').length).toBe(0)
+
+    wrapper.destroy()
+  })
+
+  it('`filter-included-fields` prop works', async () => {
+    const wrapper = mount(BTable, {
+      propsData: {
+        fields: testFields,
+        // Add a extra item with a duplicated value in another field
+        items: [...testItems, { a: 4, b: 'y', c: 'a' }],
+        filter: '',
+        filterIncludedFields: []
+      }
+    })
+
+    expect(wrapper).toBeDefined()
+    await waitNT(wrapper.vm)
+
+    expect(wrapper.findAll('tbody > tr').length).toBe(4)
+
+    // Search for "a"
+    await wrapper.setProps({ filter: 'a' })
+    await waitNT(wrapper.vm)
+    expect(wrapper.findAll('tbody > tr').length).toBe(2)
+
+    // Only include "a" and "b" fields
+    await wrapper.setProps({ filterIncludedFields: ['a', 'b'] })
+    await waitNT(wrapper.vm)
+    expect(wrapper.findAll('tbody > tr').length).toBe(1)
+
+    wrapper.destroy()
+  })
+
   it('should filter for formatted values for keys which are not present in row', async () => {
     const wrapper = mount(BTable, {
       propsData: {