Issues with #zmmtg-root div element

Description
Error ‘react-modal: No elements were found for selector #zmmtg-root.’ is logged multiple times in sentry. We don’t have any logic which can cause above error so I feel it’s an issue with the web SDK. Can you please let me know what could cause the above error and how can we fix it?

Error
react-modal: No elements were found for selector #zmmtg-root.

Which version?
1.8.5

To Reproduce
I do not have any specific steps to reproduce this error but it keeps getting logged in sentry. I also feel it’s an issue only after upgrading to 1.8.5. Earlier we were using 1.7.10 and haven’t come across this error.

Additional context
we are using something similar to this Please init meeting first! Error when adding div id="zmmtg-root" inside a React component - #8 by mehdi.rouis to load meeting UI in custom div and we hide #zmmtg-root div added in the body.

Hey @acceluser8866,

Thank you for reaching out to the Zoom Developer Forum. Please try upgrading to the latest version of the Web SDK (1.9.0) and let me know if that resolves your issues.

If that’s not helpful, are you able to share a public git repo of the code that exhibits this issue?

Thanks,
Max

@MaxM Thanks for your reply!
I am not sure if upgrading the SDK will help but if you are sure that it will resolve then we can try to upgrade. Zoom has a lot of issues with CSS which we have managed on our end so upgrading is not a quick task. I am using the same code which is listed in the sample app the only difference is in which element I rendered which I also mentioned above so I will like to know if you internally use that selector because else there is no way to identify on our end what is the issue.

Hey @acceluser8866,

Thank you for the update. I’m not positive this will resolve the issue but if we determine this is a problem with the Web SDK the first step is to make sure that we are using the latest version.

When attempting to reproduce the issue on my end, using the Sample Web App I’m not seeing the same behavior. I would first test with that and then see if you can identify any issues with your implementation if you don’t see the same issue.

Zoom has a lot of issues with CSS which we have managed on our end so upgrading is not a quick task.

We are working to provide a more customizable version of the Web SDK soon. For now, custom CSS is the best method to adjust the display of the meeting but as you’ve seen it can introduce new issues and cause more work when attempting to upgrade to a newer version.

Thanks,
Max