Skip to main content

window.WebviewWindow

@tauri-apps/api / window / WebviewWindow

Class: WebviewWindow

window.WebviewWindow

Create new webview windows and get a handle to existing ones.

Windows are identified by a label a unique identifier that can be used to reference it later. It may only contain alphanumeric characters a-zA-Z plus the following special characters -, /, : and _.

example

// loading embedded asset:
const webview = new WebviewWindow('theUniqueLabel', {
url: 'path/to/page.html'
});
// alternatively, load a remote URL:
const webview = new WebviewWindow('theUniqueLabel', {
url: 'https://github.com/tauri-apps/tauri'
});

webview.once('tauri://created', function () {
// webview window successfully created
});
webview.once('tauri://error', function (e) {
// an error happened creating the webview window
});

// emit an event to the backend
await webview.emit("some event", "data");
// listen to an event from the backend
const unlisten = await webview.listen("event name", e => {});
unlisten();

Hierarchy

Constructors

constructor

new WebviewWindow(label, options?)

Creates a new WebviewWindow.

example

import { WebviewWindow } from '@tauri-apps/api/window';
const webview = new WebviewWindow('my-label', {
url: 'https://github.com/tauri-apps/tauri'
});
webview.once('tauri://created', function () {
// webview window successfully created
});
webview.once('tauri://error', function (e) {
// an error happened creating the webview window
});
  • @param label The unique webview window label. Must be alphanumeric: a-zA-Z-/:_.

Parameters

NameType
labelstring
optionsWindowOptions

Overrides

WindowManager.constructor

Defined in

window.ts:1557

Properties

label

label: string

The window label. It is a unique identifier for the window, can be used to reference it later.

Inherited from

WindowManager.label

Defined in

window.ts:315


listeners

listeners: Object

Local event listeners.

Index signature

[key: string]: EventCallback<any>[]

Inherited from

WindowManager.listeners

Defined in

window.ts:317

Methods

_handleTauriEvent

_handleTauriEvent<T>(event, handler): boolean

Type parameters

Name
T

Parameters

NameType
eventstring
handlerEventCallback<T>

Returns

boolean

Inherited from

WindowManager._handleTauriEvent

Defined in

window.ts:381


center

center(): Promise<void>

Centers the window.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.center();

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.center

Defined in

window.ts:691


close

close(): Promise<void>

Closes the window.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.close();

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.close

Defined in

window.ts:992


emit

emit(event, payload?): Promise<void>

Emits an event to the backend, tied to the webview window.

Parameters

NameTypeDescription
eventstringEvent name. Must include only alphanumeric characters, -, /, : and _.
payload?unknownEvent payload.

Returns

Promise<void>

Inherited from

WindowManager.emit

Defined in

window.ts:370


hide

hide(): Promise<void>

Sets the window visibility to false.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.hide();

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.hide

Defined in

window.ts:967


innerPosition

innerPosition(): Promise<PhysicalPosition>

The position of the top-left hand corner of the window's client area relative to the top-left hand corner of the desktop.

example

import { appWindow } from '@tauri-apps/api/window';
const position = await appWindow.innerPosition();

Returns

Promise<PhysicalPosition>

The window's inner position.

Inherited from

WindowManager.innerPosition

Defined in

window.ts:436


innerSize

innerSize(): Promise<PhysicalSize>

The physical size of the window's client area. The client area is the content of the window, excluding the title bar and borders.

example

import { appWindow } from '@tauri-apps/api/window';
const size = await appWindow.innerSize();

Returns

Promise<PhysicalSize>

The window's inner size.

Inherited from

WindowManager.innerSize

Defined in

window.ts:487


isDecorated

isDecorated(): Promise<boolean>

Gets the window's current decorated state.

example

import { appWindow } from '@tauri-apps/api/window';
const decorated = await appWindow.isDecorated();

Returns

Promise<boolean>

Whether the window is decorated or not.

Inherited from

WindowManager.isDecorated

Defined in

window.ts:588


isFullscreen

isFullscreen(): Promise<boolean>

Gets the window's current fullscreen state.

example

import { appWindow } from '@tauri-apps/api/window';
const fullscreen = await appWindow.isFullscreen();

Returns

Promise<boolean>

Whether the window is in fullscreen mode or not.

Inherited from

WindowManager.isFullscreen

Defined in

window.ts:538


isMaximized

isMaximized(): Promise<boolean>

Gets the window's current maximized state.

example

import { appWindow } from '@tauri-apps/api/window';
const maximized = await appWindow.isMaximized();

Returns

Promise<boolean>

Whether the window is maximized or not.

Inherited from

WindowManager.isMaximized

Defined in

window.ts:563


isResizable

isResizable(): Promise<boolean>

Gets the window's current resizable state.

example

import { appWindow } from '@tauri-apps/api/window';
const resizable = await appWindow.isResizable();

Returns

Promise<boolean>

Whether the window is resizable or not.

Inherited from

WindowManager.isResizable

Defined in

window.ts:613


isVisible

isVisible(): Promise<boolean>

Gets the window's current visible state.

example

import { appWindow } from '@tauri-apps/api/window';
const visible = await appWindow.isVisible();

Returns

Promise<boolean>

Whether the window is visible or not.

Inherited from

WindowManager.isVisible

Defined in

window.ts:638


listen

listen<T>(event, handler): Promise<UnlistenFn>

Listen to an event emitted by the backend that is tied to the webview window.

Type parameters

Name
T

Parameters

NameTypeDescription
eventEventNameEvent name. Must include only alphanumeric characters, -, /, : and _.
handlerEventCallback<T>Event handler.

Returns

Promise<UnlistenFn>

A promise resolving to a function to unlisten to the event.

Inherited from

WindowManager.listen

Defined in

window.ts:332


maximize

maximize(): Promise<void>

Maximizes the window.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.maximize();

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.maximize

Defined in

window.ts:817


minimize

minimize(): Promise<void>

Minimizes the window.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.minimize();

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.minimize

Defined in

window.ts:892


once

once<T>(event, handler): Promise<UnlistenFn>

Listen to an one-off event emitted by the backend that is tied to the webview window.

Type parameters

Name
T

Parameters

NameTypeDescription
eventstringEvent name. Must include only alphanumeric characters, -, /, : and _.
handlerEventCallback<T>Event handler.

Returns

Promise<UnlistenFn>

A promise resolving to a function to unlisten to the event.

Inherited from

WindowManager.once

Defined in

window.ts:353


outerPosition

outerPosition(): Promise<PhysicalPosition>

The position of the top-left hand corner of the window relative to the top-left hand corner of the desktop.

example

import { appWindow } from '@tauri-apps/api/window';
const position = await appWindow.outerPosition();

Returns

Promise<PhysicalPosition>

The window's outer position.

Inherited from

WindowManager.outerPosition

Defined in

window.ts:461


outerSize

outerSize(): Promise<PhysicalSize>

The physical size of the entire window. These dimensions include the title bar and borders. If you don't want that (and you usually don't), use inner_size instead.

example

import { appWindow } from '@tauri-apps/api/window';
const size = await appWindow.outerSize();

Returns

Promise<PhysicalSize>

The window's outer size.

Inherited from

WindowManager.outerSize

Defined in

window.ts:513


requestUserAttention

requestUserAttention(requestType): Promise<void>

Requests user attention to the window, this has no effect if the application is already focused. How requesting for user attention manifests is platform dependent, see UserAttentionType for details.

Providing null will unset the request for user attention. Unsetting the request for user attention might not be done automatically by the WM when the window receives input.

Platform-specific

  • macOS: null has no effect.
  • Linux: Urgency levels have the same effect.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.requestUserAttention();

Parameters

NameType
requestTypenull | UserAttentionType

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.requestUserAttention

Defined in

window.ts:727


scaleFactor

scaleFactor(): Promise<number>

The scale factor that can be used to map physical pixels to logical pixels.

example

import { appWindow } from '@tauri-apps/api/window';
const factor = await appWindow.scaleFactor();

Returns

Promise<number>

The window's monitor scale factor.

Inherited from

WindowManager.scaleFactor

Defined in

window.ts:411


setAlwaysOnTop

setAlwaysOnTop(alwaysOnTop): Promise<void>

Whether the window should always be on top of other windows.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setAlwaysOnTop(true);

Parameters

NameTypeDescription
alwaysOnTopbooleanWhether the window should always be on top of other windows or not.

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setAlwaysOnTop

Defined in

window.ts:1045


setCursorGrab

setCursorGrab(grab): Promise<void>

Grabs the cursor, preventing it from leaving the window.

There's no guarantee that the cursor will be hidden. You should hide it by yourself if you want so.

Platform-specific

  • Linux: Unsupported.
  • macOS: This locks the cursor in a fixed location, which looks visually awkward.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setCursorGrab(true);

Parameters

NameTypeDescription
grabbooleantrue to grab the cursor icon, false to release it.

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setCursorGrab

Defined in

window.ts:1361


setCursorIcon

setCursorIcon(icon): Promise<void>

Modifies the cursor icon of the window.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setCursorIcon('help');

Parameters

NameTypeDescription
iconCursorIconThe new cursor icon.

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setCursorIcon

Defined in

window.ts:1421


setCursorPosition

setCursorPosition(position): Promise<void>

Changes the position of the cursor in window coordinates.

example

import { appWindow, LogicalPosition } from '@tauri-apps/api/window';
await appWindow.setCursorPosition(new LogicalPosition(600, 300));

Parameters

NameTypeDescription
positionPhysicalPosition | LogicalPositionThe new cursor position.

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setCursorPosition

Defined in

window.ts:1448


setCursorVisible

setCursorVisible(visible): Promise<void>

Modifies the cursor's visibility.

Platform-specific

  • Windows: The cursor is only hidden within the confines of the window.
  • macOS: The cursor is hidden as long as the window has input focus, even if the cursor is outside of the window.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setCursorVisible(false);

Parameters

NameTypeDescription
visiblebooleanIf false, this will hide the cursor. If true, this will show the cursor.

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setCursorVisible

Defined in

window.ts:1394


setDecorations

setDecorations(decorations): Promise<void>

Whether the window should have borders and bars.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setDecorations(false);

Parameters

NameTypeDescription
decorationsbooleanWhether the window should have borders and bars.

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setDecorations

Defined in

window.ts:1018


setFocus

setFocus(): Promise<void>

Bring the window to front and focus.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setFocus();

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setFocus

Defined in

window.ts:1263


setFullscreen

setFullscreen(fullscreen): Promise<void>

Sets the window fullscreen state.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setFullscreen(true);

Parameters

NameTypeDescription
fullscreenbooleanWhether the window should go to fullscreen or not.

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setFullscreen

Defined in

window.ts:1237


setIcon

setIcon(icon): Promise<void>

Sets the window icon.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setIcon('/tauri/awesome.png');

Note that you need the icon-ico or icon-png Cargo features to use this API. To enable it, change your Cargo.toml file:

[dependencies]
tauri = { version = "...", features = ["...", "icon-png"] }

Parameters

NameTypeDescription
iconstring | Uint8ArrayIcon bytes or path to the icon file.

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setIcon

Defined in

window.ts:1296


setMaxSize

setMaxSize(size): Promise<void>

Sets the window maximum inner size. If the size argument is undefined, the constraint is unset.

example

import { appWindow, LogicalSize } from '@tauri-apps/api/window';
await appWindow.setMaxSize(new LogicalSize(600, 500));

Parameters

NameTypeDescription
sizeundefined | null | PhysicalSize | LogicalSizeThe logical or physical inner size, or null to unset the constraint.

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setMaxSize

Defined in

window.ts:1152


setMinSize

setMinSize(size): Promise<void>

Sets the window minimum inner size. If the size argument is not provided, the constraint is unset.

example

import { appWindow, PhysicalSize } from '@tauri-apps/api/window';
await appWindow.setMinSize(new PhysicalSize(600, 500));

Parameters

NameTypeDescription
sizeundefined | null | PhysicalSize | LogicalSizeThe logical or physical inner size, or null to unset the constraint.

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setMinSize

Defined in

window.ts:1110


setPosition

setPosition(position): Promise<void>

Sets the window outer position.

example

import { appWindow, LogicalPosition } from '@tauri-apps/api/window';
await appWindow.setPosition(new LogicalPosition(600, 500));

Parameters

NameTypeDescription
positionPhysicalPosition | LogicalPositionThe new position, in logical or physical pixels.

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setPosition

Defined in

window.ts:1194


setResizable

setResizable(resizable): Promise<void>

Updates the window resizable flag.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setResizable(false);

Parameters

NameType
resizableboolean

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setResizable

Defined in

window.ts:764


setSize

setSize(size): Promise<void>

Resizes the window with a new inner size.

example

import { appWindow, LogicalSize } from '@tauri-apps/api/window';
await appWindow.setSize(new LogicalSize(600, 500));

Parameters

NameTypeDescription
sizePhysicalSize | LogicalSizeThe logical or physical inner size.

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setSize

Defined in

window.ts:1072


setSkipTaskbar

setSkipTaskbar(skip): Promise<void>

Whether to show the window icon in the task bar or not.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setSkipTaskbar(true);

Parameters

NameTypeDescription
skipbooleantrue to hide window icon, false to show it.

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setSkipTaskbar

Defined in

window.ts:1326


setTitle

setTitle(title): Promise<void>

Sets the window title.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setTitle('Tauri');

Parameters

NameTypeDescription
titlestringThe new title

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.setTitle

Defined in

window.ts:791


show

show(): Promise<void>

Sets the window visibility to true.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.show();

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.show

Defined in

window.ts:942


startDragging

startDragging(): Promise<void>

Starts dragging the window.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.startDragging();

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.startDragging

Defined in

window.ts:1490


theme

theme(): Promise<null | Theme>

Gets the window's current visible state.

example

import { appWindow } from '@tauri-apps/api/window';
const theme = await appWindow.theme();

Returns

Promise<null | Theme>

The system theme.

Inherited from

WindowManager.theme

Defined in

window.ts:663


toggleMaximize

toggleMaximize(): Promise<void>

Toggles the window maximized state.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.toggleMaximize();

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.toggleMaximize

Defined in

window.ts:867


unmaximize

unmaximize(): Promise<void>

Unmaximizes the window.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.unmaximize();

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.unmaximize

Defined in

window.ts:842


unminimize

unminimize(): Promise<void>

Unminimizes the window.

example

import { appWindow } from '@tauri-apps/api/window';
await appWindow.unminimize();

Returns

Promise<void>

A promise indicating the success or failure of the operation.

Inherited from

WindowManager.unminimize

Defined in

window.ts:917


getByLabel

Static getByLabel(label): null | WebviewWindow

Gets the WebviewWindow for the webview associated with the given label.

example

import { WebviewWindow } from '@tauri-apps/api/window';
const mainWindow = WebviewWindow.getByLabel('main');

Parameters

NameTypeDescription
labelstringThe webview window label.

Returns

null | WebviewWindow

The WebviewWindow instance to communicate with the webview or null if the webview doesn't exist.

Defined in

window.ts:1589