help with building an ethers plugin in flutter

[peteratfame]

Hi folks, we've begun the journey of building an ethers.js plugin for use in a flutter app, and have hit a few roadblocks, so thought we'd head over here to chart the journey!

For various reasons, we've opted for flutter_js as our library of choice (for now!) - https://pub.dev/packages/flutter_js

We're happy to chat about why we think this is the best option over others... but.....

Despite everything going swimmingly when we try, for example, to formatUtils or somesuch, the largest roadblock is the silent dying of ether.js, perhaps because of the lack of window.crypto.randomBytes (and maybe other issues related)

So here's where we are at; We have reviewed the issues here; #1070 and think that we understand a bit more about the shim required.

We also wish to use the learning from https://www.scottbrady91.com/Dart/Generating-a-Crypto-Random-String-in-Dart to build a properly secure plugin, which we intend to release under an open source licence, if in fact we're able to make it work at all!

We'll update this discussion with our working as we go, one thing that makes us think that the issue may be slightly deeper than just the randomBytes issue is the fact that a decrypt with a valid keystore and password is also just failing silently atm.

We are mildly persistent though, so will keep trying - any ideas or input would be really welcome, and we're happy to share code snippets as we go!

[ricmoo]

Can you add console.log statements in the source code for the json-wallets stuff, and see where the difference occurs between the two? There shouldn’t be anything platform specific in those packages.

Can you not use the existing shims directly? Or are there additional things missing?

[DennisAlund]

Hi @ricmoo in the process of separating the code into a flutter package, I've managed to make Wallet.createRandom() work as it should, with the help of some simple shims for missing crypto methods.

I think at this moment, any input and feedback is helpful. To start with, the most important thing to get some feedback on would be the sanity of the shims: https://github.com/FAME-Capital/ethers_flutter/blob/develop/assets/js/crypto-shim.js

They are at the stage of "we don't get warnings anymore and it seems to work" ... but I'm not having enough knowledge of how cryptographically secure these fairly simple implementations are.

We've got unit tests for Wallet.createRandom() here: https://github.com/FAME-Capital/ethers_flutter/blob/develop/test/wallet_test.dart

[sandys]

@DennisAlund just wondering if you have tested this out with Isolates ? I know of another project that built something like this in production long back (using LiquidCore) and they faced a ton of issues with running multiple javascript functions together until they moved to isolates.

[DennisAlund]

No, haven't tested this very much yet. It's still basically only on the stage of "the unit tests are passing" and about to be moved into some practical use cases to see it in the context of an actual application. So I appreciate the heads up that we might need to look out for that.

Do you have any more information on the details on what the issues were, that they ran into? What might be the problem with current implementation?

[sandys]

@DennisAlund i dont have too much other details other than the following verbatim.

it was because we were trying to run quite a few JS functions at the same time. But we did not go with normal async-await because then it was causing lags on the UI thread.

[sandys]

@peteratfame are you attempting to build a in-page provider ? meaning that you will inject this javascript into a flutter webview and it will provide window.ethereum ?

Or are you hooking into ethers (from Dart) to access the functions to create a wallet ? if this is what u want, you could probably also look into using https://inappwebview.dev/docs/headless-in-app-webview/basic-usage/ . Probably will give you the most accurate usage.

there is also a stackoverflow post that talks about using LiquidCore(android) and JavascriptCore (ios) via Platform Channels - https://stackoverflow.com/questions/52330102/use-js-library-in-flutter

Or the approach here using js.dart as interop - https://github.com/y-pakorn/flutter_web3/blob/27174a4e3c67cdfe31d721ce66fb57e3cd573e70/lib/src/ethers/ethers.dart

this is very interesting!

[peteratfame]

we'll be releasing a general use plugin for flutter that lets devs use all of the methods / features within ethers - we need it for our own project, but also hope that it might be useful to others!

We don't feel expert in the security implications of how we've gone about the shims (see above) - particularly around the creation of random bytes when creating wallets, so thought we'd share the journey a bit and see if there's any advice or ideas!

The good news is that we seem to have gotten it working (amusingly, it started working as Dennis launched a session demonstrating that it doesn't work - then it did! - the exact opposite of what usually happens to me!) - I'm going to learn more about the pub dev program, and get something out there asap, meanwhile you can review our progress at the link just above - it's actually been a fun problem to attack!

[sandys]

@peteratfame that's cool! but what's ur opinion about the alternatives that I pointed out ? I'm fairly keen to know why you chose this particular way instead of the other stuff that's out there. Would be good learning for us. If Dennis can chime in as well!!

[DennisAlund]

We considered LiquidCore for a bit too, but one of the considerations was the significant overhead in APK size that we'll get. The flutter_js lib adds very little overhead, and that feels like a great option. (if it is also checking all requirements)

But we're keeping a critical eye on whether it's actually a sustainable way forward since we'll depend on the crypto shims. The flutter_js lib doesn't allow us to do two directional interop with the dart code, so we can't benefit from the platform crypto lib inside of the JS code that we execute.

We did consider and played a little bit with different variants of WebView. The downside of that is that it must be used with a BuildContext as it will be attached to the widget life-cycle. If it was for just "making it work", it would probably be the easiest way forward as we don't need to speculate in the support for ethers as we'd have a real browser environment. But as far as I can imagine the solution, it wouldn't be as easy to use it as a general purpose plugin.

The end goal would be to have a dart plugin with the same API and exposing the same classes and method signatures, in Dart, so that the original JS documentation would be possible to use when developing for Flutter too.

[sandys]

@DennisAlund what about js.dart ? like here https://github.com/y-pakorn/flutter_web3/blob/27174a4e3c67cdfe31d721ce66fb57e3cd573e70/lib/src/ethers/ethers.dart