No puedo agregar varias pestañas dentro de una pestaña de grupo con una matriz porque devuelve este error: TypeError no detectado
Aquí está mi código:
for (let group in result) { //creating the group title and displaying it in the popup let groupTitle = document.createElement("p"); groupTitle.style.setProperty( "--color", result[group][result[group].length - 1] ); groupTitle.classList.add("groupTitle"); let tabsIds = []; //opening the new tab when the text is click groupTitle.addEventListener("click", () => { for (let i = 0; i < result[group].length - 1; i++) { //creating the new tabs one by one chrome.tabs.create({ url: result[group][i] }, async function (newTab) { tabsIds.push(newTab.id); }); } //creating a group tab with the tab created let groupId = chrome.tabs.group({ tabIds: tabsIds }); //modifying the group tab chrome.tabGroups.update(groupId, { collapsed: false, title: group, color: result[group][result[group].length - 1] }); }); groupsContainer.appendChild(groupTitle); groupTitle.append(group); } });Creo que podría provenir de los tipos de datos dentro de la matriz, pero no tengo ni idea de cómo resolverlo, así que les pido ayuda.
Los métodos de la API de chrome que devuelven una Promesa o utilizan una devolución de llamada son asincrónicos, por lo que el resultado se devuelve una vez que se completa la función sincrónica actual.
Debe declarar la función como async y usar await en cada llamada:
groupTitle.addEventListener('click', async () => { const tabsIds = []; for (const url of result[group]) { const tab = await chrome.tabs.create({url}); tabsIds.push(tab.id); } const groupId = await chrome.tabs.group({tabIds: tabsIds}); //chrome.tabGroups.update(groupId, {...}); });wOxxOm muchas gracias, aquí está mi código completo y en funcionamiento en caso de que alguien lo necesite:
groupTitle.addEventListener("click", async () => { for (let i = 0; i < result[group].length - 1; i++) { //creating the new tabs one by one let tab = await chrome.tabs.create({ url: result[group][i] }); tabsIds.push(tab.id); } //creating a group tab with the tab created let groupId = await chrome.tabs.group({ tabIds: tabsIds }); //modifying the group tab await chrome.tabGroups.update(groupId, { collapsed: false, title: group, color: result[group][result[group].length - 1] }); }); Aquí sigo usando un bucle for clásico porque el último índice de mi matriz no es una URL, por lo que necesito detener el bucle antes del último. Es por eso que usé .length - 1 .
Pero si fuera una URL, funcionará perfectamente como lo escribe wOxxOm :-)