এজেন্টের জন্য Chrome DevTools আপনার এজেন্টকে ব্রাউজার সেশন শুরু করতে এবং MCP সার্ভার ব্যবহার করে Chrome এক্সটেনশন ইনস্টল করতে বা ইন্টার্যাক্ট করতে দেয়। এটি আপনার কোডিং এজেন্টকে এক্সটেনশন লাইফসাইকেল কন্ট্রোল করতে দেয়: ইনস্টল, রিলোড ও ট্রিগার অ্যাকশন।
ম্যানুয়ালি আনপ্যাক করা এক্সটেনশন লোড করা, কোড পরিবর্তন করার সময় প্রতিবার এক্সটেনশন ম্যানেজমেন্ট পৃষ্ঠায় রিলোড বোতামে ক্লিক করা এবং এক্সটেনশন পরীক্ষা করার জন্য ম্যানুয়ালি ট্রিগার করার পরিবর্তে, আপনার AI এজেন্টকে সম্পূর্ণ প্রসেসটি স্বয়ংক্রিয়ভাবে ম্যানেজ করার নির্দেশ দিন। এটি স্ট্যাটিক কোড জেনারেশন এবং লাইভ এক্সটেনশন টেস্টিংয়ের মধ্যে ব্যবধান কমায়।
আপনি নিম্নলিখিত কাজগুলি করার জন্য এক্সটেনশন টুল ব্যবহার করতে পারবেন:
- এক্সটেনশন ইনস্টল করা: লোকাল ডিরেক্টরি পাথ থেকে আনপ্যাক করা Chrome এক্সটেনশন ইনস্টল করুন।
- এক্সটেনশনের তালিকা: ইনস্টল করা সব Chrome এক্সটেনশনের একটি তালিকা পান, যার মধ্যে নাম, আইডি, ভার্সন ও চালু থাকার স্ট্যাটাস অন্তর্ভুক্ত।
- এক্সটেনশন রিলোড করুন: কোডে করা পরিবর্তন সাথে সাথে প্রয়োগ করতে, আনপ্যাক করা Chrome এক্সটেনশন আইডি দিয়ে রিলোড করুন।
- ট্রিগার অ্যাকশন: কোনও এক্সটেনশনের আইডি দিয়ে সেটির ডিফল্ট অ্যাকশন ট্রিগার করুন,
যেমন, কোনও মেনু খোলা বা ব্যাকগ্রাউন্ড স্ক্রিপ্ট অ্যাকশন এক্সিকিউট করা (দেখুন,
API ডকুমেন্টেশনে
chrome.action)।
- এক্সটেনশন আনইনস্টল করা: ব্রাউজার সেশন থেকে আইডি ব্যবহার করে Chrome এক্সটেনশন সরিয়ে দেওয়া।
পূর্বশর্ত
এক্সটেনশন টুল ব্যবহার করার আগে, আপনার কাছে নিম্নলিখিতগুলি আছে কিনা তা নিশ্চিত করুন:
- এক্সপেরিমেন্টাল ফ্ল্যাগ: DevTools for Agents-এ এক্সটেনশন বিভাগ ডিফল্ট হিসেবে অ্যাক্টিভ থাকে না। আপনাকে অবশ্যই
--categoryExtensionsফ্ল্যাগ সহ MCP সার্ভার কনফিগার করতে হবে। - আনপ্যাক করা এক্সটেনশন:
install_extension-এর মতো টুলের ক্ষেত্রে আনপ্যাক করা এক্সটেনশন ফোল্ডারের জন্য অ্যাবসোলিউট পাথ প্রয়োজন হয়, যা লোকাল ডেভেলপমেন্টের জন্য উপযুক্ত। এক্সটেনশন ফোল্ডারে ফাইল অ্যাক্সেস: সার্ভার শুধুমাত্র তার ওয়ার্কস্পেস রুটের মধ্যে ফাইল পড়তে পারে। এগুলি হল আপনার MCP ক্লায়েন্টের প্রদান করা রুট, যেমন আপনার প্রোজেক্ট ডিরেক্টরি। আপনার ক্লায়েন্ট রুট প্রদান না করলে, সার্ভার শুধুমাত্র OS-এর অস্থায়ী ডিরেক্টরি অ্যাক্সেস করতে পারবে। macOS-এ, এই ডিরেক্টরি
/tmpনয়। এক্সটেনশন ফোল্ডারটি এইসব রুটের বাইরে থাকলে,install_extensionAccess deniedসমস্যার সাথে ব্যর্থ হয়। অন্য ফোল্ডারের অনুমতি দিতে, আপনার সার্ভারের আর্গুমেন্টে--filesystemRootফ্ল্যাগ (--workspaceঅ্যালিয়াস) যোগ করুন:"args": ["chrome-devtools-mcp@latest", "--categoryExtensions", "--filesystemRoot=/path/to/extensions"]আরও বিবরণের জন্য, অস্থায়ী ডিরেক্টরির বাইরে ফাইল অ্যাক্সেস করার অনুমতি দিন দেখুন।
Chrome এক্সটেনশন টুলের ব্যবহার
আপনার এজেন্টকে ডেভেলপ ও সমস্যা সমাধান করার সময় এক্সটেনশন লাইফসাইকেল ম্যানেজ করার নির্দেশ দিন।
মনে রাখবেন: এজেন্ট এক্সিকিউশন স্টেপ হল সম্ভাব্য আচরণের উদাহরণ। আপনার এজেন্ট অন্যভাবে কাজ করতে পারে।
দ্রুত এক্সটেনশন পরিবর্তন ও রিলোড করা
প্রতিটি ফাইল পরিবর্তনের পরে ম্যানুয়ালি একটি এক্সটেনশন রিলোড করলে ডেভেলপমেন্টের গতি কমে যায়। আপনার এজেন্টকে কোড ফিক্স প্রয়োগ করতে এবং ম্যানুয়াল হস্তক্ষেপ ছাড়াই নতুন আচরণ যাচাই করতে অবিলম্বে এক্সটেনশন রিলোড করতে নির্দেশ দিন।
প্রম্পটের উদাহরণ:
আপনি সাধারণ পদ্ধতি ব্যবহার করতে পারেন:
Verify the extension has access to the active tab.
অথবা আপনি আরও বিস্তারিতভাবে বলতে পারেন:
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.
এজেন্ট এক্সিকিউশনের উদাহরণ: আপনার এজেন্ট আপনার ফাইল সিস্টেমে manifest.json ফাইল এডিট করে। তারপরে, এটি প্রদত্ত আইডি ব্যবহার করে reload_extension টুলকে ইনভোক করে।
অবশেষে, এটি এক্সটেনশন অ্যাক্টিভেট করতে trigger_extension_action টুলকে কল করে
এবং কনসোলে কোনও অনুমতি সংক্রান্ত সমস্যা নেই তা যাচাই করে।
টার্গেট পৃষ্ঠায় এক্সটেনশনের ডিফল্ট অ্যাকশন পরীক্ষা করুন
কন্টেন্ট স্ক্রিপ্ট বা এক্সটেনশন অ্যাকশন কীভাবে কোনও নির্দিষ্ট ওয়েবসাইটের সাথে ইন্টার্যাক্ট করে তা আপনাকে প্রায়ই পরীক্ষা করে দেখতে হয়। আপনার এজেন্টকে সাইটে নেভিগেট করতে, এক্সটেনশন ইনস্টল করতে এবং এটি ট্রিগার করার নির্দেশ দিয়ে এই প্রক্রিয়াটি অটোমেট করুন।
প্রম্পটের উদাহরণ:
আপনি সাধারণ পদ্ধতি ব্যবহার করতে পারেন:
Test my extension on example.com and verify it works correctly.
অথবা আপনি আরও বিশদে বলতে পারেন:
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.
এজেন্ট এক্সিকিউশনের উদাহরণ: আপনার এজেন্ট
navigate_page ব্যবহার করে টার্গেট URL-এ নেভিগেট করে। তারপর এটি প্রদত্ত অ্যাবসোলিউট পাথের সাথে install_extension ব্যবহার করে। এক্সটেনশন লোড হওয়ার পরে, এটি ব্যবহারকারীর ক্লিক সিমুলেট করতে
trigger_extension_action এক্সিকিউট করে। সবশেষে, কন্টেন্ট স্ক্রিপ্ট রান করেছে এবং প্রত্যাশিত আউটপুট তৈরি করেছে কিনা তা কনফার্ম করতে এটি list_console_messages ব্যবহার করে।
ইনস্টল করা এক্সটেনশন যাচাই করা ও ক্লিন-আপ করা
অটোমেটেড টেস্টিংয়ের সময়, কোনও এক্সটেনশন সঠিক ভার্সন দিয়ে সঠিকভাবে লোড করা হয়েছে কিনা তা আপনাকে যাচাই করতে হতে পারে অথবা পরবর্তী টেস্টের জন্য একটি পরিষ্কার স্টেট নিশ্চিত করতে এটি সরিয়ে দিতে হতে পারে।
উদাহরণ প্রম্পট:
Uninstall 'My Test Extension' from the browser.
এজেন্ট এক্সিকিউশনের উদাহরণ: আপনার এজেন্ট list_extensions টুল ব্যবহার করে
ইনস্টল করা এক্সটেনশনের তালিকা ও সেগুলির মেটাডেটা রিট্রিভ করে। "My Test Extension"-এর সাথে যুক্ত আইডি শনাক্ত করতে এটি
আউটপুট পার্স করে। তারপর, ব্রাউজার থেকে নিরাপদে এটি সরিয়ে দিতে, সেই আইডি সহ
uninstall_extension টুল ব্যবহার করে।
নতুন এক্সটেনশন তৈরি করে তা পরীক্ষা করা
স্ক্র্যাচ থেকে নতুন Chrome এক্সটেনশন শুরু করার জন্য সাধারণত বয়লারপ্লেট ফাইল তৈরি করতে হয় এবং এটি পরীক্ষা করার জন্য ব্রাউজারে আনপ্যাক করা ডিরেক্টরি ম্যানুয়ালি লোড করতে হয়। আপনার এজেন্টকে প্রাথমিক কোড জেনারেট, এক্সটেনশন লোড এবং এর প্রাথমিক কার্যকারিতা যাচাই করার নির্দেশ দিয়ে এই ম্যানুয়াল সেট-আপ এড়িয়ে যান, এন্ড-টু-এন্ড, একটি ধাপে।
উদাহরণ প্রম্পট:
Build a Chrome extension that turns the page background gray when I click its icon. Save the files to a 'gray-bg-ext' folder in my project, navigate to example.com, load the extension, and verify that it works.
এজেন্ট এক্সিকিউশনের উদাহরণ: আপনার এজেন্ট একটি বেসিক Manifest V3
manifest.json এবং একটি ব্যাকগ্রাউন্ড সার্ভিস ওয়ার্কার তৈরি করে যা
chrome.action.onClicked ইভেন্টের জন্য অপেক্ষা করে। তারপরে এটি টেস্ট পৃষ্ঠায় নেভিগেট করে,
install_extension ইনভোক করে এবং ব্যবহারকারীর
ক্লিক সিমুলেট করতে trigger_extension_action ব্যবহার করে। সবশেষে, এটি DOM পরীক্ষা করে বা একটি স্ক্রিনশট নেয় যাতে নিশ্চিত করা যায় যে
ব্যাকগ্রাউন্ডটি ধূসর হয়ে গেছে, যা প্রমাণ করে যে বয়লারপ্লেটটি কার্যকরী।