Electron Build : Openlogin adapter throwing error of whitelist

arpit · February 8, 2024, 9:49pm

We have a Client ID which is being used to implement openlogin adapter on webapplication (react) and using electron JS we want to implement the same for a desktop application as well.
but once we create the electron build web3auth modal throws whitelist error.

Initially , we were able to use the same when we added files:// , in the whitelist table through web3auth dashboard.

Please go through the following config :

   "@web3auth/no-modal": "^7.0.1",
    "@web3auth/openlogin-adapter": "^7.0.1",
    "@web3auth/web3auth": "^0.9.3",

and this is web3auth modal declaration code snipet

 web3auth = new Web3AuthNoModal({
      clientId: clientId,
      chainConfig: initChain,
      web3AuthNetwork: "mainnet",
    });

vjgee · February 9, 2024, 4:39am

@arpit Thanks for your recent post.

web3auth/web3auth has been deprecated and is now web3auth/no-modal. Please remove this web3auth/web3auth from your package.json file and check.

arpit · February 9, 2024, 6:23pm

Hey @vjgee , Thanks for the reply but we are actually using no-modal only.
import { Web3AuthNoModal } from “@web3auth/no-modal”;

but didnt remove the web3auth/web3auth from package.json , appologies for the confusion.
updated package.json

    "@web3auth/base": "^7.0.1",
    "@web3auth/ethereum-provider": "^7.0.4",
    "@web3auth/no-modal": "^7.0.1",
    "@web3auth/openlogin-adapter": "^7.0.1",
    "@web3modal/ethereum": "^2.6.2",
    "@web3modal/react": "^2.6.2",

vjgee · February 9, 2024, 6:37pm

@arpit Thanks for your reply.

You are using some outdated packages. You should consider upgrading to a higher version:

“@web3auth/base”: “^7.3.1”,
“@web3auth/ethereum-provider”: “^7.3.1”,
“@web3auth/no-modal”: “^7.3.1”,
“@web3auth/openlogin-adapter”: “^7.3.1”

arpit · February 13, 2024, 7:43pm

Hey @vjgee , Even after updating all the packes to the latest version the error still persist.

  "@web3auth/base": "^7.3.1",
    "@web3auth/ethereum-provider": "^7.3.1",
    "@web3auth/metamask-adapter": "^7.3.2",
    "@web3auth/no-modal": "^7.3.1",
    "@web3auth/openlogin-adapter": "^7.3.1",
    "@web3modal/ethereum": "^2.6.2",

vjgee · February 13, 2024, 8:20pm

@arpit Are you able to confirm you are on a Paid plan? Can you share a screenshot of the Project you have setup on the dashboard?

arpit · February 14, 2024, 7:51pm

Please refer to this screenshot.

vjgee · February 14, 2024, 8:07pm

The screenshot does not show the environment the project has been setup. Also, please answer if you are in Growth plan or higher or are you on the base plan ?

vjgee · February 15, 2024, 5:17am

@arpit Were you able to see my previous questions?

vjgee · February 19, 2024, 3:03am

@arpit Please confirm the environment the project has been setup in. Also, please answer if you are on Growth plan or higher or are you on the base plan ?

arpit · February 19, 2024, 5:44pm

@vjgee , can you please let me know how to check the environment of the project ?
Also currently we are on base plan. Thanks

vjgee · February 19, 2024, 6:48pm

Go to your Dashboard. click the Projects tab and navigate into the project to find the environment you have setup:

arpit · February 20, 2024, 5:43am

@vjgee , we are using Legacy Mainnet as our environment.

arpit · February 20, 2024, 6:52pm

I understand but we are already using the base plan for production on our live site Files Dapp and its working quite good there.
The issue only comes on electron build version. Also initially it used to work (5-6 months back)
when we were in initial development of our electron version.

vjgee · February 20, 2024, 11:34pm

@arpit 5-6 months there were certain changes made by our team in terms of gating certain features restricted only to Growth plan or higher. Please read through our recent pricing details here

Which environment is this Dapp setup in? Is this on Mainnet?

arpit · February 21, 2024, 4:28pm

Yes, Mainnet.

vjgee · February 22, 2024, 4:22am

@arpit Can you share your Github repo or entire implementation code for our Dev team to check ? If you do not want to share it publicly, You can navigate to the left hand side Menu . Scroll down to find Messages > Inbox > I have sent you a DM .

Can you also answer if you have added a payment method to your Dashboard account ?

maharshi · February 27, 2024, 4:29am

Hey @arpit,

Currently, we don’t have a specific example tailored for Electron JS in our resources. However, I recommend trying out the configuration designed for React Native along with the necessary whitelisting procedures. If you’re able to adapt these configurations successfully for Electron JS, that would be fantastic. Please feel free to share your progress or any challenges you encounter. We’re here to support you along the way!

arpit · March 13, 2024, 10:21pm

Hey @maharshi , As per your suggestion we tried to incorporate the react-native sdk in place of web nomodal sdk for our electron app , but after multiple efforts these seems to be few underlying code which is not compatible with the react code (render layer) for our electron application.

The orignal react web application is already using web3auth in productiion (lighthouse.storage)

Now the build of this react web application when ran inside electron environment throws the whitelist error. So on further investigation i also found outside the electron environment.
when react app is ran in dev mode (i.e npm run start / npm run dev ) , it runs on browser with window. origin as localhost that can be whitelisted on web3auth dashboard.
but when the same code is build (npm run build / vite build) , the generated index.html when run has window.origin as file:// , which even when added to whitelist table is throwing whitelist error.