[Bug] Sentry reports error with `open` function in CldUploadWidget

[andreidobrinski]

Bug Report

Describe the bug

Sentry is reporting a:

TypeError
Cannot read properties of undefined (reading 'open')

As a result of running the open render prop function with CldUploadWidget. I'll share more in a code example below

Is this a regression?

Not sure

Steps To Reproduce the error

1. Add CldUploadWidget to a Next app
2. Use the code below for the implementation
3. Run the app, connected to Sentry
4. See the issue pop up

Here is how I'm running the open function:

<CldUploadWidget uploadPreset={uploadWidgetPreset} onUpload={handleUpload} options={uploadWidgetParams}>
            {({ open }) => {
              function handleOnClick(e: React.MouseEvent<HTMLButtonElement>) {
                e.preventDefault();
                open();
              }
              return (
                <button onClick={handleOnClick}>Button</button>
              )}}
</CldUploadWidget>
                      

I'm calling this out because it's slightly different than the implementation in your docs:

<CldUploadWidget signatureEndpoint="<API Endpoint (ex: /api/sign-cloudinary-params)>">
  {({ open }) => {
    return (
      <button onClick={() => open()}>
        Upload an Image
      </button>
    );
  }}
</CldUploadWidget>

Expected behaviour

Sentry doesn't notice an issue

CodeSandbox or Live Example of Bug

n/a

Screenshot or Video Recording

Attaching a screenshot of Sentry's trace, if it helps

Your environment

• OS: iOS 17.1.1 (client that triggered issue)
• Node version: v18.17.0
• Npm version: 9.6.7
• Browser name and version: Mobile Safari 17.1.1 (client that triggered issue)

Thank you!

[adityagupta0251]

Hello @andreidobrinski,

I hope you are doing well. I am interested in working on [Bug] Sentry reports error with open function in CldUploadWidget (#586). Could you kindly assign this issue to me? I will carefully investigate the cause and propose a fix while adhering to the project’s standards.

Thank you very much for your consideration. 🙏

Best regards,
Aditya

[anurag2787]

Hy @eportis-cloudinary Could you please assign this to me? I would like to work on this.