ক্রোম ডেভটুলস এমসিপি ব্যবহার করে সাইবারএজেন্ট কীভাবে সম্পূর্ণ স্বয়ংক্রিয় রানটাইম ত্রুটি সমাধান অর্জন করেছে

কাজুনারি হারা
Kazunari Hara
সিনা কিম
Syna Kim
ইউরিকো হিরোটা
Yuriko Hirota
দামানি ব্রাউন
Damani Brown

জাপানের একটি শীর্ষস্থানীয় আইটি কোম্পানি সাইবারএজেন্ট, জনপ্রিয় আমেবা ব্লগিং প্ল্যাটফর্ম সহ বিস্তৃত পরিসরে অনলাইন পরিষেবা প্রদান করে। দলটি রানটাইম ত্রুটির একটি উল্লেখযোগ্য চ্যালেঞ্জের মুখোমুখি হয়েছিল যা স্বয়ংক্রিয় পরীক্ষার মাধ্যমে সনাক্ত করা কঠিন ছিল, যার জন্য সময়সাপেক্ষ ম্যানুয়াল হস্তক্ষেপের প্রয়োজন ছিল।

এই ডকুমেন্টটি অন্বেষণ করে যে কীভাবে সাইবারএজেন্ট ক্রোম ডেভটুলস মডেল কনটেক্সট প্রোটোকল (এমসিপি) সার্ভার ব্যবহার করে ম্যানুয়াল প্রক্রিয়া থেকে স্বয়ংক্রিয় কর্মপ্রবাহে স্থানান্তরিত হয়েছিল, ডেভেলপারদের সময় সাশ্রয় করেছিল এবং তাদের পরীক্ষা প্রবাহের নির্ভরযোগ্যতা উন্নত করেছিল।

চ্যালেঞ্জ: একটি ম্যানুয়াল এবং সীমিত কর্মপ্রবাহ

Ameba ডিজাইন সিস্টেম, Spindle, হল ব্লগিং প্ল্যাটফর্মের ইন্টারফেস তৈরিতে ব্যবহৃত পুনঃব্যবহারযোগ্য UI উপাদানগুলির একটি সংগ্রহ । এটি UI উপাদান বিকাশ এবং পরীক্ষার জন্য Storybook এর উপর নির্ভর করে।

পূর্বে, রানটাইম ত্রুটিগুলি সমাধানের জন্য সাইবার এজেন্টের কর্মপ্রবাহ ছিল একটি পুনরাবৃত্তিমূলক, ম্যানুয়াল চক্র। একজন ডেভেলপার ব্রাউজারে প্রতিটি উপাদান পরীক্ষা করতেন, একটি সংশোধন প্রয়োগ করতেন এবং তারপরে আবার পরীক্ষা করতেন। প্রচুর সংখ্যক পৃষ্ঠা এবং উপাদানের সাথে, ভিজ্যুয়াল নিশ্চিতকরণের উপর এই নির্ভরতার সীমাবদ্ধতা ছিল, যার ফলে প্রতিটি বাগ ধরা কঠিন হয়ে পড়ে।

সমাধান: Chrome DevTools MCP ব্যবহার করে ডিবাগিং এজেন্ট

এই চ্যালেঞ্জ কাটিয়ে ওঠার জন্য, দলটি Chrome DevTools MCP সার্ভারের দিকে ঝুঁকেছে। অফিসিয়াল অনবোর্ডিং গাইড ব্যবহার করে একটি সহজ সেটআপের পরে, তারা অবিলম্বে একজন AI এজেন্ট (ক্লড) কে সম্পূর্ণ ডিবাগিং ওয়ার্কফ্লো স্বয়ংক্রিয় করার নির্দেশ দিতে সক্ষম হয়েছে।

একটি মাত্র প্রম্পটের মাধ্যমে, এজেন্টটি Chrome DevTools MCP দ্বারা সংগৃহীত ব্রাউজার স্টেট তথ্য প্রক্রিয়াকরণের মাধ্যমে DevTools এর সাথে ইন্টারঅ্যাক্ট করতে পারে; ফাইল সিস্টেমের প্রসঙ্গ অ্যাক্সেস করতে পারে এবং কনসোল লগ পড়তে পারে। এরপর এটি স্বয়ংক্রিয়ভাবে ত্রুটি সনাক্ত করে এবং ম্যানুয়াল হস্তক্ষেপ ছাড়াই সংশোধন বাস্তবায়ন করে।

তারা যে প্রাথমিক প্রম্পটটি ব্যবহার করেছিল তা ছিল নিম্নরূপ:

Currently, spindle-ui's Storybook is running, but runtime errors may be occurring.

Please use chrome-dev-tools-mcp to confirm the operation of the Story in the following steps:
Identify all target Stories. Confirm each and every one, no matter how many there are.
Confirm that the Story is displayed correctly using dev-tools-mcp.
Fix all errors.
Click and move through each Story from the top in the browser opened with mcp to confirm.

এআই এজেন্ট স্টোরিবুক ইনস্ট্যান্সটি অডিট করতে শুরু করে, ত্রুটিগুলি পড়ার জন্য, কোড সংশোধন প্রয়োগ করার জন্য এবং প্রতিটি সংশোধনের সাফল্য নিশ্চিত করার জন্য সম্পূর্ণ গল্পগুলি নেভিগেট করে।

প্রভাব: ম্যানুয়াল চেক থেকে শুরু করে স্বয়ংক্রিয় সংশোধন পর্যন্ত

ফলাফল দ্রুত ছিল। প্রায় এক ঘন্টার মধ্যে, এআই এজেন্ট স্পিন্ডল ডিজাইন সিস্টেমের সমস্ত 32টি উপাদান এবং 236টি তলা স্বায়ত্তশাসিতভাবে অডিট করে।

DevTools MCP ব্যবহার করে কম্পোনেন্টের সমস্যাগুলি স্বয়ংক্রিয়ভাবে সমাধানের ফলাফলের স্ক্রিনশট।

যদিও এজেন্ট একটি রানটাইম ত্রুটি এবং দুটি সতর্কতা সনাক্ত করে এবং ঠিক করে, পরীক্ষার আসল মূল্য নেতিবাচকতার নিশ্চয়তার মধ্যে নিহিত ছিল: নিশ্চিত করা যে লাইব্রেরির বিশাল অংশ ত্রুটি-মুক্ত ছিল, কোনও ডেভেলপারকে শত শত রাজ্যে ম্যানুয়ালি ক্লিক করার প্রয়োজন ছাড়াই।

পূর্বে, এই ধরণের ব্যাপক নিরীক্ষা দৃশ্যত ক্লান্তিকর ছিল এবং মানুষের তদারকির ঝুঁকি ছিল। Chrome DevTools MCP-তে এই শ্রম অফলোড করে, CyberAgent নিম্নলিখিত অর্জন করেছে:

  • ১০০% নিরীক্ষা কভারেজ : এজেন্ট যান্ত্রিকভাবে প্রতিটি গল্প যাচাই করে নিশ্চিত করে যে "পরিষ্কার" উপাদানগুলি আসলে পরিষ্কার, ম্যানুয়ালি বজায় রাখা কঠিন পরিশ্রমের স্তর।
  • শূন্য মিথ্যা নেতিবাচকতা : স্বয়ংক্রিয় পরীক্ষার স্যুটগুলির বিপরীতে যা ভিজ্যুয়াল রানটাইম অসঙ্গতিগুলি মিস করতে পারে, MCP সার্ভার এজেন্টকে প্রকৃত ব্রাউজার অবস্থা যাচাই করার অনুমতি দেয়, উচ্চ নির্ভরযোগ্যতা নিশ্চিত করে।
  • জ্ঞানীয় অফলোডিং : ডেভেলপাররা পুনরাবৃত্তিমূলক "ঘোঁৎঝাঁৎ কাজ" পরিচালনা করার জন্য সিস্টেমের উপর আস্থা রাখতে পারে, যা তাদের নিয়মিত চেকের পরিবর্তে জটিল যুক্তির উপর মনোনিবেশ করার সুযোগ দেয়।

ওয়েব ডেভেলপার কোটা ইয়ানাগি যেমন উল্লেখ করেছেন, সুবিধাটি ছিল দায়িত্বের পরিবর্তন:

"ব্রাউজারে আমি আগে যে রানটাইম ত্রুটি এবং সতর্কতা পরীক্ষাগুলি ম্যানুয়ালি করতাম, সেগুলি অফলোড করা খুবই সুবিধাজনক হয়েছে। আমি এটাও পছন্দ করি যে আমি এখন প্রাকৃতিক ভাষায় জটিল ক্রিয়াকলাপগুলি বর্ণনা করতে পারি এবং টুলটি ত্রুটি লগগুলি পড়া থেকে শুরু করে সরাসরি সমস্যা সমাধান পর্যন্ত ব্যবহার করতে পারে।"

এই স্বয়ংক্রিয় কর্মপ্রবাহের সাফল্যের ফলে সাইবারএজেন্ট তাদের এআই এজেন্টদের জন্য তাদের অভ্যন্তরীণ স্পিন্ডল এজেন্টস গাইড আপডেট করতে বাধ্য হয়েছে। এই গাইডটি এখন তাদের এআই এজেন্ট ক্লডের জন্য ক্রোম ডেভটুলস এমসিপিকে ডিফল্ট ডিবাগিং সার্ভার হিসেবে প্রতিষ্ঠা করে, এর ব্যবহারকে সর্বোত্তম অনুশীলন হিসেবে আনুষ্ঠানিক করে এবং এই নতুন এআই-চালিত প্রক্রিয়ার প্রতি তাদের আস্থা প্রদর্শন করে।

দুটি পুল রিকোয়েস্টে কংক্রিট সংশোধনগুলি বাস্তবায়িত হয়েছিল, যা আপনি GitHub-এ পর্যালোচনা করতে পারেন:

সাইবারএজেন্ট প্রম্পটটিকে আরও উন্নত করেছে এবং এই চূড়ান্ত আউটপুটটি প্রকাশ করেছে।

প্রতিক্রিয়া এবং ভবিষ্যৎ পরিকল্পনা

ক্রোম ডেভটুলস এমসিপির নমনীয়তা এবং উপলব্ধ বিকল্পগুলির সংখ্যা দেখে সাইবারএজেন্ট সন্তুষ্ট। তারা ভবিষ্যতের উন্নতির জন্য মূল্যবান প্রতিক্রিয়াও প্রদান করেছে, উল্লেখ করে যে টুলটি শক্তিশালী হলেও, এর আরও উন্নত বৈশিষ্ট্যগুলি ব্যবহার করার জন্য ব্যবহারকারীর জ্ঞানের একটি নির্দিষ্ট স্তর প্রয়োজন।

ভবিষ্যতের দিকে তাকিয়ে, দলটি DevTools পারফরম্যান্স প্যানেলের সাথে আরও গভীর একীকরণে আগ্রহী। তারা এমন একটি কর্মপ্রবাহ কল্পনা করে যেখানে একজন এজেন্ট কোর ওয়েব ভাইটালস যাচাই করতে পারে এবং তারপরে পারফরম্যান্স প্যানেল ব্যবহার করে আরও গভীরতর পারফরম্যান্স বিশ্লেষণে এগিয়ে যেতে পারে বিশ্লেষণ এবং উন্নতির পরামর্শ দিতে।

সাইবার এজেন্টের ডেভেলপার বিশেষজ্ঞ, কাজুনারি হারা, তার বিস্ময় ভাগ করে নিয়েছেন, টুলটির দক্ষতা এবং ভবিষ্যতের প্রয়োগের সম্ভাবনা তুলে ধরেছেন:

"আমি অবাক হয়েছিলাম যখন দেখলাম ব্রাউজারটি লগ থেকে সরাসরি ত্রুটিগুলি স্বয়ংক্রিয়ভাবে ঠিক করছে। যে কাজগুলি আগে মিস করা হত বা দীর্ঘ সময় লাগত সেগুলি এখন নির্ভরযোগ্যভাবে স্বয়ংক্রিয় করা যেতে পারে, যা বিকাশের দক্ষতা উন্নত করে। যেহেতু Chrome DevTools MCP বাস্তব রানটাইম পরিবেশে অনেক বৈশিষ্ট্য অফার করে, আমি আশা করি এটি ভবিষ্যতে বিভিন্ন পরিস্থিতিতে কার্যকর হবে।"

উপসংহার

ক্রোম ডেভটুলস এমসিপিকে তাদের কর্মপ্রবাহে একীভূত করে, সাইবারএজেন্ট একটি জটিল এবং সময়সাপেক্ষ ডিবাগিং কাজ সফলভাবে স্বয়ংক্রিয় করেছে। তাদের অভিজ্ঞতা ডেভেলপারদের উৎপাদনশীলতা বৃদ্ধিতে এআই-চালিত সরঞ্জামগুলির অপরিসীম সম্ভাবনা প্রদর্শন করে।

প্রক্রিয়াটি সম্পূর্ণ স্বয়ংক্রিয়তা অর্জন করেছে, ম্যানুয়াল চেকের প্রয়োজনীয়তা দূর করেছে এবং কোনও ত্রুটি যাতে মিস না হয় তা নিশ্চিত করেছে। বর্তমান বাস্তবায়ন ইতিমধ্যেই এর মূল্য প্রমাণ করেছে, সাইবারএজেন্টের প্রতিক্রিয়া একটি উত্তেজনাপূর্ণ ভবিষ্যতের কথা তুলে ধরে যেখানে Chrome DevTools MCP সরাসরি ব্রাউজারের মধ্যে তাদের জন্য আরও পরিশীলিত কর্মক্ষমতা বিশ্লেষণ এবং অপ্টিমাইজেশন কার্য সক্ষম করতে পারে।