Test Browser Experiences with Chrome DevTools
Browser bugs can hide behind static code and incomplete unit tests. This skill uses Chrome DevTools MCP to inspect live behavior and verify fixes with runtime evidence.
انسخ هذا الطلب إلى Agent لديك. يتضمن صفحة Skill المعتمدة وملف manifest.
Review the Skillstore skill "browser-testing-with-devtools" from https://skillstore.io/skills/addyosmani-browser-testing-with-devtools.md and its manifest at https://skillstore.io/api/skills/addyosmani-browser-testing-with-devtools/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.يجب أن يواصل Agent عرض خطته وطلب أي تأكيد تفرضه سياسة الأمان.
استخدم هذه الروابط عندما يحتاج AI Agent أو crawler أو script إلى سياق نظيف بدلًا من قراءة الصفحة كاملة.
جارٍ استخدام "browser-testing-with-devtools". Inspect the local task page after completing one task.
النتيجة المتوقعة:
جارٍ استخدام "browser-testing-with-devtools". Investigate a button that looks correct but does not respond.
النتيجة المتوقعة:
The button is present in the DOM, but its click handler throws a runtime error. The error appears in the console before any network request is sent.
جارٍ استخدام "browser-testing-with-devtools". Review a page before release.
النتيجة المتوقعة:
All 30 static findings are false positives in the audited documentation. The command, filesystem, network, screenshot, reconnaissance, and prompt-injection matches describe configuration, safe testing boundaries, or local verification steps rather than malicious behavior.
شارك تقرير التقييم المرتبط بالإصدار والشارة المحايدة وبطاقة التضمين والاستشهادات. تعرض Skillstore الأدلة من دون أن تقرر ما إذا كانت هذه المهارة آمنة.
https://skillstore.io/skills/addyosmani-browser-testing-with-devtools/audits/2?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report[](https://skillstore.io/skills/addyosmani-browser-testing-with-devtools?utm_source=security_passport_badge)<a href="https://skillstore.io/skills/addyosmani-browser-testing-with-devtools?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/addyosmani-browser-testing-with-devtools/security.svg" alt="Skillstore security assessment" loading="lazy"></a><iframe src="https://skillstore.io/embed/skills/addyosmani-browser-testing-with-devtools.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>addyosmani. (2026). browser-testing-with-devtools security audit report (audit version 2) [Author version unspecified]. Skillstore. https://skillstore.io/skills/addyosmani-browser-testing-with-devtools/audits/2@techreport{addyosmani-addyosmani-browser-testing-with-devtools-2026,
author = {addyosmani},
title = {browser-testing-with-devtools security audit report (audit version 2)},
institution = {Skillstore},
year = {2026},
number = {2},
url = {https://skillstore.io/skills/addyosmani-browser-testing-with-devtools/audits/2},
note = {Author version unspecified}
}cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "browser-testing-with-devtools security audit report (audit version 2)"
version: "unspecified"
type: report
authors:
- name: "addyosmani"
date-released: "2026-09-19"
url: "https://skillstore.io/skills/addyosmani-browser-testing-with-devtools/audits/2"
identifiers:
- type: other
value: "skillstore:addyosmani-browser-testing-with-devtools:audit:2"
description: "Skillstore immutable audit report identifier"
Reproduce a layout or interaction bug, inspect the DOM and styles, capture evidence, and verify the implemented fix.
Exercise a browser workflow and confirm request methods, payloads, responses, and console behavior against expected results.
Check accessibility structure, visual output, performance signals, and browser errors before shipping a user-facing change.
Open the local page I provide. Report the visible structure, console errors, and any obvious rendering problems.
Reproduce the reported UI issue, inspect the affected element and computed styles, then verify the fix with a fresh screenshot.
Run the specified user flow. Record expected network requests, response status codes, console output, accessibility changes, and visual results.
Capture a performance trace before and after the change. Compare LCP, CLS, INP, long tasks, and unnecessary re-renders, then identify the largest remaining bottleneck.
المؤلف
addyosmaniالترخيص
MIT
مراجعة Skillstore
r2
تنبيه الإصدار
لم يعلن المؤلف عن إصدار.
مرجع
5d5054f8a23586f9b500fece1cb613a9dffc787b
حداثة الصيانة
١٩/٩/٢٠٢٦
الاستخدام
1 تنزيلات · 0 مشاهدات
بنية الملفات
📄 SKILL.md
مراجعة الشيفرة عبر خمسة محاور للجودة
قد تُخفي تغييرات الشيفرة مشكلات تتعلق بالصحة والأمان والبنية وسهولة القراءة والأداء. تطبق هذه المهارة عملية مراجعة منظمة وتنتج ملاحظات عملية مرتبة حسب الأولوية.
Clarify User Intent Before You Build
Underspecified requests cause teams to build the wrong outcome and discover misalignment late. This skill runs a focused, one-question interview that turns ambiguity into confirmed intent.
Plan Work Into Verifiable Tasks
Large or vague software work can hide dependencies, missing acceptance criteria, and verification gaps. This skill converts a specification into ordered task slices with checkpoints, scope guidance, and clear completion conditions.
Document Decisions and Architecture Clearly
Teams lose context when important technical decisions remain in chat, code comments, or individual memory. This skill turns architectural reasoning, API guidance, project instructions, and release changes into structured documentation.
Build Accessible, Production-Ready Frontends
Frontend work can become inconsistent, inaccessible, or difficult to maintain. This skill guides component architecture, responsive layouts, state handling, and polished user experiences.
Debug Errors with a Root-Cause Workflow
Debugging failures by guesswork wastes time and can hide the real cause. This skill provides a repeatable process for reproducing, isolating, fixing, and verifying problems.
تصحيح الأخطاء والبحث عن الأسباب الجذرية
بواسطة 89jobrien
يصعب فرز الأخطاء والحوادث عندما تكون الأدلة موزعة بين السجلات وتتبعات المكدس والخدمات. تنظّم هذه المهارة التشخيص، وتحلل السجلات، وتحدد الأنماط، وتوجّه نحو إصلاحات محدودة.
العثور على سياق الكود بشكل أسرع
بواسطة 89jobrien
غالبًا ما يضيع المطورون وقتًا في تتبع سبب وجود الكود وما الذي يعتمد عليه. توجه هذه المهارة Claude أو Codex أو Claude Code إلى جمع معرفة الرسم البياني ذات الصلة، والمستدعين، والاستيرادات، والاختبارات قبل إجراء التغييرات.
ابنِ ميزات SwiftUI أفضل
بواسطة avdlee
يمكن أن تتراكم في مشاريع SwiftUI واجهات API مهملة، وحالة هشة، وتحديثات بطيئة للواجهات. توفر هذه المهارة إرشادات مركزة لكتابة كود SwiftUI حديث وقابل للصيانة.
تصميم أدوات موثوقة للوكلاء
بواسطة Asmayaseen
تفشل الوكلاء عندما تكون أسماء الأدوات أو مدخلاتها أو مخرجاتها أو أخطاؤها غامضة. توفر هذه المهارة أنماطًا عملية لوصف الأدوات والمخططات وتنسيقات الاستجابة والاختبار.
تصحيح مشكلات البرمجيات بشكل منهجي
بواسطة Asmayaseen
إصلاح الأخطاء بلا بنية واضحة يبدد الوقت وقد يخفي سبب الفشل الحقيقي. ترشد هذه المهارة Claude وCodex وClaude Code خلال تحليل السبب الجذري القائم على الأدلة.
تشخيص تدهور السياق في وكلاء الذكاء الاصطناعي
بواسطة ChakshuGautam
يمكن للمحادثات الطويلة والمطالبات الكبيرة أن تجعل وكلاء الذكاء الاصطناعي يفقدون معلومات مهمة أو يتبعون سياقًا متعارضًا. تساعد هذه المهارة Claude وCodex وClaude Code على تحديد أنماط التدهور واختيار استراتيجيات التخفيف.