Bug - Clicking the Participants icon triggers Crash

Problem
Click Participants in the 2.3.0 Zoom SDK triggers crash “React is not defined”

SDK Version
Web SDK 2.3.0

1 Like

Hey @developer-whova ,

Can you share a screenshot and steps to reproduce? Are you using the Angular Sample App?

Thanks,
Tommy

I am using the React App, it is very easy to reproduce just click the Participants icon in the meeting

image

image

Screenshots above @tommy

Hey @developer-whova ,

Looks like this is a new issue in version 2.3.0. I tested in 2.2.0 and did not experience this.

We will fix it, stay updated here: Changelog

In the meantime, you can add this react script to your index.html which will resolve the error and crash:

<script src="https://source.zoom.us/2.3.0/lib/vendor/react.min.js"></script>

Thanks,
Tommy

Yes I mentioned it is only 2.3.0 …

1 Like

Hey @developer-whova ,

Yes, apologies for the regression. We will be fixing it in our next release 2.3.5 (ZOOM-355723).

In the meantime, I marked the workaround as the solution to help anyone else experiencing this .

Thanks,
Tommy

@tommy

Do you have a date for an urgent fix for that ? We cannot rely on the provided workaround, and we need the Chrome 100 fix before it’s out.

We confirm that we also have it. Also we found many new javascripts errors generated when connecting to a meeting, especially two new error logs about new thread as illustrated below.

How to reproduce it:

  • using ReactJS
  • as soon as clicking on the participant button, the participant quickly show up and then the zoom window completely turns black
  • we also could reproduce the same or similar when turning on the video, by clicking on the video button. But it’s less frequent to happen.

From the browser logs, there is clearly something wrong happening in the SDK, and a signal to “destroy” the SDK seems to be received, probably at the origin of the UI turning completely black

Note: Is the workaround only for people using Zoom CDN ? Would it work for people using NPM and caching Zoom resources on their own CDN ?

Hey @nvivot ,

The workaround is providing React on the window/globally so the SDK can use it. This workaround applies only to the NPM flow.

The CDN only approach requires React to be included: https://marketplace.zoom.us/docs/sdk/native-sdks/web/build#install-from-cdn

Thanks,
Tommy

1 Like

@tommy

Understood, then i will apply the workaround to be able to continue to test the 2.3.0 before your release a fix for that.

Here are the full logs when joining the meeting and then clicking on the participant button.

We already reported many times that the Zoom SDK generates tons of javascript warning / error logs when loading/joining the meeting, or when interacting with the UI elements as the SDK try to discover some DOM elements/properties based on generated names that does not seems to match types or syntax.

Please check the logs below, you’ll find many similar to that:

React does not recognize the bsClass prop on a DOM element.

Would be nice if you can also work on it, the SDK is so “dirty” for a while now, very annoying for us as this shown a lot of false positives errors on our monitoring tools that pollute the monitoring itself.

Full browser console logs

zoomus-websdk.umd.min.js:2 prepareJssdk change to prepareWebSDK
zoomus-websdk.umd.min.js:2 pre load wasm success: /vendors/zoomus/2.3.0/lib/av/1501_audio.encode.wasm
zoomus-websdk.umd.min.js:2 pre load wasm success: /vendors/zoomus/2.3.0/lib/av/1501_video.simd.wasm
zoomus-websdk.umd.min.js:2 -- Ping RWC Success --,https://rwcty.ty.zoom.us/wc/ping/95167504319?ts=1647433900968&auth=uFKVqSW6_gWfDRsJn6IMy-zfxz_i_VGmeps-atRG_00&rwcToken=nQcoAvUnqNkaigtcVXaLvdPUYw9P1axMqeTAVBtGL0g&dmz=1
zoomus-websdk.umd.min.js:2 -- Ping RWC Success --,https://rwcsg.cloud.zoom.us/wc/ping/95167504319?ts=1647433900968&auth=uFKVqSW6_gWfDRsJn6IMy-zfxz_i_VGmeps-atRG_00&rwcToken=Qs9j0Ki7Nr__onsA6mrE1aNcc3rOFHUaXsrKmnlhIWA&dmz=1
zoomus-websdk.umd.min.js:2 -- Ping RWC Success --,https://rwcsc.sc.zoom.us/wc/ping/95167504319?ts=1647433900968&auth=uFKVqSW6_gWfDRsJn6IMy-zfxz_i_VGmeps-atRG_00&rwcToken=NIGjkEyX77lFNDq-W7hcjNCH-7BA9DACbte2EwufA2E&dmz=1
zoomus-websdk.umd.min.js:2 -- Ping RWC Success --,https://rwcny.ny.zoom.us/wc/ping/95167504319?ts=1647433900968&auth=uFKVqSW6_gWfDRsJn6IMy-zfxz_i_VGmeps-atRG_00&rwcToken=SruaHz4GxvvIz_v_73qMcnxOGmTvMWY7JhhRPryH9pk&dmz=1
zoomus-websdk.umd.min.js:2 -- Ping RWC Success --,https://rwcdv.dv.zoom.us/wc/ping/95167504319?ts=1647433900968&auth=uFKVqSW6_gWfDRsJn6IMy-zfxz_i_VGmeps-atRG_00&rwcToken=_-Dd2_IkA-u9aawJ5x_pxSnYnBgEkoII3N-zT8d-Qt0&dmz=1
trackConsoleError.js:35 Warning: Failed prop type: The prop `id` is required to make `t` accessible for users of assistive technologies such as screen readers.
    in t (created by Uncontrolled(t))
    in Uncontrolled(t)
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: React does not recognize the `bsRole` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `bsrole` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
    in button (created by ForwardRef)
    in ForwardRef (created by t)
    in div (created by t)
    in t (created by t)
    in t (created by Uncontrolled(t))
    in Uncontrolled(t)
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: React does not recognize the `noCaret` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `nocaret` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
    in button (created by ForwardRef)
    in ForwardRef (created by t)
    in div (created by t)
    in t (created by t)
    in t (created by Uncontrolled(t))
    in Uncontrolled(t)
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: React does not recognize the `pullLeft` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `pullleft` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
    in button (created by ForwardRef)
    in ForwardRef (created by t)
    in div (created by t)
    in t (created by t)
    in t (created by Uncontrolled(t))
    in Uncontrolled(t)
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: React does not recognize the `bsClass` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `bsclass` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
    in button (created by ForwardRef)
    in ForwardRef (created by t)
    in div (created by t)
    in t (created by t)
    in t (created by Uncontrolled(t))
    in Uncontrolled(t)
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: React does not recognize the `Dropdown` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `dropdown` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
    in div (created by t)
    in t (created by t)
    in t (created by Uncontrolled(t))
    in Uncontrolled(t)
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: Each child in a list should have a unique "key" prop.

Check the top-level render call using <div>. See https://fb.me/react-warning-keys for more information.
    in Connect(Component)
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: Each child in a list should have a unique "key" prop.

Check the render method of `fe`. See https://fb.me/react-warning-keys for more information.
    in Connect(Component) (created by fe)
    in fe (created by Connect(fe))
    in Connect(fe)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: Invalid ARIA attribute `ariaLabel`. Did you mean `aria-label`?
    in button (created by ForwardRef)
    in ForwardRef (created by v)
    in div (created by v)
    in v (created by Connect(v))
    in Connect(v) (created by fe)
    in div (created by fe)
    in div (created by fe)
    in footer (created by fe)
    in fe (created by Connect(fe))
    in Connect(fe)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?
    in Unknown
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by fe)
    in div (created by fe)
    in div (created by fe)
    in footer (created by fe)
    in fe (created by Connect(fe))
    in Connect(fe)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
zoomus-websdk.umd.min.js:2 creatAVSocket
zoomus-websdk.umd.min.js:2 >>>>>>>> CREATE JSMEDIASKD INSTANCE <<<<<<<<
zoomus-websdk.umd.min.js:2 !!image && image !== LOAD_ERROR false
zoomus-websdk.umd.min.js:2 >>>>>>>>INIT JSMEDIASDK<<<<<<<<
zoomus-websdk.umd.min.js:2 initSharingDecode
zoomus-websdk.umd.min.js:2 initSharingEncode
zoomus-websdk.umd.min.js:2 initVideoDecode
zoomus-websdk.umd.min.js:2 initVideoEncode
zoomus-websdk.umd.min.js:2 initAudioDecode
zoomus-websdk.umd.min.js:2 initAudioEncode
1501_js_media.min.js:1 sharing decode fileURL: /vendors/zoomus/2.3.0/lib/av/1501_sharing_mtsimd.min.js
1501_js_media.min.js:1 /vendors/zoomus/2.3.0/lib/av/1501_video_mtsimd.min.js
trackConsoleError.js:35 Warning: Each child in a list should have a unique "key" prop. See https://fb.me/react-warning-keys for more information.
    in p
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: Received `true` for a non-boolean attribute `highlight`.

If you want to write it to the DOM, pass a string instead: highlight="true" or highlight={value.toString()}.
    in a (created by t)
    in t (created by t)
    in li (created by t)
    in t (created by ForwardRef)
    in ForwardRef
    in ul (created by t)
    in RootCloseWrapper (created by t)
    in t (created by ForwardRef)
    in ForwardRef (created by t)
    in div (created by t)
    in t (created by t)
    in t (created by Uncontrolled(t))
    in Uncontrolled(t)
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in Unknown (created by fe)
    in div (created by fe)
    in div (created by fe)
    in footer (created by fe)
    in fe (created by Connect(fe))
    in Connect(fe)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?
    in Unknown
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by fe)
    in div (created by fe)
    in div (created by fe)
    in footer (created by fe)
    in fe (created by Connect(fe))
    in Connect(fe)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
​ ready to start!
​ ready to start!
​ ready to dec video!
​ ready to dec video!
​ JsAudioDec.js receive startMedia
​ JsAudioDec.js receive startMedia
​ Open_Audio_WebSocket_Connect
​ Open_Audio_WebSocket_Connect
​ Open_Sharing_WebSocket_Connect
​ Open_Video_WebSocket_Connect
​ Open_Sharing_WebSocket_Connect
​ startMedia
​ getNewWorker!!!!!!!!!!!!!!
PThread.getNewWorker @ blob:https://app.gol…af41-4db51c15638f:1
​ encode asking thread
PThread.getNewWorker @ blob:https://app.gol…af41-4db51c15638f:1
​ Open_Video_WebSocket_Connect
Meeting.js:226 Object
trackConsoleError.js:35 Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?
    in Unknown
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by fe)
    in div (created by fe)
    in div (created by fe)
    in footer (created by fe)
    in fe (created by Connect(fe))
    in Connect(fe)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?
    in Unknown
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by fe)
    in div (created by fe)
    in div (created by fe)
    in footer (created by fe)
    in fe (created by Connect(fe))
    in Connect(fe)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?
    in Unknown
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by fe)
    in div (created by fe)
    in div (created by fe)
    in footer (created by fe)
    in fe (created by Connect(fe))
    in Connect(fe)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
zoomus-websdk.umd.min.js:2 --- succesCallBack ---
zoomus-websdk.umd.min.js:2 Object
​ consume interval 3
​ exit thread isvb undefined
PThread.returnWorkerToPool @ blob:https://app.gol…af41-4db51c15638f:1
​ getNewWorker!!!!!!!!!!!!!!
PThread.getNewWorker @ blob:https://app.gol…af41-4db51c15638f:1
​ encode asking thread
PThread.getNewWorker @ blob:https://app.gol…af41-4db51c15638f:1
​ handle ready but predict not ok!
​ handle ready but predict not ok!
​ handle ready but predict not ok!
​ handle ready but predict not ok!
trackConsoleError.js:35 Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?
    in Unknown
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by fe)
    in div (created by fe)
    in div (created by fe)
    in footer (created by fe)
    in fe (created by Connect(fe))
    in Connect(fe)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
zoomus-websdk.umd.min.js:2 Uncaught ReferenceError: React is not defined
    at e (webpack:///./node_modules/@zoomus/websdk/dist/zoomus-websdk.umd.min.js?:2:276709)
    at eval (webpack:///./node_modules/@zoomus/websdk/dist/zoomus-websdk.umd.min.js?:2:1614930)
    at renderWithHooks (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:12938:18)
    at updateFunctionComponent (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:14627:20)
    at beginWork (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:15637:16)
    at performUnitOfWork (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:19312:12)
    at workLoop (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:19352:24)
    at HTMLUnknownElement.callCallback (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:149:14)
    at Object.invokeGuardedCallbackDev (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:199:16)
    at invokeGuardedCallback (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:256:31)
zoomus-websdk.umd.min.js:2 socket closing... 
zoomus-websdk.umd.min.js:2 destroy SDK
l @ zoomus-websdk.umd.min.js:2
trackConsoleError.js:35 The above error occurred in one of your React components:
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in Connect(Component) (created by c)
    in ul (created by c)
    in div (created by t)
    in section (created by t)
    in t (created by c)
    in div (created by c)
    in c (created by Connect(c))
    in Connect(c)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://fb.me/react-error-boundaries to learn more about error boundaries.
eval @ trackConsoleError.js:35
react-dom.development.js:20312 Uncaught ReferenceError: React is not defined
    at e (webpack:///./node_modules/@zoomus/websdk/dist/zoomus-websdk.umd.min.js?:2:276709)
    at eval (webpack:///./node_modules/@zoomus/websdk/dist/zoomus-websdk.umd.min.js?:2:1614930)
    at renderWithHooks (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:12938:18)
    at updateFunctionComponent (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:14627:20)
    at beginWork (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:15637:16)
    at performUnitOfWork (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:19312:12)
    at workLoop (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:19352:24)
    at renderRoot (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:19435:7)
    at performWorkOnRoot (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:20342:7)
    at performWork (webpack:///./node_modules/@zoomus/websdk/node_modules/react-dom/cjs/react-dom.development.js?:20254:7)
trackConsoleError.js:35 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div (created by n)
    in n (created by n)
    in div (created by n)
    in n
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.
    in ae (created by Connect(ae))
    in Connect(ae) (created by fe)
    in div (created by fe)
    in div (created by fe)
    in footer (created by fe)
    in fe (created by Connect(fe))
    in Connect(fe)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
eval @ trackConsoleError.js:35
trackConsoleError.js:35 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.
    in R (created by Connect(R))
    in Connect(R)
    in div
    in div (created by n)
    in n (created by n)
    in div (created by n)
    in n
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component)
    in div
    in div
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by s)
    in div (created by s)
    in div (created by s)
    in s (created by i)
    in i
    in Unknown (created by Connect(Component))
    in Connect(Component) (created by b)
    in div (created by b)
    in b (created by Connect(b))
    in Connect(b) (created by a)
    in div (created by a)
    in a (created by Connect(a))
    in Connect(a) (created by p)
    in div (created by p)
    in Unknown (created by p)
    in p
1 Like

Thanks @nvivot , I agree the logs should be cleaned up, we are working on that!. :slight_smile:

-Tommy

1 Like

@tommy Thanks.

I added the workaround and confirm it’s temporary fixing the issue. We will continue to test the SDK, thanks again for your quick replies.

1 Like

Happy to hear that @nvivot ! :slight_smile:

-Tommy

@tommy
Sorry to bother you with that.

Can’t you release a 2.3.1 hot fix including the React fix ? It was already the same story with the release 2.2.0 where you messed up with the NPM resources and we had to patch it ourself on our CI as a workaround, just because you did not work to release a patch for that (for the NPM package, you fixed your CDN resources)

If you are not working on a 2.3.1 patch, you said the fix would be included into the 3.2.5. Why such a “late” version for such a critical fix, and when will the 2.3.5 be released exactly ?

Having a workaround is something, using the workaround on production is another and we don’t want to go on production with that workaround if it can be avoided.
We opt in a solution where we are not dependent on your CDN, but this workaround is creating a dependency on your CDN, therefore we don’t want to go on production with that.

The problem of fixing issue into new features release instead of patch release is that you always include things that break something else. So it’s kinda risky for us to wait next official release to have a bug fix, if the next release is a no go due to other breaks.

Note: we continued the test and did not find any critical issue, well, nothing that was not already reported in previous release and that still seems not to be fixed. (screen sharing tab bugs for example)

Hey @nvivot ,

Since there is a reasonable workaround, we are fixing the issue in 2.3.5 planned for later this month.

The CDN is our production SDK CDN, it is completely reliable.

https://marketplace.zoom.us/docs/sdk/native-sdks/web/build#install-from-cdn

We appreciate the feedback and will be extra diligent during our testing to catch any of these before the release.

Thanks,
Tommy

We got many regular issues by the past accessing the SDK resources hosted on your CDN (*.zoom.us) and did not get any issues since we switched to our own.
I’m sorry to say that but from our experience it’s not reliable, and this recent incident on your CDN prove it (just in case)

Understand that my intention here is not to discredit you, just to show the reason why we moved on our own CDN, and why we won’t get back to your.

If possible, could you please take into consideration that people are not all using your CDN when designing fixes / workaround / features.

Regards.

Hey @nvivot ,

We are working to get 2.3.5 early next week. Please stay tuned.

Thanks,
Tommy

@tommy

Thank you very much !

I just reported another issue here that we started to have on production as soon as we upgraded to the SDK 2.3.0, and i suspect that this could come from the workaround, some sort of incompatibility between the React loaded from the workaround & use by Zoom, and the React from the compiled sources of our application & used by our application.
On our application we have draggable component on top of Zoom UI, modifying the DOM as well.

We appreciate if you can have a look at it as well.

Regards.

Hey @nvivot , @developer-whova ,

Fixed in version 2.3.5:

Thanks for your patience on this one.

-Tommy

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.