remix-run / remix

Build Better Websites. Create modern, resilient user experiences with web fundamentals.
https://remix.run
MIT License
29.9k stars 2.52k forks source link

Firestore Lite Does Not Work in Loader #9285

Open jdgamble555 opened 6 months ago

jdgamble555 commented 6 months ago

Reproduction

Here is the test repo (need to add any Firebase credentials and query any firebase document):

https://github.com/jdgamble555/remix-firebase-test/blob/master/app/lib/about.server.ts

https://github.com/jdgamble555/remix-firebase-test

The test deployed version (deployed working without Lite):

https://remix-firebase-test.vercel.app/

System Info

Firebase: 10.11.0

Remix: 2.8.1

Used Package Manager

npm

Expected Behavior

Remix will resolver a firebase document as expected when loading firebase/firestore. However, when loading the lite version, which uses REST API, it will never get resolved.

You can test this by changing the path to use Firestore Lite to firebase/firestore/lite in the

https://github.com/jdgamble555/remix-firebase-test/blob/master/app/lib/about.server.ts.

Actual Behavior

It does not get Resolved. I submitted a bug report to Firebase. Firebase says this is a Remix problem.

https://github.com/firebase/firebase-js-sdk/issues/8195

Also probably related to: https://github.com/firebase/firebase-js-sdk/issues/7911

J

RafalFilipek commented 6 months ago

This doesn't appear to be an issue in Remix. Will it work if you put this logic in a simple Node.js script?

This will help us eliminate issues in firebase/firestore/lite.

jdgamble555 commented 6 months ago

Yes, I have built the same app in NextJS.

https://github.com/jdgamble555/nextjs-firebase-todo/blob/master/lib/about.ts

The Firestore Teams seems to think this is a Remix problem:

https://github.com/firebase/firebase-js-sdk/issues/8195

J

jdgamble555 commented 6 months ago

This is definitely a remix issue. When I add the unstable_singleFetch: true flag, the Firestore runtime actually resolves with the correct information (it would not resolve at all before). However, now I get this error on server:

TypeError: headers.getSetCookie is not a function or its return value is not iterable
    at proxyResponseToResponseStub (C:\web projects\remix-firebase-test\node_modules\@remix-run\server-runtime\dist\single-fetch.js:292:25)
    at C:\web projects\remix-firebase-test\node_modules\@remix-run\server-runtime\dist\single-fetch.js:61:9
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Promise.all (index 1)
    at async C:\web projects\remix-firebase-test\node_modules\@remix-run\server-runtime\dist\single-fetch.js:39:19
    at async callDataStrategyImpl (C:\web projects\remix-firebase-test\node_modules\@remix-run\router\dist\router.cjs.js:4169:17)
    at async callDataStrategy (C:\web projects\remix-firebase-test\node_modules\@remix-run\router\dist\router.cjs.js:3702:19)
    at async loadRouteData (C:\web projects\remix-firebase-test\node_modules\@remix-run\router\dist\router.cjs.js:3677:19)
    at async queryImpl (C:\web projects\remix-firebase-test\node_modules\@remix-run\router\dist\router.cjs.js:3522:20)
    at async Object.query (C:\web projects\remix-firebase-test\node_modules\@remix-run\router\dist\router.cjs.js:3416:18)
    at async Object.singleFetchLoaders (C:\web projects\remix-firebase-test\node_modules\@remix-run\server-runtime\dist\single-fetch.js:161:18)
    at async handleSingleFetchRequest (C:\web projects\remix-firebase-test\node_modules\@remix-run\server-runtime\dist\server.js:203:146)
    at async requestHandler (C:\web projects\remix-firebase-test\node_modules\@remix-run\server-runtime\dist\server.js:114:18)
    at async nodeHandler (C:\web projects\remix-firebase-test\node_modules\@remix-run\dev\dist\vite\plugin.js:844:27)
    at async C:\web projects\remix-firebase-test\node_modules\@remix-run\dev\dist\vite\plugin.js:847:15

and this error on browser:

TypeError: Cannot read properties of null (reading 'name')
    at AboutPage (http://localhost:5173/app/routes/about.tsx:13:25)
    at renderWithHooks (http://localhost:5173/node_modules/.vite/deps/chunk-2CHT42SU.js?v=63ad2541:12171:26)
    at mountIndeterminateComponent (http://localhost:5173/node_modules/.vite/deps/chunk-2CHT42SU.js?v=63ad2541:14921:21)
    at beginWork (http://localhost:5173/node_modules/.vite/deps/chunk-2CHT42SU.js?v=63ad2541:15902:22)
    at beginWork$1 (http://localhost:5173/node_modules/.vite/deps/chunk-2CHT42SU.js?v=63ad2541:19749:22)
    at performUnitOfWork (http://localhost:5173/node_modules/.vite/deps/chunk-2CHT42SU.js?v=63ad2541:19194:20)
    at workLoopSync (http://localhost:5173/node_modules/.vite/deps/chunk-2CHT42SU.js?v=63ad2541:19133:13)
    at renderRootSync (http://localhost:5173/node_modules/.vite/deps/chunk-2CHT42SU.js?v=63ad2541:19112:15)
    at recoverFromConcurrentError (http://localhost:5173/node_modules/.vite/deps/chunk-2CHT42SU.js?v=63ad2541:18732:28)
    at performConcurrentWorkOnRoot (http://localhost:5173/node_modules/.vite/deps/chunk-2CHT42SU.js?v=63ad2541:18680:30)

While my Firebase debug setLogLevel('debug'); actually prints the correct value, when it didn't print anything before.

J

amaany3 commented 6 months ago

@jdgamble555 Please try enabling nativeFetch on this line

installGlobals({ nativeFetch: true });

https://github.com/jdgamble555/remix-firebase-test/blob/master/vite.config.ts#L6

same issue: https://github.com/remix-run/remix/issues/9324

jdgamble555 commented 6 months ago

It looks like that fixed it! Shouldn't this be the default?

J