المهارات chrome-devtools-debugging

📦

chrome-devtools-debugging

Name: chrome-devtools-debugging
Author: Consiliency

مراجعة المحتوى r1 مخاطر عالية 🌐 الوصول إلى الشبكة⚡ يحتوي على سكربتات⚙️ الأوامر الخارجية

تصحيح أخطاء تطبيقات الويب باستخدام Chrome DevTools

غالبا ما تختبئ أخطاء المتصفح في سجلات وحدة التحكم، وحركة الشبكة، وحالة المصادقة. ترشد هذه المهارة Claude وCodex وClaude Code خلال تصحيح الأخطاء باستخدام Chrome DevTools MCP.

يدعم: Claude Codex Code(CC)

⚠️ 38 ضعيف

توقف واطلب التأكيد قبل التثبيت.

راجع الخطة واحصل على موافقة صريحة من المستخدم قبل تغيير الملفات.

التثبيت باستخدام Agent لدي

انسخ هذا الطلب إلى Agent لديك. يتضمن صفحة Skill المعتمدة وملف manifest.

طلب الوكيل

Review the Skillstore skill "chrome-devtools-debugging" from https://skillstore.io/skills/consiliency-chrome-devtools-debugging.md and its manifest at https://skillstore.io/api/skills/consiliency-chrome-devtools-debugging/manifest. Verify the artifact. Stop and obtain explicit user consent before installing or changing files.

يجب أن يواصل Agent عرض خطته وطلب أي تأكيد تفرضه سياسة الأمان.

موارد مهيّأة لـ Agents

استخدم هذه الروابط عندما يحتاج AI Agent أو crawler أو script إلى سياق نظيف بدلًا من قراءة الصفحة كاملة.

تفاصيل Markdown GET /skills/consiliency-chrome-devtools-debugging.md manifest موقَّع GET /api/skills/consiliency-chrome-devtools-debugging/manifest lockfile موقَّع GET /api/skills/consiliency-chrome-devtools-debugging/lockfile

اختبرها

جارٍ استخدام "chrome-devtools-debugging". اعثر على سبب ظهور صفحة فارغة في لوحة المعلومات بعد تسجيل الدخول.

النتيجة المتوقعة:

وجدت مراجعة وحدة التحكم استثناء في الواجهة الأمامية أثناء عرض لوحة المعلومات.
وجدت مراجعة الشبكة طلب جلسة فاشلا واحدا مع خطأ في التفويض.
الخطوة التالية الموصى بها: تحقق من معالجة تحديث الرمز دون كشف قيم الرموز.

جارٍ استخدام "chrome-devtools-debugging". تحقق مما إذا كانت صفحة المنتج بطيئة بسبب استدعاءات API.

النتيجة المتوقعة:

كانت أبطأ الطلبات هي استدعاءات البحث عن المنتجات وبيانات تعريف الصور.
أظهر تتبع المتصفح أن العرض انتظر استجابة البحث.
الخطوة التالية الموصى بها: تخزين بيانات التعريف مؤقتا وتأجيل أعمال الصور غير الحرجة.

جارٍ استخدام "chrome-devtools-debugging". راجع تحذيرات وحدة تحكم المتصفح الحالية قبل الإصدار.

النتيجة المتوقعة:

يسرد التقرير فئات التحذيرات، والصفحات المتأثرة، والأسباب المحتملة، والمالكين المقترحين دون نسخ بيانات المتصفح الحساسة.

التدقيق الأمني

مخاطر عالية

v10 • ١٣‏/٧‏/٢٠٢٦ فتح التقرير المرتبط بالإصدار

Most static findings are false positives caused by Markdown formatting, reserved example URLs, localhost endpoints, and a normal Python import. The guides expose authenticated browser data, enable remote debugging on logged-in sessions, and recommend an unpinned NPM package. Publication should require version pinning and clear browser isolation and secret-handling safeguards.

الملفات التي تم فحصها

1,033

الأسطر التي تم تحليلها

عناصر المراجعة

تم تجاهل الإيجابيات الكاذبة

مخاوف أمنية مؤكدة (2)

مرتفع

SKILL.md:110-130 cookbook/console-debugging.md:91-108 cookbook/network-debugging.md:90-130 reference.md:183-206

Authentication Secrets Printed in Debug Output

The guides direct users to print complete localStorage, sessionStorage, cookies, token values, and inspect authorization headers from authenticated sessions. This can expose credentials in terminal logs or model context.

Multiple explicit examples read and print browser authentication storage, cookies, tokens, or authorization data without redaction guidance.

متوسط

SKILL.md:29-46 SKILL.md:110-130

Authenticated Browser Exposed to Remote Debugging

The setup enables a DevTools endpoint and then operates on a logged-in browser session. Any process that can reach the endpoint can control tabs and inspect sensitive page data.

The documented workflow explicitly starts Chrome with remote debugging and uses the connection against an authenticated session.

عناصر مراجعة القدرات (1)

هذه قدرات محلية حقيقية قد يُتوقع وجودها لهذه المهارة، لذا فهي تتطلب مراجعة ولكن لا تُحتسب كسلوك خبيث مؤكد.

متوسط

SKILL.md:172-179

Ruby/shell backtick execution

- MCP server not installed (`npx chrome-devtools-mcp@latest`)

The troubleshooting guidance recommends npx chrome-devtools-mcp@latest, which can download and execute a mutable package version without integrity pinning.

عوامل الخطر

🌐 الوصول إلى الشبكة (16)

cookbook/console-debugging.md:200 cookbook/network-debugging.md:60 cookbook/network-debugging.md:149 cookbook/network-debugging.md:227 reference.md:102 reference.md:314 reference.md:80 reference.md:20 reference.md:222 reference.md:235 reference.md:275 reference.md:20 SKILL.md:144 SKILL.md:46 SKILL.md:180 SKILL.md:46

⚡ يحتوي على سكربتات (1)

reference.md:110-114

⚙️ الأوامر الخارجية (38)

دقّقه: codex عرض سجل التدقيق →

شارك واستشهد بهذا التقرير

شارك تقرير التقييم المرتبط بالإصدار والشارة المحايدة وبطاقة التضمين والاستشهادات. تعرض Skillstore الأدلة من دون أن تقرر ما إذا كانت هذه المهارة آمنة.

فتح التقرير المرتبط بالإصدار

نسخ رابط التقرير

https://skillstore.io/skills/consiliency-chrome-devtools-debugging/audits/10?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

شارة Markdown

[![Skillstore security assessment](https://skillstore.io/badges/skills/consiliency-chrome-devtools-debugging/security.svg)](https://skillstore.io/skills/consiliency-chrome-devtools-debugging?utm_source=security_passport_badge)

شارة HTML

<a href="https://skillstore.io/skills/consiliency-chrome-devtools-debugging?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/consiliency-chrome-devtools-debugging/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

بطاقة قابلة للتضمين

<iframe src="https://skillstore.io/embed/skills/consiliency-chrome-devtools-debugging.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

الاستشهادات الأكاديمية (APA · BibTeX · CFF)

اقتباس APA

Consiliency. (2026). chrome-devtools-debugging security audit report (audit version 10) [Author version unspecified]. Skillstore. https://skillstore.io/skills/consiliency-chrome-devtools-debugging/audits/10

اقتباس BibTeX

@techreport{consiliency-consiliency-chrome-devtools-debugging-2026,
  author = {Consiliency},
  title = {chrome-devtools-debugging security audit report (audit version 10)},
  institution = {Skillstore},
  year = {2026},
  number = {10},
  url = {https://skillstore.io/skills/consiliency-chrome-devtools-debugging/audits/10},
  note = {Author version unspecified}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "chrome-devtools-debugging security audit report (audit version 10)"
version: "unspecified"
type: report
authors:
  - name: "Consiliency"
date-released: "2026-07-13"
url: "https://skillstore.io/skills/consiliency-chrome-devtools-debugging/audits/10"
identifiers:
  - type: other
    value: "skillstore:consiliency-chrome-devtools-debugging:audit:10"
    description: "Skillstore immutable audit report identifier"

تقييم Skillstore

سبب هذا التقييم موثوقية الأدلة: متوسط

الهندسة المعمارية

قابلية الصيانة

المحتوى

المجتمع

الامتثال للمواصفات

ما الذي يمكنك بناؤه

تشخيص أعطال وحدة التحكم في الواجهة الأمامية

راجع أخطاء المتصفح، والتحذيرات، وتتبعات المكدس، وحالة التطبيق لتحديد عيوب الواجهة الأمامية المحتملة.

التحقيق في مشكلات API المصادق عليها

افحص طلبات XHR وfetch الفاشلة بعد تسجيل دخول يدوي مع حماية بيانات الجلسة الحساسة.

تحليل بطء تحميل الصفحات

التقط التتبعات، واعثر على الطلبات البطيئة، واربط مشكلات الأداء بأدلة الشبكة ووحدة التحكم.

جرّب هذه الموجّهات

فحص أخطاء وحدة التحكم

استخدم تصحيح الأخطاء عبر Chrome DevTools لعرض أخطاء وتحذيرات وحدة التحكم الحالية. لخص الأسباب المحتملة ولا تطبع الأسرار.

مراجعة استدعاءات API الفاشلة

اعرض طلبات XHR وfetch الفاشلة الأخيرة. صنفها حسب رمز الحالة، ونمط endpoint، والتأثير المحتمل على الواجهة الأمامية.

تصحيح أخطاء تدفق مصادق عليه

افحص الصفحة المصادق عليها بحثا عن أخطاء وحدة التحكم واستدعاءات API الفاشلة. نقح ملفات تعريف الارتباط، والرموز، ونصوص الطلبات قبل إعداد التقرير.

ربط أدلة الأداء

التقط تتبع تحميل الصفحة، وراجع طلبات الشبكة البطيئة، واربط أقوى الأدلة بخطوات تحسين ملموسة.

أفضل الممارسات

استخدم ملف تعريف متصفح اختبار مخصصا لجلسات تصحيح الأخطاء.
نقح الرموز، وملفات تعريف الارتباط، ونصوص الطلبات، والبيانات الشخصية قبل مشاركة المخرجات.
ابدأ بالملخصات، ثم اطلب تفاصيل الطلبات أو وحدة التحكم الكاملة عند الحاجة فقط.

تجنب

طباعة localStorage أو sessionStorage أو ملفات تعريف الارتباط أو رؤوس التفويض بالكامل.
ترك تصحيح أخطاء Chrome عن بعد متاحا بعد انتهاء الجلسة.
تشغيل حزم npx غير مثبتة الإصدار أو أوامر منسوخة دون مراجعة.

الأسئلة المتكررة

ما الذي تساعد هذه المهارة في تصحيح أخطائه؟

تساعد في فحص رسائل وحدة التحكم، وطلبات الشبكة، وتتبعات الأداء، وحالة المتصفح، وجلسات الويب المصادق عليها.

هل تحل محل أدوات أتمتة المتصفح؟

لا. إنها تركز على تصحيح الأخطاء عبر DevTools، وليس على لقطات الشاشة، أو تعبئة النماذج، أو سير عمل الأتمتة الواسعة.

هل يمكن أن تعمل مع الجلسات التي تم تسجيل الدخول إليها؟

نعم، إذا كان Chrome مسجلا دخوله بالفعل وتم تكوين وصول DevTools. يجب تنقيح البيانات الحساسة.

لماذا يعد تصحيح الأخطاء عن بعد مصدر قلق أمني؟

يمكن لنقطة نهاية DevTools فحص صفحات المتصفح والتحكم فيها. استخدم وصول loopback، وملف تعريف اختبار، وجلسات قصيرة.

ما الذي ينبغي للمستخدمين تجنب مشاركته؟

تجنب مشاركة ملفات تعريف الارتباط، والرموز، ورؤوس التفويض، والبيانات الشخصية، وتفريغات التخزين الكاملة، ونصوص الطلبات الخاصة.

ما أدوات AI المدعومة؟

يسرد التقرير دعما لـ Claude وCodex وClaude Code.

تفاصيل المطور

المؤلف

Consiliency

الترخيص

MIT

مراجعة Skillstore

تنبيه الإصدار

لم يعلن المؤلف عن إصدار.

المستودع

https://github.com/Consiliency/treesitter-chunker/tree/main/.ai-dev-kit/skills/chrome-devtools-debugging

مرجع

635f69fb8d2f4e6330ba47a4e5a0fb239c04d110

حداثة الصيانة

٢٣‏/٧‏/٢٠٢٦

الاستخدام

9 تنزيلات · 226 مشاهدات

بنية الملفات

📁 cookbook/

📄 console-debugging.md

📄 network-debugging.md

📄 reference.md

📄 SKILL.md

chrome-devtools-debugging

التثبيت باستخدام Agent لدي

موارد مهيّأة لـ Agents

اختبرها

التدقيق الأمني

مخاوف أمنية مؤكدة (2)

عوامل الخطر

نسخ رابط التقرير

شارة Markdown

شارة HTML

بطاقة قابلة للتضمين

اقتباس APA

اقتباس BibTeX

CITATION.cff

تقييم Skillstore

ما الذي يمكنك بناؤه

تشخيص أعطال وحدة التحكم في الواجهة الأمامية

التحقيق في مشكلات API المصادق عليها

تحليل بطء تحميل الصفحات

جرّب هذه الموجّهات

أفضل الممارسات

تجنب

الأسئلة المتكررة

تفاصيل المطور

المزيد من Consiliency

c4-modeling

docs-retrieval

standards-extraction

toon-format

multi-source-research

test-scaffolding

vue-best-practices

golang-performance

swiftui-expert-skill

senior-frontend

nextjs-architecture

nextjs-optimization

chrome-devtools-debugging

التثبيت باستخدام Agent لدي

موارد مهيّأة لـ Agents

اختبرها

التدقيق الأمني

مخاوف أمنية مؤكدة (2)

عوامل الخطر

نسخ رابط التقرير

شارة Markdown

شارة HTML

بطاقة قابلة للتضمين

اقتباس APA

اقتباس BibTeX

CITATION.cff

تقييم Skillstore

ما الذي يمكنك بناؤه

تشخيص أعطال وحدة التحكم في الواجهة الأمامية

التحقيق في مشكلات API المصادق عليها

تحليل بطء تحميل الصفحات

جرّب هذه الموجّهات

أفضل الممارسات

تجنب

الأسئلة المتكررة

تفاصيل المطور

المزيد من Consiliency

c4-modeling

docs-retrieval

standards-extraction

toon-format

multi-source-research

test-scaffolding

مهارات ذات صلة

vue-best-practices

golang-performance

swiftui-expert-skill

senior-frontend

nextjs-architecture

nextjs-optimization