Chrome Extension Window Management — Developer Guide

3 min read

Window Management in Chrome Extensions

Introduction

Key APIs

chrome.windows.create()

// Normal browser window
const win = await chrome.windows.create({ url: "https://example.com", type: "normal" });

// Popup window (no tabs, bookmarks bar, etc.)
const popup = await chrome.windows.create({
  url: "popup-window.html",
  type: "popup",
  width: 400, height: 600,
  left: 100, top: 100
});

// Incognito window
const incog = await chrome.windows.create({ url: "https://example.com", incognito: true });

Window Types

chrome.windows.get/getAll/getCurrent/getLastFocused

const current = await chrome.windows.getCurrent({ populate: true }); // includes tabs
const all = await chrome.windows.getAll({ populate: true });
const focused = await chrome.windows.getLastFocused();

chrome.windows.update()

await chrome.windows.update(windowId, {
  left: 0, top: 0, width: 800, height: 600,  // Position and size
  focused: true,   // Bring to front
  state: "normal"  // "normal", "minimized", "maximized", "fullscreen"
});

chrome.windows.remove()

await chrome.windows.remove(windowId); // Closes all tabs in the window

Window Events

chrome.windows.onCreated.addListener((window) => { /* new window */ });
chrome.windows.onRemoved.addListener((windowId) => { /* window closed */ });
chrome.windows.onFocusChanged.addListener((windowId) => {
  if (windowId === chrome.windows.WINDOW_ID_NONE) {
    console.log("No Chrome window focused");
  }
});

Common Patterns

Floating Tool Window

Multi-Window Session Manager

Picture-in-Picture Style UI

Incognito Awareness

Window-Tab Relationship

Common Mistakes

Part of the Chrome Extension Guide by theluckystrike. Built at zovo.one.

← Previous webrtc-extensions Next → wxt-framework-setup