Ulepszanie rozszerzeń wielozadaniowych za pomocą nowego interfejsu Tabs Split View API

Anh Mac
Anh Mac

W lutym 2026 r. w Chrome 145 wprowadziliśmy natywny widok podzielony, który umożliwia użytkownikom wyświetlanie kart obok siebie i zarządzanie nimi w tym samym oknie. Dzięki temu nie trzeba już korzystać z narzędzi innych firm do zarządzania oddzielnymi oknami systemu operacyjnego. Użytkownicy mogą ręcznie dodawać i usuwać karty z widoku podzielonego za pomocą elementów sterujących przeglądarki, ale programiści nie mogli programowo kontrolować tych nowych układów kart w rozszerzeniach Chrome.

Widok dzielony w Chrome.
Widok dzielony w Chrome umożliwia użytkownikom zarządzanie kartami obok siebie.

Z przyjemnością informujemy o wprowadzeniu nowego interfejsu Split View API, który jest dostępny od Chrome 155. Ten nowy interfejs API, opracowany w ścisłej współpracy z firmą Mozilla i innymi dostawcami przeglądarek w ramach grupy WebExtensions Community Group, umożliwia rozszerzeniom wykrywanie, tworzenie i zarządzanie wbudowanymi widokami podzielonymi.

Prezentacja

Jak to działa

Wcześniej rozszerzenia tworzące interfejsy obok siebie korzystały z niestabilnych obejść, takich jak zmiana rozmiaru wielu natywnych okien, osadzanie stron w elementach <iframe> lub używanie paneli bocznych. Nowy interfejs Split View API jest bezpośrednio zintegrowany z interfejsem Tabs API w Chrome, co umożliwia nowe funkcje zarządzania układem kart.

Uprawnienia w pliku manifestu

Interfejs Split View API jest częścią przestrzeni nazw browser.tabs i nie wymaga żadnych uprawnień.

Identyfikowanie widoków podzielonych

Każdy obiekt Tab zawiera splitViewId. Jeśli karta jest częścią widoku podzielonego, ma niepowtarzalny identyfikator, który jest taki sam jak identyfikator sparowanej karty. W przeciwnym razie wartość splitViewId jest domyślnie ustawiona na -1.

// Querying all split views in the current windows
const tabs = await browser.tabs.query({ currentWindow: true });
const splitViews = tabs.map(tab => tab.splitViewId).filter(splitViewId => splitViewId !== -1);

Ograniczenia ogólne

Aby 2 karty mogły być wyświetlane w widoku podzielonym, muszą spełniać te wymagania:

  1. Karty muszą być sąsiadujące ze sobą (lub utworzone w ten sposób).
  2. Karty nie mogą być już w widoku dzielonym.
  3. Karty muszą mieć ten sam stan pinned, windowId i groupId.

Z kolei po połączeniu 2 kart zachowają one te same stany pinned, windowId i groupId oraz względne położenie względem siebie.

Tworzenie widoków dzielonych

Rozszerzenie może utworzyć nowy widok dzielony na 2 sposoby:

  1. Utwórz nową kartę, która zostanie podzielona z istniejącą kartą za pomocą nowego parametru splitWithTabId w browser.tabs.create.
  2. Sparuj 2 dotychczasowe karty z nową metodą browser.tabs.createSplit.

Przykłady

Możesz utworzyć nową kartę, używając ikony splitWithTabId, aby podzielić istniejącą kartę.

await browser.tabs.create({splitWithTabId: existingTab.id});

Domyślnie nowa karta zostanie utworzona po prawej stronie istniejącej karty.

Aby utworzyć nową kartę po lewej stronie istniejącej karty, ustaw indeks jako indeks tej karty:

  await browser.tabs.create({splitWithTabId: existingTab.id, index: existingTab.index});

Możesz też utworzyć nowy widok dzielony, łącząc 2 istniejące karty.

  await browser.tabs.createSplit([existingTab1.id, existingTab2.id]);

Rozdzielanie widoków dzielonych

Aby podzielić widok dzielony na 2 niezależne karty, rozszerzenie może użyć nowej metody browser.tabs.unsplit.

const splitViewId = browser.tabs.createSplit([tab1.id, tab2.id]);
// Unsplitting the split view into two independent tabs
await browser.tabs.unsplit(splitViewId);

Więcej informacji

Mamy nadzieję, że ta nowa funkcja usprawni pracę z rozszerzeniami. Aby zacząć tworzyć rozszerzenia z funkcją widoku podzielonego, zapoznaj się z dokumentacją interfejsu Tabs API. Jeśli masz pytania lub potrzebujesz pomocy dotyczącej interfejsu Split View API, odwiedź grupę dyskusyjną Chromium extensions w Google.

Miłego dzielenia!