Adding Sign-Widget with single-spa with react doesn't show logo image

[byveb]

Describe the bug

Hi, Today, i was trying to add Okta Sign-Widget integrate with our Single-spa mfe, but when i import logo and pass the value to logo with Okta config it doesn't show logo.

Reproduction Steps

create single-spa app.
//add Okta sign widget
import logoImage from './path-to-logo.png';

const oktaConfig = {
clientId: 'your-client-id',
redirectUri: window.location.origin + '/login/callback',
logo: logoImage
};

// Login.js
import React, { useEffect } from 'react';
import oktaConfig from './okta-config';

const Login = () => {
useEffect(() => {
const widget = new OktaSignIn(oktaConfig);

widget.renderEl(
  { el: '#okta-sign-in-container' },
  () => {
    // Callback for successful login
  },
  (err) => {
    console.error(err);
  }
);

return () => {
  widget.remove();
};

}, []);

return (

);
};

export default Login;

SDK Versions

okta/react 6.7.x
okta/okta-auth-js 6.7.x

Additional Information

No response

[jaredperreault-okta]

Docs: https://github.com/okta/okta-signin-widget#logo

Local path or URL to a logo image that is displayed at the top of the Sign-In Widget

import logoImage from './path-to-logo.png';

I believe the issue is this line, you're loading the image into memory via the ES Module Loader. So when you pass logoImage to the Widget config, you're passing the image as a string, rather than a local filepath or url.

[byveb]

thanks for reply, @jaredperreault-okta .
This is working perfectly with react app (none single-spa). not sure, i believe it's check the imported image object and makes reference ?