TreeTable filter behavior is not consistent between global and local filtering when using filterMatchMode `contains`

[mediongg]

There is no guarantee in receiving an immediate response in GitHub Issue Tracker, If you'd like to secure our response, you may consider PrimeReact PRO Support where support is provided within 4 business hours

I'm submitting a ... (check one with "x")

[x] bug report
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://forum.primefaces.org/viewforum.php?f=57

Codesandbox Case (Bug Reports) Please fork the codesandbox below and create a case demonstrating your bug report. Issues without a codesandbox have much less possibility to be reviewed.

Please check on https://codesandbox.io/s/primereact-test-4o2x5 for detail.

Current behavior

Local filtering and global filtering behave differently.

I have created two tree data Type A and Type B to describe the behavior.

• Local filtering:

  1. For Type A, when there are multiple items starting with the same characters, entered text must have at least 2 characters matching the first two characters of the item for TreeTable to filter not matched row.

  2. For Type B, unless the inserted character have no match to the item in TreeTable; otherwise, no filtering is happening.

• Global filtering:

  If the inserted characters do not match any item in TreeTable, the result is not filtered.

Expected behavior

I think local filtering should conform what global filtering does and global filtering should hide all items if nothing matches.

I have dug into the code and found that the fiterLocal function in TreeTable seems a little bit weird. I reference the logic in DataTable which has pretty much the same implementation, but in TreeTable there is a variable isValueChanged which decides whether the filtered result or the original data is returned.

If I use filtered results as the return value in filterLocal function, it solves my problem for my scenario. So I am not sure if I misunderstand something or this is actually a bug.

Minimal reproduction of the problem with instructions

https://codesandbox.io/s/primereact-test-4o2x5

First click the expander to open the tree. (The icon of expander is a square icon)

1. For Type A, enter 'a' in textfield marked 'local'. The items 'Bug' and 'Cow' should be filtered. This won't happen for global filtering.

2. For Type B, either input 'Apple', 'Bug' or 'Cat' in textfield marked 'local' won't cause any filtering effects but global filtering works as expected.

3. For both TypeA and Type B, enter any characters, for example 'zzz', in textfield marked 'global' as long as those characters not match any items in TreeTable. In this case, nothing is filtered. It should display empty treetable.

Please tell us about your environment:

• React version:

• PrimeReact version:

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]