Yapay zeka temsilcileriyle Chrome uzantılarında hata ayıklama

Ajanlar için Chrome Geliştirici Araçları, ajanınızın bir tarayıcı oturumu başlatmasına ve bir MCP sunucusunu kullanarak Chrome uzantılarını yüklemesine veya bu uzantılarla etkileşimde bulunmasına olanak tanır. Bu sayede kodlama aracınız, uzantı yaşam döngüsünü kontrol edebilir (yükleme, yeniden yükleme ve işlemleri tetikleme).

Paketlenmemiş bir uzantıyı manuel olarak yüklemek, kodu her değiştirdiğinizde uzantı yönetimi sayfasındaki yeniden yükleme düğmesini tıklamak ve uzantıyı test etmek için manuel olarak tetiklemek yerine, yapay zeka ajanınıza tüm süreci bağımsız olarak yönetmesini söyleyin. Bu, statik kod oluşturma ile canlı uzantı testi arasındaki boşluğu kapatır.

Uzantı araçlarını kullanarak şunları yapabilirsiniz:

  • Uzantıları yükleme: Yerel bir dizin yolundan paketlenmemiş bir Chrome uzantısını yükleyin.
  • Uzantıları listeleme: Adları, kimlikleri, sürümleri ve etkinleştirilme durumları da dahil olmak üzere yüklü tüm Chrome uzantılarının listesini alın.
  • Uzantıları yeniden yükleme: Kod değişikliklerini anında uygulamak için paketlenmemiş bir Chrome uzantısını kimliğine göre yeniden yükleyin.
  • İşlemleri tetikleme: Bir uzantının varsayılan işlemini kimliğine göre tetikleyin. Örneğin, bir menüyü açma veya arka plan komut dosyası işlemini yürütme (bkz. API dokümanlarındaki chrome.action).
    • Uzantıları kaldırma: Chrome uzantılarını kimliklerine göre tarayıcı oturumundan kaldırın.

Ön koşullar

Uzantı araçlarını kullanmadan önce aşağıdakilere sahip olduğunuzdan emin olun:

  • Deneysel işaret: Uzantılar kategorisi, Temsilciler için Geliştirici Araçları'nda varsayılan olarak etkin değildir. MCP sunucusunu --categoryExtensions işaretiyle yapılandırmanız gerekir.
  • Paketlenmemiş uzantılar: install_extension gibi araçlar, paketlenmemiş uzantı klasörüne mutlak bir yol gerektirir. Bu nedenle, yerel geliştirme için idealdir.

Chrome uzantısı araçlarının kullanım alanları

Ajanınıza, uzantınızın yaşam döngüsünü geliştirme ve hataları düzeltme sırasında yönetmesi talimatını verin.

Not: Aracı yürütme adımları, olası davranış örnekleridir. Ajanınız farklı şekilde davranabilir.

Uzantıyı hızlı bir şekilde yineleme ve yeniden yükleme

Her dosya değişikliğinden sonra uzantıyı manuel olarak yeniden yüklemek geliştirme sürecini yavaşlatır. Aracınıza, kod düzeltmesi uygulamasını ve yeni davranışı manuel müdahale olmadan doğrulamak için uzantıyı hemen yeniden yüklemesini söyleyin.

Örnek istem:

Genel bir yaklaşım kullanabilirsiniz:

Verify the extension has access to the active tab.

Dilerseniz daha ayrıntılı bilgi verebilirsiniz:

Update the manifest.json to include the "activeTab" permission. Then, reload the extension with ID 'abc123xyz' and trigger its default action to ensure it works.

Örnek ajan yürütme: Ajanınız, dosya sisteminizdeki manifest.json dosyasını düzenler. Ardından, sağlanan kimliği kullanarak reload_extension aracını çağırır. Son olarak, uzantıyı etkinleştirmek ve konsolda izin hatası verilmediğini doğrulamak için trigger_extension_action aracını çağırır.

Bir uzantının varsayılan işlemini hedef sayfada test etme

Genellikle bir içerik komut dosyasının veya uzantı işleminin belirli bir web sitesiyle nasıl etkileşim kurduğunu test etmeniz gerekir. Temsilcinize siteye gitmesini, uzantıyı yüklemesini ve tetiklemesini söyleyerek bu süreci otomatikleştirebilirsiniz.

Örnek istem:

Genel bir yaklaşım kullanabilirsiniz:

Test my extension on example.com and verify it works correctly.

Dilerseniz daha ayrıntılı bilgi verebilirsiniz:

Navigate to example.com, install the unpacked extension located at '/Users/dev/my-extension', and trigger the extension action. Check the console logs to verify the content script executed correctly.

Örnek aracı yürütme: Aracınız, navigate_page kullanarak hedef URL'ye gider. Ardından, sağlanan mutlak yolla install_extension kullanılır. Uzantı yüklendikten sonra, kullanıcı tıklamasını simüle etmek için trigger_extension_action komutunu yürütür. Son olarak, içerik komut dosyasının çalıştırıldığını ve beklenen çıkışı ürettiğini doğrulamak için list_console_messages kullanılır.

Yüklü uzantıları doğrulama ve temizleme

Otomatik test sırasında, bir uzantının doğru sürümle düzgün şekilde yüklenip yüklenmediğini doğrulamanız veya bir sonraki test için temiz bir durum sağlamak üzere uzantıyı kaldırmanız gerekebilir.

Örnek istem:

Uninstall 'My Test Extension' from the browser.

Aracı yürütme örneği: Aracınız, yüklü uzantıların listesini ve meta verilerini almak için list_extensions aracını kullanıyor. Çıkışı ayrıştırarak "Test Uzantım" ile ilişkili kimliği tanımlar. Ardından, tarayıcıdan güvenli bir şekilde kaldırmak için bu kimliğe sahip uninstall_extension aracını kullanır.

Yeni bir uzantı oluşturma ve test etme

Yeni bir Chrome uzantısını sıfırdan oluşturmak genellikle standart dosyaların oluşturulmasını ve test etmek için paketlenmemiş dizinin tarayıcıya manuel olarak yüklenmesini gerektirir. Temsilcinize ilk kodu oluşturmasını, uzantıyı yüklemesini ve temel işlevselliğini tek adımda uçtan uca doğrulamasını söyleyerek bu manuel kurulumu atlayın.

Örnek istem:

Build a Chrome extension that turns the page background gray when I click its icon. Save the files to '/tmp/gray-bg-ext', navigate to example.com, load the extension, and verify that it works.

Örnek ajan yürütme: Ajanınız temel bir Manifest V3 manifest.json ve chrome.action.onClicked etkinliğini dinleyen bir arka plan hizmeti çalışanı oluşturur. Ardından test sayfasına gider, install_extension işlevini çağırır ve kullanıcı tıklamasını simüle etmek için trigger_extension_action işlevini kullanır. Son olarak, arka planın griye döndüğünü doğrulamak için DOM'u inceler veya ekran görüntüsü alır. Bu, hazır metnin işlevsel olduğunu kanıtlar.