deno_webview

license stars ci GitHub Releases Deno version

This project provides deno bindings for webview using the webview rust bindings. Webview is a tiny cross-platform library to render web-based GUIs for desktop applications. This project is still in an early stage of development and stability is sometimes questionable. The plugin should be compatible with MacOS, Linux and Windows. It has been tested on Windows and Xubuntu where it worked as expected using deno v0.35.0 and v0.36.0 (the only versions i bothered testing). The current goal of deno_webview is to provide high quality bindings to webview for creating light cross-platform applications using web technologies.

Example image

Example

Run the following with the -A flag enabled to get the example shown above:

import { WebView } from "https://deno.land/x/webview/mod.ts";

const webview1 = new WebView({
    title: "Hello world",
    url: `data:text/html,
    <html>
    <body>
      <h1>Hello from deno</h1>
    </body>
    </html>
    `,
    width: 300,
    height: 300,
    frameless: true
});

const webview2 = new WebView({
    title: "Hello world 2",
    url: `data:text/html,
  <html>
  <body>
    <h1>Hello from deno 2</h1>
  </body>
  </html>
  `,
    width: 300,
    height: 300
});

while (webview1.step() && webview2.step()) {}

or just run the following in the terminal:

deno -A https://deno.land/x/webview/examples/multiple.ts

Docs

Docs can also be found here.

WebView

A WebView instance

  • WebView.constructor(args: { title?: string; url?: string; width?: number; height?: number; resizable?: boolean; debug?: boolean; frameless?: boolean; }): WebView
    • Creates a new WebView instance
  • WebView.run(): Void
    • Runs the event loop to completion
  • WebView.step(): boolean
    • Iterates the event loop and returns false if the the WebView has been closed
  • WebView.exit(): Void
    • Exits the WebView
  • WebView.eval(js: string): Void
    • Evaluates the provided js code in the WebView
  • WebView.setColor(color: { r: number; g: number; b: number; a: number; }): Void
    • Sets the color of the title bar to the provided RGBA value
  • WebView.setTitle(title: string): Void
    • Sets the window title
  • WebView.setFullscreen(fullscreen: boolean): Void
    • Enables or disables fullscreen

Development

Prerequisites

For building deno_webview the same prerequisites as for building deno is required (mostly).

Linux

  • webkit2gtk (to install using apt: sudo apt-get install libwebkit2gtk-4.0-dev)

Cloning

To clone the repo simply run the following:


git clone https://github.com/eliassjogreen/deno_webview.git

and then cd into the repo:


cd deno_webview

Building

Building deno_webview takes about 20-50 minutes the first time (then like a minute) depending on your operating system. When building on Windows admin is required. Building is easiest done by running:


deno -A scripts/build.ts

or


cargo build --release --locked

optionally with edge (does not work yet #3)


deno -A scripts/build.ts edge

or


cargo build --release --locked --features edge

Running

To run deno_webview without automatically downloading the binaries from releases you will need to use the enviornment variable DEV and set it to the path where the binaries are located. This is usually file://./target/release. The process of running a using local binaries can be easier to do using the dev script:

deno -A scripts/dev.ts example.ts

Contributing

Contributions either in the form of pull requests or issues are always welcome. Just remember to format using deno fmt and cargo fmt. Thx <3

Dependencies

Deno

Rust

Todo

  • Implement all most webview instance methods
  • Docs
  • Multiple windows/instances? (Help, need to create a static HashMap of *mut CWebView) Used solution found here
  • Better errors and responses from rust land
  • Update ci so building with Edge works #3
  • Two-way deno bindings (to call deno from javascript)
  • More examples
  • Tests (unsure of how though)
  • Wait for the rust bindings to update to the latest webview api.
    • Polyfill for new API?