hooks stuck loading on local but work on production

[idesignpixels]

See repo to reproduce: https://github.com/idesignpixels/rxdb-hooks-issue run npm install & npm start

isFetching is always true on local.

I've tried with rxdb@13.17.1, rxdb@14.0.1 and rxdb@14.0.3

code using hook:

function App() {
  const { result: characters, isFetching } = useRxData(
    // the collection to be queried
    'characters',
    // a function returning the query to be applied
    collection =>
      collection.find({
        selector: {
          affiliation: 'jedi',
        },
      })
  );

  if (isFetching) {
    return 'loading characters...';
  }

  return (
    <div className="App">
        <ul>
        {characters.map((character, idx) => (
          <li key={idx}>{character.name}</li>
        ))}
      </ul>
    </div>
  );
}

[cvara]

To be honest I haven't tested against dexie before (with or without dev mode). It also seems that rxdb 14 has introduced some breaking changes, so let me bring rxdb-hooks up to speed (#66) and get back to you on the issue.

[harfel]

I encountered the same issue. Works if I downgrade to rxdb-hooks 4.0.3 with rxdb 12.7.16.

[holdenmatt]

I'm also hitting this (new setup following the rxdb/rxdb-hooks docs).

It seems useRxDB and useRxCollection work, but useRxData, useRxDocument, and useRxQuery don't (they get stuck on isFetching).

Looking forward to a fix -- seems like a very useful library!

[cvara]

I just released version 5.0.0 which supports rxdb@14. Hooks should be working now as expected.

[holdenmatt]

Nice! I tried upgrading to 5.0.0 but still seeing the issue.

I'm new to rxdb, so I may be doing something wrong. I'm trying a query like this:

const { result, isFetching } = useRxData<DocType>("docs", (docs) =>
    docs.findOne({
      selector: {
        _id: docId,
      },
    })
  );

But isFetching is always true and result is [], even though I have a doc with the id I'm searching for.

Are the hooks working now for others?

[cvara]

@holdenmatt It might be possible that RxDBDevModePlugin is throwing schema validation errors (see dev mode for details). That would be unrelated to rxdb-hooks, it would just be a matter of fixing the issues reported.

As a matter of fact, the schema I use as an example in the readme would cause such an error (it is not specifying a maxLength for the primary key), I will update it to avoid luring people into a trap.

[holdenmatt]

Sorry, I'm a bit puzzled.

I tried disabling dev mode, switching from Dexie storage to memory, and upgraded to latest versions, seeing the same result. The only hooks that work for me are Db and Collection.

Then I tried cloning the original poster's repo: https://github.com/idesignpixels/rxdb-hooks-issue

Looks like the same issue I'm seeing, and still seeing it after upgrading to the latest rxdb-hooks/rxdb. Are you not able to repro on your side?

[cvara]

I can indeed reproduce it on the OP's repo, however all tests are passing using the exact same dependencies. This seems to be a tricky issue:

The reason the hooks are stuck loading is that the object returned by the query constructor is not evaluated as a valid RxQuery object which causes rxdb-hooks to ignore it. Internally, rxdb-hooks are using rxdb's isRxQuery helper, which mysteriously returns false, although the object is a valid RxQueryBase object.

This makes me think that the bundler (webpack, as setup by CRA in the above example) is causing the issue: the function that generated the query is not referentially equal with the function against which instanceof is comparing.

I tried reproducing the issue without success on two basic example web apps, using plain webpack and parcel (as seen in #72).

In any case, this is not an issue directly caused by rxdb-hooks, however I am reopening this in order to find a workaround.

[cvara]

Just released 5.0.2. @holdenmatt can you verify that it fixes the issue for you?

[holdenmatt]

Thanks, @cvara! Confirmed this is working for me now with 5.0.2!