webview-bun: A webview gui library for bun.

[abstract wasp]

webview-bun v2.2.0 is now released.

The new banner strives to show the cross platform compilation bun build can do and how we manage to take advantage of that.

After a long wait, lot of requests and discussions later. It has finally landed. Compiling webview-bun apps into a single executable just using bun build --compile and even cross compile using --target.✨

Release notes:

• Supports being compiled into a single executable.
• Supports cross-compilation to other platforms.
• Newly compiled libraries for maximum optimization in speed and lot smaller in size.
• Removed postinstall download script as now all the library files are packaged to enable cross-compilation.

Checkout the new sections added in the README for more information.

https://github.com/tr1ckydev/webview-bun

[thick echo]

test in Windows 11 using 2.1.0, crash when run the app using dbclick

everything is OK when dev or run with cli

btw, default libwebview.dll is cracked, I have to build manually...

[abstract wasp]

so it doesn't crash when executing through cli?

weird

[abstract wasp]

what does that mean?

[thick echo]

the process is executed, but no window show (following the guide)

[abstract wasp]

I'll create a new windows 11 vm and try it

[tall abyss]

I'm using WSL2 (Ubuntu) and am on the latest version of the package and Bun, and have followed both the Linux Debian and Windows instructions on the GitHub, on top of compiling myself and setting the WEBVIEW_PATH (both to the folder, and the specific webview files), but I still get a ERR_DLOPEN_FAILED.

[abstract wasp]

then you are missing a system dependency

did you follow install instructions in readme?

[tall abyss]

Yes

I followed both the Linux Debian installation instructions for my WSL2 (Ubuntu 22.04.4), and the Windows installation instructions (just in case).

[rustic adder]

@abstract wasp Were you able to figure out what I was talking about in the Github issue about how compilation doesn't actually work with Workers?

[abstract wasp]

can you cd into the node module folder and inside where all the .so and dll files are there and run ldd libwebview.so

[abstract wasp]

yeah. I've reopened it

it's weird, i tried the blob way to directly inserting the source code

but then when run outside the directory, literally no output which means the worker isn't even spawning

[rustic adder]

Workers will crash silently if you import anything other than Bun builtins. Which does leave an avenue for a solution, since you can import Bun.ffi just fine.

I can't think of a super clean way to implement that though. I think you'd have to do something like:

import {workerScript} from 'webview-bun' with {type: 'file'}
const worker = new Worker(URL.createObjectURL(workerScript))
worker.postMessage({navigate: 'https://example.org'})
worker.postMessage('webview-start')

Where workerScript would have all of the setup necessary for creating the webview, and some kind of api for passing commands.

[abstract wasp]

interesting concept 👏

let's see if any way is found else this will be probably the last resort

[abstract wasp]

that isn't true i just found

const worker = new Worker(URL.createObjectURL(Bun.file(file)));
worker.onerror = (e) => {
    console.error(e.message);
};

bun .
1 | ELF>@0t@8
             @
    ^
error: Unexpected 
    at /home/aritra/Desktop/webview-test/node_modules/webview-bun/build/libwebview.so:1:1

i got a little progress with import("../build/libwebview.so", { with: { type: "file" } })

error now:

I diagnosed the thing, the inlining doesn't happen on the woker script

[abstract wasp]

Welcome to the official Bun Discord server

that's not actually true

i had dug deep into everything and got my conclusions

sorry i went afk

Bun build handles embedding of scripts only when it finds es6 import lines, but we are importing that through the Worker class, it's unable to detect that. For that we need some type of secondary build step that compiles the worker file into js file that contains all the webview imports inlined into the file

but heres the problem, the import lines in the webview bun are transformed into something weird which the bun build unable to analyze for embedding it.

but that to embed that worker file we have only way to import that compiled js file as type file and pass it as blob to worker

but that hinders bun's ability to analyze the contents of that file and unable to embed the library files

that's not the thing

the worker file won't even get embedded in the first place

because bun build doesn't detect it

take the binary out of the folder and try

interesting, I'll try it out when i get back home

[heavy inlet]

Wow, this looks amazing, I love the impl.

[heavy inlet]

Is there a way for cross communication from the view to the bun "server"?

I'd be useful if cors rules apply here (not sure how exactly it works)

[abstract wasp]

thanks! and unfortunately that's an issue still open in the repo

haven't got time enough to find a solution for it

The goal is to create a way where the bun server and the webview window life cycle run on separate threads but depend on each other in a compiled binary

[abstract wasp]

@rustic adder@spark kindle The worker bug has now been fixed by the bun team in latest version and works flawless!

[rustic adder]

@abstract wasp Do you have any example code of running a webview in a worker? I'm testing it now, and on Bun 1.1.25 on Linux, I'm not getting a webview window when running from a worker.

[rustic adder]

Nevermind, its working for me after deleting and re-installing my node_modules.

Works about like you'd expect using workers as described in the official bun documentation.
https://gist.github.com/StrangeBytesDev/c96acf2d20de65f533d6dbb2595cde46

[abstract wasp]

great!

im currently working on implementing a new build system as the webview team recently merged a commit for support of webkit 6.0 and gtk 4

[heavy inlet]

So that's like a desktop app with a server

Cool

I could use the server for only API maybe

[abstract wasp]

v2.2.0 has been released 🎉

with new cmake integration build script and couple of fixes.

Check out the updated README.md for a full in-depth documentation of the project.

https://github.com/tr1ckydev/webview-bun/releases/tag/v2.2.0

Try it on your system and let me know if you face ERR_DLOPEN_FAILED issues!

[heavy inlet]

Sure 👍🏻

[abstract wasp]

Now supports linux arm64 as well !🎉

webview-bun now runs anywhere bun runs

[heavy inlet]

Nicee

[little trail]

Does compiling to a binary embeds the ffi lib, if not is that possible in the future?

[abstract wasp]

yes it does!

[little trail]

That's cool

[heavy inlet]

Quick question @abstract wasp

I'm currently making bun server with random port and a crypto uuid on my main file, and then I create worker and pass these values to it with postMessage, when it receives it replaces them in html file and inserts into webview, (uuid is like auth token so no other apps talk with server)

Is there a better way to do it like, maybe only postMessage and bind function for communication (and no webserver)

Also run function stopped working for some reason.

[abstract wasp]

using a web server to pass values is too much

simple postMessage is enough

[heavy inlet]

I didn't know if it'd still work since I want to pass msgs from the webview

[abstract wasp]

why?

[abstract wasp]

you can send message back from worker to main thread

[heavy inlet]

But how send from webview to worker @abstract wasp

Also what's the point of main then

[abstract wasp]

same function

[abstract wasp]

im not quite clear what you want to do

but i think you don't need a worker anymore then

everything should work from main thread

[heavy inlet]

I want to send message to main code by clicking button in webview

Then return response to webview in order to change ui

[abstract wasp]

bind is a good solution

but it's one way only

webview -> bun

[heavy inlet]

I see

Then I need sth like eval?

I can't return from bind?

[abstract wasp]

yeah ofc

sorry i worded it wrong

i meant you can only call bun function from webview

not the opposite

check out the bind in examples directory

[heavy inlet]

@abstract wasp what about the webview.return

[abstract wasp]

bind uses return internally

[rancid gate]

@abstract wasp this works just fine

const webview = new Webview();
const webview2 = new Webview();
webview.run();
webview2.run();

But this breaks completely

const webview = new Webview();
webview.run();
const webview2 = new Webview();
webview2.run();

[heavy inlet]

Yeah, cuz run hangs

[rancid gate]

but then the second wouldn't work too lol

unless it's a race condition

[heavy inlet]

yup I think second executes both before hang

[rancid gate]

that really sucks

as an example

(i got the first one from the repo's examples)

[abstract wasp]

yeah as run() is thread blocking

[rancid gate]

wouldn't it be better to remove that from the examples then?

the right way to do this is using workers

[abstract wasp]

that example was forked from deno webview

even though run() is thread blocking

two successive run calls runs on same thread

i do also have a worker example

[heavy inlet]

@rancid gate You can always use worker

yep

[heavy inlet]

Tbh, that's why I thought I had to use workers and bun server to communicate

I still don't get the binding flow of stuff

[abstract wasp]

like?

[heavy inlet]

How to communicate properly with the webview from the main process

I just want to pass JSON back and forth.

[abstract wasp]

bind should suffice

[heavy inlet]

Can you give me an example please, how would you implement two-way communication between the main process and the webview

Like for both to be able to send a message at any time

To the other side

[abstract wasp]

the bind example should be a good starting point but with bind, you can send anytime to main process from window but only then main can return a value

if you want full bi directional communication, you probably would need to some sort of workers magic and postMessage or a web server.

Though I don't have any example handy, if you could give an idea of what you want to achieve I could give you a solution

[heavy inlet]

oof that's why I had made webserver

[heavy inlet]

Well, in simple terms what I wanted was webview to send an event to main to daownload a file

[abstract wasp]

how about a function thats triggers the event and expose it through bind

[heavy inlet]

Yeah, but what about progress of download

I want main to send info as download progresses

[little trail]

Hello @abstract wasp thanks for your work, I updated webview-deno following your scripts https://github.com/webview/webview_deno/pull/189 I did some changes to build.ts to disable extra stuff like clang tidy and format and doxygen, also I'm using GitHub ci to build the libraries , it's pretty good now it have arm Linux and arm Mac runners

[abstract wasp]

very cool

also setting up a ci in webview-bun is something i have planned for future

would be really helpful if you could contribute in that

[little trail]

I sent a PR

[abstract wasp]

thanks👌

do enable to allow me to make edits to the pr if not already

I'll merge it soon when i get time

[rancid gate]

🙏 finally i'm able to do this for executables

import worker from "./worker.ts" with { type: "file" };
import { file } from "bun";

const server = Bun.serve({
    static: {
        '/': Response.json({ success: false })
    },
    fetch() {
        return Response.json({ success: true });
    },
});
  
const url = URL.createObjectURL(file(worker));

const webview = new Worker(url);
webview.addEventListener("close", () => server.stop(true));

[heavy inlet]

What exactly is this

Another guy in a [thread with a similar lib](#1320091484040597544 message) had an imports problem, would that help?

[rancid gate]

For bun build --compile, you can have the worker inside the executable

Previously you'd need to create a file with it to run

[abstract wasp]

great!

[abstract wasp]

webview-bun: A webview gui library for bun.

v2.4.0 released!

https://github.com/tr1ckydev/webview-bun/releases/tag/v2.4.0

Linux libraries are now compiled with llvm which should fix, import errors in old distros like debian 12.

Fix webview + webserver example on macos

[wispy egret]

Cheeky Bun.WebView?

[plain knoll]

This is no longer being maintained @abstract wasp ?

[heavy inlet]

no cuz bun rust

[plain knoll]

wrong way buddy, you gotta make your own post, not drop yours into other projects post

[storm stirrup]

sorry bud. deleted

[plain knoll]

hi Mech, so again why exactly the Rust rewrite is bad for this project? or is is due API instability during the change? is there any alternative project to this one then?

[abstract wasp]

I haven't been getting time to maintain it. I will update it soon.

[timber crown]

glad to hear this hasn't been abandoned! I'm using it in my current project, haven't had any issues with it

[abstract wasp]

yeah there hasn't been much drastic changes in the webview project itself

The current is fairly stable

[plain knoll]

great!

[heavy inlet]

I'm joking hah

also isn't there now a native webview in bun, I thought I saw sth like that