系列文章可以查看《浏览器扩展程序开发笔记》专栏
在 Manifest V3 版本的扩展程序中，Chrome 新增了以 chrome.tabGroups 为前缀的 API，它们是与标签组相关的方法。
这些方法里会常用到或一般返回 标签组对象 TabGroup，它包含以下常用属性：
collapsed布尔值，标签组折叠或展开color字符串，标签组所标记的颜色，可以是grey、blue、red、yellow、green、pink、purple、cyan这 8 个值之一id数值，标签组的 ID 唯一标识符title字符串（可选），标签组的名称windowId数值，标签组所在的浏览器窗口的 ID 唯一标识符
获取所有标签组
使用方法 chrome.tabGroups.query(queryInfo: object) 获取符合（查询）条件的所有标签组，它是一个异步函数，立即返回的是一个 Promise，最终返回的是所有符合条件的标签组对象 TabGroup 数组。
// 借助 Chrome 提供的 API，封装一个获取当前窗口中所有标签组的方法
const getAllTabGroups = async () => {
const tabGroups = await chrome.tabGroups.query({
// 通过 Chrome 内置对象的属性 chrome.windows.WINDOW_ID_CURRENT 获取当前窗口的 ID 唯一标识符
windowId: chrome.windows.WINDOW_ID_CURRENT,
});
return tabGroups;
};
在标签组中创建标签页
使用方法 chrome.tabs.group(options: object) 将给定的（一个或多个）标签添加到指定标签组中，它是一个异步函数，立即返回的是一个 Promise，最终返回的是该标签组 TabGroup 的 ID 唯一标识符。
该方法接受一个配置对象作为入参，该对象常用属性如下：
-
createProperties，该（可选）属性的值是一个对象，该对象只包含一个（可选）属性windowId，以指定需要在哪一个窗口新建一个标签组，默认在当前窗口新建标签组⚠️ 如果在配置对象中指定了另一个属性
groupId，则忽略该属性 -
groupId数值（可选），指定将标签添加到哪一个标签组中，如果指定的标签组并不存在，就会创建一个新的标签组 -
tabIds数值或数组，通过标签的 ID 指定某个标签，或一系列标签
💡 如果通过以上方法新建标签组时，并不能指定标签组的颜色和标题，可以「曲线救国」先创建一个默认的新标签组（颜色是灰色 gray，默认名称为空），再使用方法 chrome.tabGroups.update(groupId: number, updateProperties: object) 更新标签组的属性，该方法接收两个入参：
-
第一个参数是标签组 ID，用以指定需要修改哪一个标签组
-
第二个参数是一个对象用以设置所需更新的内容，可以包含以下属性：
collapsed布尔值（可选），标签组折叠或展开color字符串，标签组所标记的颜色，可以是grey、blue、red、yellow、green、pink、purple、cyan这 8 个值之一title字符串（可选），标签组的名称
// 借助 Chrome 提供的 API，封装一个将指定标签添加到标签组的方法
// 该方法接收两个参数，第一个参数是所需移动到标签组内的标签页的 ID，第二个参数是该标签组的一些属性（颜色和名称）
const createTabInGroup = async (tabId, group) => {
// 先使用给定的标签 ID 创建一个新的标签组
const groupId = await chrome.tabs.group({
tabIds: tabId,
});
// 再更新该标签组的颜色和名称
await chrome.tabGroups.update(groupId, {
color: group.color,
title: group.title,
});
return groupId;
};
