A chrome extension for Cypress that forces the browser to emulate focus.

background.js

/**
 * Force Focus
 *
 * This extension forces Emulation.setFocusEmulationEnabled
 * which allows tests that are dependent on focus to work when
 * the browser is not focused or when it is in headless mode
 */

chrome.tabs.onUpdated.addListener(function (tabId, info) {
    console.log("Force focus opened new tab", tabId, info);
    if (info.status === "complete") {
        // Attach to the tab's debugger
        chrome.debugger.attach({ tabId: tabId }, "1.3", () => {
            if (chrome.runtime.lastError) {
                console.log(
                    "runtime.lastError",
                    tabId,
                    chrome.runtime.lastError.message,
                );
                return;
            }
            console.log("Debugger attached", tabId);

            // Force the tab to emulate focus
            chrome.debugger.sendCommand(
                {
                    tabId: tabId,
                },
                "Emulation.setFocusEmulationEnabled",
                {
                    enabled: true,
                },
                (result) => {
                    if (chrome.runtime.lastError) {
                        console.error(chrome.runtime.lastError.message);
                    }
                    console.log("Command sent:", JSON.stringify(result));
                },
            );
        });
    }
});

manifest.json

{
    "manifest_version": 3,
    "name": "Force focus",
    "version": "0.1",
    "description": "Force the DevTools Emulation.setFocusEmulationEnabled setting",
    "background": {
        "service_worker": "background.js"
    },
    "permissions": ["debugger", "tabs", "activeTab"],
    "host_permissions": ["http://*/*", "https://*/*"]
}