How can I share an image with navigator.share?

I using it like this:

async def share_eq(e):
    base64url = document.getElementById('img').src
    blob = await (await fetch(base64url)).blob()
    file =[blob], 'eq.png', {type: blob.type})
        "title": 'Generated EQ',
        "text": 'Can you solve this??',
        "files": [file],

And it just prints out:

Future exception was never retrieved\nfuture: <Future finished exception=JsException(TypeError: Failed to execute 'share' on 'Navigator': No known share data fields supplied. If using only new fields (other than title, text and url), you must feature-detect them first.)>

And even tho I try also using url instead of files it returns the same error


Just sharing the solution we came up with over on the community discord for those who find this in the future:

navigator.share() takes an Object as its only argument, but the code above uses a Python Dict as the argument, which gets converted to a JS Map.

Using to_js(..., dict_converter=Object.fromEntries) to convert the Python Dict to a JS Object works:

data = { 
    "title": 'Generated EQ',
    "text": 'Can you solve this??',
    "files": [file] }
navigator.share(to_js(data, dict_converter=Object.fromEntries))

Or you could create a new Python object with title, text and files attributes. But I think the solution above is more Pythonic.

1 Like