macOS

WebKit and native package targetsCopy Anchor Link

WebviewJS uses the system WebKit framework through WKWebView. It does not bundle a browser engine. The published N-API packages include macOS x64 and arm64 targets.

App menuCopy Anchor Link

The native menu bar belongs to the application and appears at the top of the screen. app.setMenu() configures it; menu roles such as about, hide, hideothers, showall, services, bringalltofront, and quit map to native actions. See Menu.

Create the application and call GUI APIs on the runtime's main JavaScript thread. Do not create or use WebviewJS windows from a Node.js worker_threads worker.

Window behaviorCopy Anchor Link

macOS-specific creation options include:

• macosMovableByWindowBackground for dragging the window by its background.
• macosTitlebarTransparent, macosTitleHidden, macosTitlebarHidden, and macosTitlebarButtonsHidden for titlebar presentation.
• macosFullsizeContentView to extend content into the titlebar area.
• macosDisallowHidpi to disable high-DPI behavior.
• macosHasShadow and macosTabbingIdentifier for window shadow and tab grouping.
• visibleOnAllWorkspaces for workspace visibility.

Runtime methods expose simple fullscreen, shadow, tabbing identifier, and document-edited state. These options and methods are described in BrowserWindow.

setSkipTaskbar() is a no-op on macOS. setIgnoreCursorEvents() maps to the native click-through behavior. A window icon does not change the application Dock icon. Use app.setDockIcon() to change it at runtime, and app.removeDockIcon() to restore the original icon. See the Dock icon example.

Drag helpers use the current mouse event to move the window. Keep the drag request inside the active press. A double-click in an eligible drag region toggles maximize only if the pointer has not moved before mouse-up. See frameless windows.

TransparencyCopy Anchor Link

Request a transparent native window at creation and set the webview background alpha to zero:

const win = app.createBrowserWindow({
  transparent: true,
  decorations: false,
});
const webview = win.createWebview({ html: '<div>Overlay</div>', transparent: true });
webview.setBackgroundColor(0, 0, 0, 0);

See the window appearance guide and transparent window example.