postMessage behaving differently during end-of-meeting routine - possible bug?

Using ZoomSDK v. 0.16.9 (also tried .8, and .0) in the vanilla zoomapps-advancedsample-react (diff at the end)

Log of the inMeeting instance:

...
bundle.js:114 Message sent from meeting with data: "connected"
bundle.js:115 Calling postmessage... connected
...
bundle.js:114 Message sent from inMeeting with data: "/userinfo"
bundle.js:115 Calling postmessage... /userinfo
bundle.js:183 {action: 'ended', timestamp: 1678609498}
bundle.js:114 Message sent from inMeeting with data: "Goodbye"
bundle.js:115 Calling postmessage... Goodbye
...

Log of the inMainClient instance:

bundle.js:99 Meeting instance exists.
...
bundle.js:124 Message received inMainClient for tab change:  Objectpayload: {payload: '/userinfo'}timestamp: 1678609463[[Prototype]]: Object
bundle.js:124 Message received inMainClient for tab change:  {payload: '{\n\t"payload" : "Goodbye"\n}', timestamp: 1678609498}
...

Notice how both messages (the /userinfo and Goodbye ) are resolved identically when being sent, but differently when received. As the result, the payload of the last message does not resolve to an object.


diff of App.js:

diff --git a/frontend/src/App.js b/frontend/src/App.js
index 35a4866..e64e48b 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -2 +2 @@
-import { useLocation, useHistory } from "react-router-dom";
+import { useLocation, /* useHistory */ } from "react-router-dom";
@@ -13 +13 @@ function App() {
-  const history = useHistory();
+  // const history = useHistory();
@@ -59 +59 @@ function App() {
-          version: "0.16.0",
+          version: "0.16.9",
@@ -117 +117 @@ function App() {
-        let content = message.payload.payload;
+        // let content = message.payload.payload;
@@ -119 +119 @@ function App() {
-          "Message received " + receiver + " " + reason + ": " + content
+          "Message received " + receiver + " " + reason + ": ", message
@@ -121 +121 @@ function App() {
-        history.push({ pathname: content });
+        // history.push({ pathname: content });
@@ -128 +128 @@ function App() {
-    [history]
+    [/* history */]
@@ -182,0 +183,11 @@ function App() {
+  
+  useEffect(() => {
+    function onMeetingEventHandler(e) {
+      console.log(e);
+      sendMessage("Goodbye", runningContext);
+    }
+    if (!preMeeting && runningContext === "inMeeting") {
+      zoomSdk.addEventListener("onMeeting", onMeetingEventHandler);
+      return () => zoomSdk.removeEventListener("onMeeting", onMeetingEventHandler);
+    }
+  }, [preMeeting, runningContext]);

Does using console.dir() instead of console.log() resolve the discrepancy?

No it doesn’t :frowning: Output of

console.dir(message);
console.dir(message.payload);

for a message still in meeting:

bundle.js:125 Objectpayload: {payload: '/userinfo'}timestamp: 1679538423[[Prototype]]: Object
bundle.js:126 Objectpayload: "/userinfo"[[Prototype]]: Object

and after the onMeeting event:

bundle.js:125 Objectpayload: "{\n\t\"payload\" : \"Goodbye\"\n}"timestamp: 1679538485[[Prototype]]: Object
bundle.js:126 {
	"payload" : "Goodbye"
}

The whole message.payload comes in and is inferred as a string :man_facepalming:

This isn’t anything major - I’ve been handling it like this:

const { payload } = typeof message.payload === "string" ? JSON.parse(message.payload) : message.payload;

Just thought I’d bring it up since it might be a sign of other end-of-meeting routines not working as expected.

Thanks for testing that out! I created a bug for this and will keep you posted. (ZOOM-514388)

1 Like