Mengimplementasikan tindakan

Tindakan adalah tindakan yang terjadi saat pengguna mengklik ikon toolbar, biasanya disebut ikon tindakan untuk ekstensi Anda. Tindakan memanggil fitur ekstensi menggunakan Action API atau membuka popup. Halaman ini menunjukkan cara memanggil fitur ekstensi. Untuk menggunakan pop-up, lihat Menambahkan pop-up.

Mendaftarkan tindakan

Untuk menggunakan chrome.action API, tambahkan kunci "action" ke file manifes ekstensi. Lihat bagian manifes referensi API chrome.action untuk deskripsi lengkap tentang properti opsional kolom ini.

manifest.json:

{
  "name": "My Awesome action Extension",
 ...
  "action": {
   ...
  }
 ...
}

Tanggapi tindakan

Daftarkan pengendali onClicked saat pengguna mengklik ikon tindakan. Peristiwa ini tidak dipicu jika pop-up didaftarkan dalam file manifest.json.

service-worker.js:

chrome.action.onClicked.addListener((tab) => {
  chrome.action.setTitle({
    tabId: tab.id,
    title: `You are on tab: ${tab.id}`});
});

Aktifkan tindakan secara bersyarat

chrome.declarativeContent API memungkinkan Anda mengaktifkan ikon tindakan ekstensi berdasarkan URL halaman atau saat pemilih CSS cocok dengan elemen di halaman. Jika ikon tindakan ekstensi dinonaktifkan, ikon akan berwarna abu-abu. Jika pengguna mengklik ikon yang dinonaktifkan, menu konteks ekstensi akan muncul.

Ikon tindakan dinonaktifkan
Ikon tindakan dinonaktifkan.

Badge tindakan

Badge adalah bit teks berformat yang ditempatkan di atas ikon tindakan untuk menunjukkan hal-hal seperti status ekstensi atau bahwa tindakan diperlukan oleh pengguna. Untuk mendemonstrasikan ini, sampel Air Minum menampilkan badge dengan status "AKTIF" untuk menunjukkan kepada pengguna bahwa mereka telah berhasil menyetel alarm dan tidak menampilkan apa pun saat ekstensi tidak ada aktivitas. Badge dapat berisi hingga empat karakter.

Ikon ekstensi tanpa badge dan dengan badge.
Ikon ekstensi tanpa badge (kiri) dan dengan badge (kanan).

Setel teks badge dengan memanggil chrome.action.setBadgeText() dan warna latar belakang dengan memanggil chrome.action.setBadgeBackgroundColor()`.

service-worker.js:

chrome.action.setBadgeText({text: 'ON'});
chrome.action.setBadgeBackgroundColor({color: '#4688F1'});

Tooltip

Daftarkan tooltip di kolom "default_title" pada kunci "action" dalam file manifest.json.

manifest.json:

{
  "name": "Tab Flipper",
 ...
  "action": {
    "default_title": "Press Ctrl(Win)/Command(Mac)+Shift+Right/Left to flip tabs"
  }
...
}

Anda juga dapat menetapkan atau memperbarui tooltip dengan memanggil action.setTitle()`. Jika tidak ada tooltip yang ditetapkan, nama ekstensi akan ditampilkan.