I am having trouble determine which (physical) monitor a Chrome window is in. This is my current solution:

// This is just for shorter alias
type ChrDispInfo = chrome.system.display.DisplayInfo;

private async getActiveMonitorAsync(monitors: ChrDispInfo[]) {
    const currWin = await chrome.windows.getCurrent();

    for (let monitor of monitors) {
        const a = monitor.workArea;

        if (currWin.left >= a.left && currWin.left <= a.left + a.width &&
            currWin.top >= a.top && currWin.top <= a.top + a.height) {
            return monitor;
        }
    }

    return monitors.find(q => q.isPrimary) || monitors[0];
}

However, I notice it doesn't always work especially when a window is maximized or when I manually move it near the top left border. The value is off by about 8px. For example, this is when I put it in a 1080x1920 monitor to the left of the primary monitor:

[currWin.left, currWin.top, currWin.width, currWin.height] value:
[-1088, -460, 1096, 1888]

monitor.workArea value:
{height: 1872, left: -1080, top: -452, width: 1080}

As you can see, the value is "off" by about 8px. I guess this is due to window border. I am running on Windows 11 Pro.

Is putting a 8px offset a good solution? Is the value different on different OS? Is there any good solution overall?

Update: I find it interesting that the number is then included in width and height. For example, if I want to set a window to a certain size, I have to put the offset for width and height twice:

const BorderSize = 8;

async updateWinAsync(window: ChrWin, monArea: chrome.system.display.Bounds, winSetting: Rect) {
    await chrome.windows.update(window.id, {
        left: winSetting[0] * monArea.width + monArea.left - BorderSize,
        top: winSetting[1] * monArea.height + monArea.top - BorderSize,
        width: winSetting[2] * monArea.width + BorderSize * 2,
        height: winSetting[3] * monArea.height + BorderSize * 2,
        state: "normal",
    });
}