Chrome extension – Uncaught TypeError: Error in invocation of tabs.group

Goal

  1. Create two tabs using Chrome.tabs.create()
  2. Group both taps using Chrome.tabs.group()

Set-up

html

<button id="create">Create<button>

popup.js

const createBtn = document.querySelect('#create');
createBtn.addEventListener('click', createTabs);
let tabsToGroup = []; // For storing tab Id's

function createTabs() {
    chrome.tabs.query({ active: true, lastFocusedWindow: true }, (tabs) => {
        tabsToGroup.push(tabs[0].id); // Push current window to array

        chrome.tabs
            .create({ url: `https://site1.com` })
            .then((tab) => tabsToGroup.push(tab.id));

        chrome.tabs
            .create({ url: `https://site2.com` })
            .then((tab) => tabsToGroup.push(tab.id));

        chrome.tabs.group({ tabIds: tabsToGroup });
    });
}

Full error message

Uncaught TypeError: Error in invocation of tabs.group(object options, optional function callback): Error at parameter 'options': Error at property 'tabIds': Value did not match any choice. at HTMLButtonElement.openTabs (popup.js:226:14)

enter image description here

I have set up chrome.tabs.group(). It has an object. And when I check thevalue of tabsToGroup it successfully returns an array.