Vue.js 3 - AjaxStore - Filter Not working

guilherme-pinto-reeeliance commented 7 months ago

When using AjaxStore Grid with Vue.js 3 + Nuxtjs 3 Bryntum grid

"@bryntum/grid": "^5.6.8", "@bryntum/grid-vue-3": "^5.6.8",

The server its responding normally with the filter working but the bryntum its havings this errors

We are having this problem when the user hits one character

Screenshot 2024-03-11 at 20 53 25

And when the user hits a second character this error

After this the bryntum stop working

After Hours and Hours of debug i think i found the source of this problem This on the performFilter method where did you guys have a promise internalLoad

const result = await me.internalLoad({}, "", (event)=>{
                me.data = event.data;
                event = silent ? null : {
                    action: "filter",
                    filters,
                    oldCount,
                    records: me.storage.values
                };
                me.afterPerformFilter(event);
                me.trigger("refresh", event);
            }

on my tests the start of all errors its this part.

jsakalos commented 6 months ago

@guilherme-pinto-reeeliance, would you please post a showcase we can run and debug or the exact steps to reproduce the problem with one of our demos?

guilherme-pinto-reeeliance commented 6 months ago

follow a repository where you find the code to reproduce the error https://github.com/guilherme-pinto-reeeliance/vue3-bryntum-filter-error

you can find a live version here: https://vue3-bryntum-filter-error.pages.dev/

the configuration file its this one

https://github.com/guilherme-pinto-reeeliance/vue3-bryntum-filter-error/blob/17a6230e4a01b455bfa03c0fed453adea20c1e20/app.vue

ghulamghousdev commented 6 months ago

Hi @guilherme-pinto-reeeliance,

Thanks for sharing it. We have a high prio ticket here https://github.com/bryntum/support/issues/8846. I was working on it. I have fixed the issue already, will try to push to get it merge tomorrow. You can track this issue there.

jsakalos commented 6 months ago

Explanation: vue: true must be used with an appropriate renderer and it should not do anything by itself. The problem was that setting this flag but not providing the renderer caused the crash. The fix makes the code impervious to that combination. We expect it will be released in 5.6.9 or latest 5.6.10. Until then just remove the vue flag.

guilherme-pinto-reeeliance commented 6 months ago

Even with the render the problem continue. And whiteout the property set as true, nothing is showing up.

On Thu, Apr 4, 2024, 18:39 Saki @.***> wrote:

Explanation: vue: true must be used with an appropriate renderer and it should not do anything by itself. The problem was that setting this flag but not providing the renderer caused the crash. The fix makes the code impervious to that combination. We expect it will be release in 5.6.10. Until then just remove the vue flag.

— Reply to this email directly, view it on GitHub https://github.com/bryntum/support/issues/8788#issuecomment-2037806373, or unsubscribe https://github.com/notifications/unsubscribe-auth/BG4BASVATYUTLXLWHZK62EDY3WF3VAVCNFSM6AAAAABERBFBRGVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDAMZXHAYDMMZXGM . You are receiving this because you were mentioned.Message ID: @.***>

ghulamghousdev commented 6 months ago

@guilherme-pinto-reeeliance the test case provided by you does not include any renderer. And I have tried it in our online example with a vue renderer and issue was resolved.

SergeyMaltsev commented 6 months ago

Closed as duplicate for resolved issue https://github.com/bryntum/support/issues/8846

bryntum / support

Vue.js 3 - AjaxStore - Filter Not working #8788