Method then is not available in this version of Zoom Apps SDK and might not work correctly. Please, update your version of Zoom Apps SDK

Zoom Apps Configuration
Share the Zoom Apps configuration (e.x. React, Vanilla JS, Node.js) you’re working with to give relevant context.
Moving from old version of SDK (downloaded minified file) to new SDK node module version. Using it with React/Node.

Description
Details on your question, workflow or the problem you’re trying to solve.
After I run .config, I get a successfully configured SDK object, but then code keeps running on the Zoom side and it errors out and my app hangs.

Error?
The full error message or issue you are running into, where applicable.
This is the breakdown of what happens when I try and start my Zoom App:

  1. I begin to render my React app
  2. I use the new Zoom SDK Node Module (version 0.16.8) and call zoomSdk.config with my options
  3. I receive a successful response on the frontend from the config call:

handler: {get: function}

target: ZoomSdk {_version: "0.16.8", _postMessage: function, _clientVersion: "5.13.11.16405", native2js: function, callZoomApi: function, …}
  1. I expect the Zoom SDK to be finished running, as it has returned my value, however, I receive this warning:
    Method then is not available in this version of Zoom Apps SDK and might not work correctly. Please, update your version of Zoom Apps SDK - sdk.es.js:992

  2. Then there is an error:

    [native code]
}ms to respond

Troubleshooting Routes
The troubleshooting attempt types you’ve already exhausted, including testing with the appropriate sample app (found on Zoom · GitHub).
I have gone into the node module and added some logging. The error is occurring in the generator at @zoom/appssdk/dist/sdk.es.js line 982.
I logged the variables in the generator and received the following:

apiName: "then"
data: function () { [native code] }
timeout: function () { [native code] }

I’ll add some screenshots as well.

How To Reproduce
Steps to reproduce the behavior.
See above.

I was trying to add screenshots, but it says media embeds are not allowed (even though there’s an image attachment option), so I’m not able to do so right now.
Also, something seems to have edited my code snippets above? Can attempt to resend those if it’s helpful.

Thanks for sharing details about the issue that you’re encountering. Are you able to share the code that you are using to call config() and the function that results in that error?

I also upgraded your account from a new user so that you can post screenshots.

(I meant to post this yesterday – got distracted by a meeting, apologies.)

Thank you for doing that! I’ll post the screenshots now. And yes, here’s the relevant code.

In the React component for the landing page:

async componentDidMount() {
   // we do an internal auth check, everything is fine here

    console.log('about to get meeting id');

    const { meetingId, parentId } = await getMeetingUUID(); // imported from ./helpers/zoom-sdk

    console.log('got id ', meetingId);

    await addBreakoutRoomListener(this.props.history.push); // imported from ./helpers/zoom-sdk
    
    // more internal code
  }

In the ./helpers/zoom-sdk.ts file containing the imports above:

import zoomSdk, {
  // Zoom type definitions
  Apis,
} from '@zoom/appssdk';

const _getZoomSdk: GetZoomSDK = async () => {
  console.log('in get zoom sdk ');

  try {
    console.log('trying to config ');

    const configResponse = await zoomSdk.config({ capabilities: apis }); // apis is just a list of requested capabilities

    // we do some internal work to configure correctly based on the user's role

    console.log('configured successfully'); // we log this
  } catch (err: any) {
    console.log('error with config '); // no error is caught here
    // internal error handling
  }

  console.log('returning sdk ', zoomSdk); // we log this successfully

  return zoomSdk;
};

export const getMeetingUUID: SDKGetMeetingUUID = async () => {
  try {
    console.log('getting sdk in uuid');
    const configuredZoomSdk = await _getZoomSdk();
    
    console.log('got my zoom sdk ', configuredZoomSdk); // we do not log this, as the app is now hanging
    
   const {
      meetingUUID,
      parentUUID,
    } = await configuredZoomSdk.getMeetingUUID();
   
    return { meetingId: meetingUUID, parentId: parentUUID };
  } catch (err) {
    console.log('i got an error here ', err); // you can see in the screenshots that no error is caught here
   // then we do internal error handling
  }
  return { meetingId: undefined };
};

Screenshots:

Thanks for providing those details! I’m not seeing why this would be happening so I’ve reached out to our team for more insight. I’ll let you know when I have the next steps.

In the meantime, does removing the try/catch block from the GetZoomSDK function allow an error to be passed to the parent try/catch block?

Thanks for taking a look and helping out!

Unfortunately there’s no change when removing the try/catch block :slightly_frowning_face: (other than me logging some gibberish to confirm my builds were recompiling)

I know that you’re using the NPM package but try setting the version parameter in the config function to the version of your NPM package and let me know if that helps to resolve the issue.

Hey there, I tried that out and unfortunately there’s no change.

I don’t know where the error is originating from (why “then” is being considered a method), but if it’s helpful, I’ve found where the code is breaking due to an unhandled promise rejection.

In sdk.es.js there’s a function __awaiter on line 49. There’s a method on this function called step which does not handle promise rejections, and this is what’s causing the code to hang here. I’ve been able to kind of “fix” things by handling the rejection (the code kind of just moves past the rejected then) but this obviously doesn’t solve the underlying issue, and obviously I don’t want to be relying on modified node modules in the code. But maybe that’s helpful on your end for debugging?