[wasm] loginWithPopup is not working

[shovelmn12]

Checklist

• The issue can be reproduced in the auth0_flutter sample app (or N/A).
• I have looked into the Readme, Examples, and FAQ and have not found a suitable solution or answer.
• I have looked into the API documentation and have not found a suitable solution or answer.
• I have searched the issues and have not found a suitable solution or answer.
• I have searched the Auth0 Community forums and have not found a suitable solution or answer.
• I agree to the terms within the Auth0 Code of Conduct.

Description

When passing String params to the SDK it fails to login as String is not a JSAny.

auth0-flutter/auth0_flutter/lib/src/web/js_interop_utils.dart

Line 30 in 1fccddf

obj.setProperty(key.toJS,value as JSAny);

This line should be changed to value.toJS

Also because of your defenition of params the funcationaddCustomParams<T extends JSObject>(final T obj, final Map<String, dynamic> params) should use final Map<String, String> params and not final Map<String, dynamic> params

After fixing this error loginWithPopup still did not work, I am getting error cancelled: Popup closed

I tried removing parameters and I am still getting the same error error cancelled: Popup closed

Reproduction

Pass String params to loginWithPopup and you will get an error Type 'String' is not a subtype of type 'JSValue' in type cast

if this is fixed then the next error you will get is error cancelled: Popup closed

Additional context

No response

auth0_flutter version

1.9.0

Flutter version

3.29.1

Platform

Web

Platform version(s)

wasm

[pmathew92]

Hi @shovelmn12 , Thanks for bringing this to our notice. We will take a look and address this issue

[shovelmn12]

@pmathew92 I checked the popup's console and I am getting the following:

{type: "authorization_response",response: {"error":"invalid_request","error_description":"authorization request parameter organization must be an organization id","state":"MVBMMHlvfmVSbHJBVzF1OW1icC5RZWJUUEpWWXowd0Jack1wbU5iTXJ3RQ=="}};

I am not setting any organizationId from flutter ... we dont use organizations

[shovelmn12]

@pmathew92 ok after further investigation I figured out the pop window thats opened is marked as closed on open.

popup opened 
Window {window: Window, self: Window, document: document, name: 'auth0:authorize:popup', location: Location,
blur: ƒ blur()
close: ƒ close()
closed: true,
...}

I added the following lines to .js SDK:

    if (!config.popup) {
      config.popup = openPopup('');

      console.log('popup opened', config.popup); // print popup

      if (!config.popup) {
        throw new Error(
          'Unable to open a popup for loginWithPopup - window.open returned `null`'
        );
      }
    }

https://github.com/auth0/auth0-spa-js/blob/8b1609d3b91a96dbded37039913e3c5e72a5c78c/src/Auth0Client.ts#L361

therefore I am always getting Popup closed error ...

Edit: Aha!

https://developer.mozilla.org/en-US/docs/Web/API/Window/open#same-origin_policy

https://stackoverflow.com/questions/50143828/window-closed-is-always-true

Take into account, that [window.closed](https://developer.mozilla.org/en-US/docs/Web/API/Window/closed) always returns true, if the newly opened URL isn't from the same origin / domain as it is opened from

Edit 2: Both including null values in the URL and window.closed being true are issues, couldnt figure out how to solve the window.closed when developing. I guess when I run it on the same domin it will work because of cors

[pmathew92]

Hi @shovelmn12 , for the organizationId issue you can skip passing that parameter.
On the window.closed error, we did spent sometime to debug this for a proper fix. Will revert here
cc @tusharpandey13

[shovelmn12]

@pmathew92 thats the thing, I am NOT passing any org... check the reference js issue (auth0/auth0-spa-js#1349)

[shovelmn12]

@pmathew92 the funny thing is that this works when not runnin flutter in wasm ...

[tomasatisocco]

@shovelmn12 have you been able to workaround it somehow? This is the only blocker I have right now to make my Flutter web page work with was

[tomasatisocco]

Oh I see you are right @shovelmn12 it looks like it fails because of CORS because when deployed it works perfectly fine