Enabling React Native Debug mode causes Error: _expandEmbeddedObjectSchemas must be of type 'function', got (undefined)

[zunsakai]

Goals

Enable React Native Debug mode in order to troubleshoot console errors, set breakpoints, profile app, and monitor network requests.

Expected Results

Mobile app connects to React Native Debugger successfully and I'm able to set breakpoints, profile app, and monitor network requests, view console errors

Actual Results

Mobile App crashes with the following error

Error: _expandEmbeddedObjectSchemas must be of type 'function', got (undefined)

Steps to Reproduce

1. Run yarn ios to build react native application and install on device.
2. Shake device to reveal developer menu and select Debug .
   
3. An exception occurs on mobile app.

Component Exception
_expandEmbeddedObjectSchemas must be of type 'function', got (undefined)

Code Sample

import React, { useEffect, useState } from 'react'
import { SafeAreaView, Text } from 'react-native'
import Realm from 'realm'

const App = () => {
    const [realmDB, setRealmDB] = useState<Realm>()

    useEffect(() => {
        Realm.open({
            schema: [{ name: 'Dog', properties: { name: 'string' } }],
        }).then(realm => {
            realm.write(() => {
                realm.create('Dog', { name: 'Rex' })
            })
            setRealmDB(realm)
        })

        return () => {
            if (realmDB) {
                realmDB.close()
            }
        }
    }, [])

    return (
        <SafeAreaView>
            <Text>{realmDB ? 'Number of dogs: ' + realmDB.objects('Dog').length : 'Loading'}</Text>
        </SafeAreaView>
    )
}

export default App

Version of Realm and Tooling

• Realm JS SDK Version: 10.0.2
• Node or React Native: 0.63.3
• Client OS & Version: Iphone 7, iOS 14.2
• Which debugger for React Native: React Native Debugger 0.11.5

[osielmesa]

This is happening also in android with the example of the docs. If debug mode is not enabled, works like a charm.

[kraenhansen]

Thanks for reporting this.

I admit (and this is truly unfortunate) that we don't have in-depth integration tests for our library when running in Chrome debugging mode. The app that I was using to test the fix in #3411 inferred its schema, which lead to the unfortunate consequence that I didn't catch this case when solving the other issues.

I have a PR ready with a fix for this in #3446, which is currently in review and you can expect a new release as soon as this gets merged. Thank you all for your patience on this.

[saurabhtourtech]

I am facing the same issue i think the issue is still open

[tomduncalf]

Support for the React Native Chrome debugger with Realm is being deprecated, as it is no longer the recommended way to debug React Native applications. In our case, supporting the Chrome debugger requires many extra layers of indirection and workarounds, which means it does not work especially well and has a high maintenance overhead.

Instead we are moving to supporting the Flipper debugger, which will become the recommended way to debug React Native apps once the React Native project's migration to the Hermes engine is complete (at which point the Chrome Debugger will not work anywhere).

Please see our beta branch with Hermes support to try it out and provide feedback. Thanks for your patience!

[KaulSalil]

@tomduncalf I saw the error message that realm isnt compatible with chrome debug tools and supports flipper . I tried using flipper now I am getting the ""RSockets are being deprecated at Flipper. Please, use the latest Flipper client in your app to migrate to WebSockets." I am not sure how to proceed since flipper was automatically installed in my app . And upon using flipper my app starts hanging/crashing. The relevant versions are as follows:
"react-native": "0.68.0"
"realm": "11.0.0-rc.0"
flipper: version:[email protected] | MIT | deps: 12 | versions: 182
Mobile development tool . Any help or inputs would be appreciated .

[kraenhansen]

@KaulSalil unfortunately Tom is no longer on the Realm JS team. As a general advice, please consider creating your own issue. This will increase your likelihood of a fast resolution. In this particular instance, you should upgrade your app to the latest version of React Native to get the "latest version of the Flipper client in your app".

[ws333]

@KaulSalil

To make React Native use the latest compatible flipper version see https://fbflipper.com/docs/getting-started/react-native/

"Latest version of Flipper requires react-native 0.69+! If you use react-native < 0.69.0, please, downgrade react-native-flipper to 0.162.0 (see this GitHub issue for details)."

[KaulSalil]

@ws333 I tried using the latest version of everything (realm,react-native,react)[maybe I need to update flipper on the native side as well ] but I wasnt able to get flipper to work along with realm react native . I have been referring to the : https://www.mongodb.com/docs/realm/sdk/react-native/test-and-debug/debugging-with-flipper/ but havent been able to get it to work . In case react-native+realm+flipper works at your end please share the versions you are using . Opened a github issue for the same as well: #5440