Tindakan ekstensi di Manifes V3

Sejak peluncuran ekstensi Chrome, platform ini telah mengizinkan developer mengekspos ekstensi fungsionalitas secara langsung di UI Chrome tingkat atas menggunakan tindakan. Tindakan adalah tombol ikon yang dapat membuka pop-up atau memicu beberapa fungsi di ekstensi. Secara historis, Chrome mendukung dua jenis tindakan, tindakan browser, dan tindakan halaman; Manifes V3 mengubah ini dengan menggabungkan fungsi baru di API chrome.action baru.

Histori singkat tindakan ekstensi

Meskipun chrome.action masih baru di Manifes V3, fungsi dasar yang disediakannya sudah ada sejak lama saat ekstensi pertama kali dirilis di stabil pada Januari 2010. Stabil pertama rilis platform ekstensi Chrome mendukung dua jenis tindakan yang berbeda: browser tindakan dan tindakan halaman.

Tindakan browser memungkinkan developer ekstensi menampilkan ikon "di toolbar utama Google Chrome, di sebelah kanan kolom URL" (sumber) dan memberikan cara mudah bagi pengguna untuk memicu fungsi ekstensi di halaman mana pun. Di sisi lain, tindakan halaman dimaksudkan untuk "mewakili tindakan yang dapat dilakukan di halaman saat ini, tetapi tidak berlaku untuk semua halaman" (sumber).

Tindakan halaman (kiri) akan muncul di omnibox, yang menunjukkan bahwa ekstensi dapat melakukan sesuatu di halaman ini. Tindakan browser (kanan) selalu terlihat.

Dengan kata lain, tindakan browser memberi developer ekstensi sebuah platform UI yang persisten di browser sedangkan tindakan halaman hanya muncul saat ekstensi dapat melakukan hal yang bermanfaat di halaman saat ini.

Kedua jenis tindakan ini bersifat opsional, jadi developer ekstensi dapat memilih untuk tidak memberikan tindakan, tindakan halaman, atau tindakan browser (menentukan beberapa tindakan tidak diizinkan).

Sekitar enam tahun kemudian, Chrome 49 memperkenalkan paradigma UI baru untuk ekstensi. Untuk membantu pengguna memahami ekstensi yang mereka miliki, Chrome mulai menampilkan semua ekstensi aktif ke di sebelah kanan omnibox. Pengguna dapat "meluap" ekstensi ke dalam menu Chrome jika mereka menginginkannya.

Ikon ekstensi yang tersembunyi akan muncul di menu Chrome.

Guna menampilkan ikon untuk setiap ekstensi, pembaruan ini juga mengantarkan dua perubahan penting untuk perilaku ekstensi di UI Chrome. Pertama, semua ekstensi mulai menampilkan ikon di toolbar. Jika ekstensi tidak memiliki ikon, Chrome akan membuat ikon secara otomatis. Kedua, tindakan halaman dipindahkan ke bilah alat bersama tindakan browser dan diberikan kemampuan untuk membedakan di antara "acara" mereka dan "sembunyikan" negara bagian.

Tindakan halaman yang dinonaktifkan (kiri) dirender sebagai gambar hitam putih di toolbar, sedangkan tindakan halaman yang diaktifkan (kanan) akan muncul dengan warna penuh.

Perubahan ini memungkinkan ekstensi tindakan halaman untuk terus berfungsi seperti yang diharapkan, tetapi juga berkurang peran tindakan halaman dari waktu ke waktu. Salah satu efek desain ulang UI adalah bahwa tindakan laman secara efektif disertakan oleh tindakan browser. Karena semua ekstensi muncul di {i>toolbar<i}, pengguna diarahkan memperkirakan bahwa mengklik ikon toolbar ekstensi akan memanggil ekstensi, dan tindakan browser menjadi interaksi yang makin penting bagi ekstensi Chrome.

Perubahan Manifes V3

UI dan ekstensi Chrome terus berkembang setelah UI ekstensi 2016 desain ulang, namun tindakan browser dan tindakan halaman sebagian besar tidak berubah. Yaitu, setidaknya sampai kami mulai merencanakan cara memodernisasi platform ekstensi dengan Manifes V3.

Jelas bagi tim ekstensi bahwa tindakan browser dan tindakan halaman semakin menjadi membedakan tanpa makna. Lebih buruk lagi, perbedaan perilaku yang halus mereka menyulitkan developer untuk menentukan mana yang akan digunakan. Kami menyadari bahwa kami dapat mengatasi masalah ini dengan menggabungkan browser {i>action<i} dan tindakan halaman menjadi satu "tindakan".

Masukkan Action API; chrome.action paling analog dengan chrome.browserAction, tetapi memiliki beberapa perbedaan penting.

Pertama, chrome.action memperkenalkan metode baru bernama getUserSettings(). Metode ini memberi developer ekstensi cara untuk memeriksa apakah pengguna telah menyematkan tindakan ekstensi mereka ke {i>toolbar<i}.

let userSettings = await chrome.action.getUserSettings();
console.log(`Is the action pinned? ${userSettings.isOnToolbar ? 'Yes' : 'No'}.`);

"getUserSettings" (getUserSettings) mungkin tampak agak aneh nama untuk fungsi ini dibandingkan dengan, katakanlah, "isPin", tetapi histori tindakan di Chrome menunjukkan bahwa UI browser berubah lebih cepat daripada yang dimiliki API ekstensi. Oleh karena itu, tujuan kami dengan API ini adalah untuk mengekspos preferensi pengguna terkait tindakan di antarmuka generik untuk meminimalkan churn API di masa mendatang. Hal ini juga memungkinkan vendor browser lain mengekspos konsep UI khusus browser di objek UserSettings yang ditampilkan oleh .

Kedua, ikon dan status tindakan ekstensi yang diaktifkan/dinonaktifkan dapat dikontrol menggunakan Content API deklaratif. Hal ini penting karena memungkinkan ekstensi bereaksi terhadap penjelajahan pengguna perilaku tanpa mengakses konten atau bahkan URL halaman yang mereka kunjungi. Sebagai contoh, mari kita melihat bagaimana ekstensi dapat mengaktifkan tindakannya saat pengguna mengunjungi halaman di example.com.

// Manifest V3
chrome.runtime.onInstalled.addListener(() => {
  chrome.declarativeContent.onPageChanged.removeRules(undefined, () => {
    chrome.declarativeContent.onPageChanged.addRules([
      {
        conditions: [
          new chrome.declarativeContent.PageStateMatcher({
            pageUrl: {hostSuffix: '.example.com'},
          })
        ],
        actions: [new chrome.declarativeContent.ShowAction()]
      }
    ]);
  });
});

Kode di atas hampir sama dengan yang akan dilakukan ekstensi dengan tindakan halaman. Satu-satunya perbedaannya adalah di Manifes V3 kita menggunakan declarativeContent.ShowAction, declarativeContent.ShowPageAction di Manifes V2.

Terakhir, pemblokir konten dapat menggunakan setExtensionActionOptions) untuk menampilkan jumlah permintaan yang diblokir oleh ekstensi untuk tab tertentu. Kemampuan ini penting karena memungkinkan pemblokir konten untuk terus memberikan informasi kepada pengguna akhir tanpa mengekspos metadata penjelajahan yang berpotensi sensitif ke ekstensi.

Rangkuman

Memodernisasi platform ekstensi Chrome adalah salah satu motivasi utama kami untuk Manifes V3. Di banyak kasus yang berarti beralih ke teknologi baru, tetapi juga berarti menyederhanakan platform API kami; itulah tujuan kami.

Saya harap postingan ini dapat membantu menjelaskan sudut khusus dari platform Manifest V3 ini. Kepada pelajari lebih lanjut tentang cara tim Chrome menyambut masa depan ekstensi browser, lihat Halaman Visi platform dan Ringkasan Manifes V3 di dokumentasi developer. Anda juga dapat mendiskusikan ekstensi Chrome dengan developer lain di chromium-extensions di grup Google.