appbaseio / reactivesearch

Search UI components for React and Vue
https://opensource.appbase.io/reactivesearch
Apache License 2.0
4.9k stars 466 forks source link

Regression issue upgrading between 3.23.x and 3.24.x and above #1839

Closed cdavid15 closed 2 years ago

cdavid15 commented 2 years ago

Affected Projects React

Library Version: 3.24.0 -> 3.27.0

Describe the bug Breaking changes upgrading from 3.23.x -> 3.24.x and upgrading to latest (3.27.0) is still broken.

The following describes the usage of the components in our app which hopefully provides the necessary context. I have also provided a animated gif of the functionality of 3.23.1 (working version), 3.24.3 and 3.27.0 which illustrates the issues.

image

Within the search functionality a change to the top search bar term will reset the filters as it is deemed a new search.

The issue encountered after the upgrade is when a secondary search is initiated after an initial search with filters it is breaking the search.

Within 3.24.3 I get the following error which is linked to the SingleSearchBar (ReactiveComponent):

An error has occured. You're using Reactivesearch Version: 3.24.3. If you think this is a problem with Reactivesearch, please try updating to the latest version. If you're already at the latest version, please open an issue at https://github.com/appbaseio/reactivesearch/issues TypeError: Cannot read properties of undefined (reading 'componentType')
    at query.js:1:1
    at Array.forEach (<anonymous>)
    at query.js:1:1
    at index.js:8:1
    at dispatch (redux.js:659:1)
    at query.js:1:1
    at index.js:8:1
    at Object.updateQuery (ReactiveComponent.js:371:1)
    at ReactiveComponent._this.setQuery (ReactiveComponent.js:90:1)
    at OmniSearch.js:63:1
    at invokePassiveEffectCreate (react-dom.development.js:23487:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:3945:1)
    at HTMLUnknownElement.dispatchEvent (<anonymous>)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:1)
    at invokeGuardedCallback (react-dom.development.js:4056:1)
    at flushPassiveEffectsImpl (react-dom.development.js:23574:1)
    at unstable_runWithPriority (scheduler.development.js:468:1)
    at runWithPriority$1 (react-dom.development.js:11276:1)
    at flushPassiveEffects (react-dom.development.js:23447:1)
    at performSyncWorkOnRoot (react-dom.development.js:22269:1)
    at react-dom.development.js:11327:1
    at unstable_runWithPriority (scheduler.development.js:468:1)
    at runWithPriority$1 (react-dom.development.js:11276:1)
    at flushSyncCallbackQueueImpl (react-dom.development.js:11322:1)
    at flushSyncCallbackQueue (react-dom.development.js:11309:1)
    at discreteUpdates$1 (react-dom.development.js:22420:1)
    at discreteUpdates (react-dom.development.js:3756:1)
    at dispatchDiscreteEvent (react-dom.development.js:5889:1) {componentStack: '\n    at OmniSearch (http://localhost:3015/static/j…ost:3015/static/js/vendors~main.chunk.js:7496:19)'} 
    at ReactiveBase (http://localhost:3015/static/js/vendors~main.chunk.js:20519:5)
    at Search (http://localhost:3015/static/js/main.chunk.js:36053:80)
    at _class2 (http://localhost:3015/static/js/main.chunk.js:19266:169)
    at C (http://localhost:3015/static/js/vendors~main.chunk.js:231308:37)
    at WithTheme (http://localhost:3015/static/js/vendors~main.chunk.js:92698:28)
    at WithStyles (http://localhost:3015/static/js/vendors~main.chunk.js:92561:31)
    at Route (http://localhost:3015/static/js/vendors~main.chunk.js:231051:29)
    at Switch (http://localhost:3015/static/js/vendors~main.chunk.js:231253:29)
    at main
    at AppContainer (http://localhost:3015/static/js/main.chunk.js:31907:23)
    at C (http://localhost:3015/static/js/vendors~main.chunk.js:231308:37)
    at WithStyles (http://localhost:3015/static/js/vendors~main.chunk.js:92561:31)
    at SearchProvider (http://localhost:3015/static/js/main.chunk.js:42984:23)
    at App (http://localhost:3015/static/js/main.chunk.js:113:74)
    at C (http://localhost:3015/static/js/vendors~main.chunk.js:231308:37)
    at Router (http://localhost:3015/static/js/vendors~main.chunk.js:230682:30)
    at BrowserRouter (http://localhost:3015/static/js/vendors~main.chunk.js:230303:35)
    at CssBaseline (http://localhost:3015/static/js/vendors~main.chunk.js:52538:31)
    at WithStyles (http://localhost:3015/static/js/vendors~main.chunk.js:92561:31)
    at ThemeProvider (http://localhost:3015/static/js/vendors~main.chunk.js:91263:24)
    at StylesProvider (http://localhost:3015/static/js/vendors~main.chunk.js:91076:24)
    at ThemeWrapper (http://localhost:3015/static/js/main.chunk.js:27174:97)
    at ApolloProvider (http://localhost:3015/static/js/vendors~main.chunk.js:7496:19)

The problem line within our OmniSearch.js:63 is as follows with the setQuery function passed as a prop:

setQuery({ query: newQuery, value: theTerm });

The ReactiveComponent is as follows:

       <ReactiveComponent
            URLParams={true}
            componentId="q"
            defaultQuery={() => {
              return {
                _source: { excludes: ["*"] },
              };
            }}
            filterLabel="Term"
            render={({ setQuery }) => (
              <OmniSearch logQuery={true} setQuery={setQuery} theTerm={q} />
            )}
            showFilter={true}
          />

Upgrading to the latest version 3.27.0 presents a different issue as no error occurs but the the Age Filter reverts back to the default 0-150 and it appears it does not propagate correctly to the other linked components as they remain as active filters when they aren't and the underlying query shows the previous filter values are still included.

To Reproduce See the animated gfs in the screenshots section but issue occurs simply by doing a minor upgrade from 3.23.x to 3.24.x.

Expected behavior No breaking changes between minor releases.

Screenshots Before upgrade with 3.23.1:

reactivesearch-3 23 1

After upgrade to 3.24.3:

reactivesearch-3 24 3

After upgrade to 3.27.0:

reactivesearch-3 27 0

Desktop (please complete the following information):

Smartphone (please complete the following information): N/A

Additional context We are unclear exactly what the issue is but we've been using reactivesearch in our project since December 2018 (v 2.14.x) and have been upgrading regularly without issues but recently when we upgraded from 3.23.1 to 3.24.3 our search has failed and we have now pinned on 3.23.1 which can only be a short term solution.

It is unclear what is causing it but we have isolated reactivesearch as the only change which breaks the app. We know 3.23.x to 3.24.x is only a minor version and hoping there may be something we have missed in the release notes of why a minor release is a breaking change and the reactivesearch devs / community may be able to assist.

Note: The application is an internal app so unable to provide links to the code but happy to provide as much as I can on here if it can help.

bietkul commented 2 years ago

@cdavid15 Can you share the react prop dependencies among the components? We would like to know how do you reset the filters when search value gets changed (we only reset pagination for result components). We would be able to help faster if you can share a replicable demo. You can clone the following CSB. https://docs.appbase.io/docs/reactivesearch/v3/range/rangeinput/#demo

cdavid15 commented 2 years ago

@bietkul Thanks for the reply. I suspected we would need to try and recreate it in a sandbox but stripping all the internal private code itself will be a challenge.

I take it you don't see or believe anything between the 3.23 release and the 3.24 changed significantly enough to cause any issues?

I will try and get a isolated sandbox with or exact search setup created in the coming days / weeks to try and successfully recreate it.

stale[bot] commented 2 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.