🐛 TypeError: Cannot read property 'build' of null

[vyktoremario]

Description

When I run await HMSSDK.buid() I get an error [TypeError: Cannot read property 'build' of null]. The application uses Expo.

I followed the steps found on the documentation and I still get the same error. https://www.100ms.live/docs/react-native/v2/how-to-guides/install-the-sdk/integration I also cloned one of the sample apps and I got the same error

100ms React Native Version

1.7.0

Steps to reproduce

1. Start a react-native app with expo and install the 100ms dependency
2. Add the basic implementation for creating a video conference call or create a function that calls await HMSSDK.buid() and call the function inside the useEffect in the App.js
3. Check the log to see the above error printed out.

Expected results

On calling await HMSSDK.buid(), I expect an instance of hms is returned so that I can have access to all the method in the class.

Code example, screenshot, or link to a repository

Code sample

```jsx const ROOM_CODE = MODERATOR_ROOM_CODE; const AUTH_TOKEN = MODERATOR_AUTH_TOKEN; const hmsInstanceRef = useRef(null); const RoomScreen = ({ handleRoomEnd }) => { const [peerTrackNodes, setPeerTrackNodes] = useState([]); const [loading, setLoading] = useState(true); // Joining a room const onJoinSuccess = (data) => { const { localPeer } = data.room; setPeerTrackNodes([{ peer: localPeer, track: localPeer.videoTrack }]); setLoading(false); }; //Listening for peers actions in a room const onPeerListener = ({ peer, type }) => { if (type === HMSPeerUpdate.PEER_LEFT) { setPeerTrackNodes((prevNodes) => prevNodes.filter((node) => node.peer.peerID !== peer.peerID) ); } else if (type !== HMSPeerUpdate.PEER_JOINED) { setPeerTrackNodes((prevNodes) => prevNodes.map((node) => node.peer.peerID === peer.peerID ? { ...node, peer } : node ) ); } }; // Listen for audo, video track controls in a room by a peer const onTrackListener = ({ peer, track, type }) => { if ( type === HMSTrackUpdate.TRACK_ADDED && track.type === HMSTrackType.VIDEO ) { setPeerTrackNodes((prevNodes) => [...prevNodes, { peer, track }]); } else if ( type === HMSTrackUpdate.TRACK_MUTED || type === HMSTrackUpdate.TRACK_UNMUTED ) { setPeerTrackNodes((prevNodes) => prevNodes.map((node) => { if ( node.peer.peerID === peer.peerID && node.track && node.track.trackId === track.trackId ) { return { ...node, track }; } return node; }) ); } }; // Listen for error const onErrorListener = (error) => { setLoading(false); console.log(error?.description); }; const getTrackSettings = ({ mutedAudio, mutedVideo, }) => { let audioSettings = new HMSAudioTrackSettings({ initialState: mutedAudio ? HMSTrackSettingsInitState.MUTED : HMSTrackSettingsInitState.UNMUTED, }); let videoSettings = new HMSVideoTrackSettings({ initialState: mutedVideo ? HMSTrackSettingsInitState.MUTED : HMSTrackSettingsInitState.UNMUTED, cameraFacing: HMSCameraFacing.FRONT, forceSoftwareDecoder: true, }); return new HMSTrackSettings({ video: videoSettings, audio: audioSettings, }); }; useEffect(() => { const joinRoom = async () => { try { setLoading(true); const trackSettings = getTrackSettings({ mutedAudio: true, mutedVideo: true, }); const hmsInstance = await HMSSDK.build({trackSettings}); if (hmsInstance) { console.log("hmsInstance built"); } hmsInstanceRef.current = hmsInstance; const token = AUTH_TOKEN || (await hmsInstance.getAuthTokenByRoomCode(ROOM_CODE)); const config = new HMSConfig({ authToken: token, username: USERNAME }); await hmsInstance.join(config); hmsInstance.addEventListener( HMSUpdateListenerActions.ON_JOIN, onJoinSuccess ); hmsInstance.addEventListener( HMSUpdateListenerActions.ON_PEER_UPDATE, onPeerListener ); hmsInstance.addEventListener( HMSUpdateListenerActions.ON_TRACK_UPDATE, onTrackListener ); hmsInstance.addEventListener( HMSUpdateListenerActions.ON_ERROR, onErrorListener ); } catch (error) { console.error(error); Alert.alert("Error", "Check your console to see error logs!"); } }; joinRoom(); return () => { handleRoomEnd(); }; }, [handleRoomEnd]); const renderItem = ({ item }) => { const { peer, track } = item; return ( {track && track.type === HMSTrackType.VIDEO ? ( ) : ( {peer.name .split(" ") .map((item) => item[0]) .join("")} )} ); }; return ( {loading ? ( ) : peerTrackNodes.length > 0 ? ( item.peer.peerID} contentContainerStyle={{ paddingBottom: 120 }} /> ) : ( Welcome! You're the first one here. Sit back and relax till the others join. )} Leave Room ); }; ``` ### Logs

Logs

```console ```

[stanwolverine]

@vyktoremario are you using expo go app?

[vyktoremario]

@vyktoremario are you using expo go app?

@stanwolverine yes I am using Expo go app

[ygit]

@vyktoremario Have you done the Expo Dev Client setup? Check the steps mentioned here: https://www.100ms.live/docs/react-native/v2/how-to-guides/install-the-sdk/integration#expo-setup This is a sample app using Expo + 100ms React Native package: https://github.com/ygit/expo-react-native-hms

[vyktoremario]

@vyktoremario Have you done the Expo Dev Client setup? Check the steps mentioned here: https://www.100ms.live/docs/react-native/v2/how-to-guides/install-the-sdk/integration#expo-setup This is a sample app using Expo + 100ms React Native package: https://github.com/ygit/expo-react-native-hms

@ygit I have followed the steps in the docs and it still doesn't work for me.(Mind you, expo-cli is deprecated ) I will clone the repo you linked and see if it works for me. I Will respond back.

[ygit]

alright @vyktoremario Let us know. We can also get on a call to debug this or any other help you need in integrating the 100ms package. Block a convenient time here: https://calendly.com/yogesh-singh-100ms/30min

[vyktoremario]

@vyktoremario Have you done the Expo Dev Client setup? Check the steps mentioned here: https://www.100ms.live/docs/react-native/v2/how-to-guides/install-the-sdk/integration#expo-setup This is a sample app using Expo + 100ms React Native package: https://github.com/ygit/expo-react-native-hms

@ygit I have followed the steps in the docs and it still doesn't work for me(Mind you, expo-cli is deprecated ) I will clone the repo you linked and see if it works for me. I Will respond back.

I just cloned the repo you linked and it still doesn't work for me. First, expo-cli is deprecated and they suggested to use npx expo start and that only works for version 47 and above. Secondly, when I run expo start --dev-client, the Expo Go app doesn't load/build the app at all(on an Android device) even when I scan the QR code. The repo uses expo version 44.0.0 while the application I am using is currently using 47.0.13.

Does this only work if I use Xcode or an Android emulator? Or do you expect this to work even with Expo Go app on an Android device?

[vyktoremario]

I just booked a time for tomorrow. Looking forward to speaking to you guys about this issue

[ygit]

Sure. Likewise

[vyktoremario]

So, I was able to get past this issue. My colleagues were insisting on using Expo so I had to use Expo development build due to native code being required (as @ygit mentioned on the call). These are the steps I took (Incase the docs will need to be changed):

1. Install eas cli

npm install -g eas-cli

2. Install Expo dev client

npx expo install expo-dev-client

3. Log into my Expo account

eas login

4. Create a development build for android emulator or device. Link to docs https://docs.expo.dev/develop/development-builds/create-a-build/?redirected

eas build --profile development --platform android

5. Download the apk build and install it into your emulator (or device)
6. Start the local server using npx expo start --dev-client
7. Copy the local URL and past it on the installed app (required for the app to run)

This works fine and the HMMSDK class is being built and returns an instance.

But I get the below error once in a while and I don't know if you guys have an idea why it is showing up. Thanks

There's this error I get: 
Unable to resolve host "prod-init.100ms.live": No address associated with hostname. [SignalDisconnect] Could not recover in 60000 milli seconds.

[ygit]

hey @vyktoremario are you still facing this issue? is it happening everytime?

[vyktoremario]

hey @vyktoremario are you still facing this issue? is it happening everytime?

@ygit I can confirm that I haven't had this error ever since that day. It looks to work as expected.

Thanks!

[ygit]

Nice 🙌 Let us know if you need help with anything else. Closing this issue thread.

[vyktoremario]

@ygit While I am still here, I have a question.

Suppose I create a room on the 100ms dashboard and joined in as a moderator. Then copied one of the room codes and used it to join on my locally running development app, should I be able to see the user that joined on the dashboard or anyone that joins on the dashboard?
Cos right now I don't. It shows I am the only one in the room on my end but also informs the dashboard user that I joined the room.