Trying to load biowasm JS tools

Anvil Q&A
1

What I’m trying to do:

Load and use biowasm tools by translating / including their HTML / JS instructions. Please see their instructions:

https://biowasm.com/cdn/v3/gawk/5.1.0

What I’ve tried and what’s not working:

Including parts of the given HTML in Native Libraries, and porting parts to Python in the main form init.

Code Sample:
In Native Libraries:

<script src="https://biowasm.com/cdn/v3/aioli.js"></script>

In form init

# imports added
from anvil.js.window import Aioli
import anvil.js

# in __init__
    self.p = Aioli(["gawk/5.1.0"]) # seems to work and return a promise
    self.c = anvil.js.await_promise(self.p) # fails with exception about primitive type

Clone link:
share a copy of your app

2

Yes that is an exoctic object that’s being converted to python
I had a poke around and our js interop isn’t quite good enough to handle that object
any time you ask it questions about itself it calls a a web worker and asks the question on its befalf

Imagine the js interop is saying things like

Anvil - hey do you have a name
Aioli - I dunno i’ll go check
Aioli - throws exception because it hasn’t registered a name response

So the return type of Aioli only expects you to ask pre determined questions otherwise it just explodes

Here are two approaches that work

Form1 provides a function that you can call to get output
Form2 wraps the obscure Aioli object in a less obscure object that anvil can handle
You’ll want to explore native libraries of the clone
and the html of Form1 and Form2

I think I prefer Form2’s version

<script type="module">
    window.AioliWrapped = async function(...args) {
        const rv = await new Aioli(...args);
        return {
            mount(...args) {
                return rv.mount(...args);
            },
            exec(...args) {
                return rv.exec(...args);
            }
        }
    }
</script>

And then in your code just replace Aioli with AioliWrapped

2 Likes
3

Thanks so much for this analysis and the solutions. I would have never figured this out. I have used the 2nd solution in my app and it is working great!

This gets me unblocked and hopefully the rest is “simple” from here.

2 Likes