تخطَّ إلى المحتوى

مصلّح توافق المتصفحات

تطوير واجهات الويب agent-skills filesystem MIT
⬇ تنزيل vsha-63a8068dbcc7

SHA-256: 63a8068dbcc7a9e32e7243817d567a8a1c167d20a314fcfdb34b9318c1ae50d3 3 كيلوبايت

✦ جاهزة لبيئة عملك

ثبّت هذه المهارة مباشرة داخل وكيلك

اختر الوكيل، انسخ الأمر، وشغّله من مجلد مشروعك. يتولى CLI تنزيل الحزمة والتحقق من بصمة SHA-256 ووضع الملفات في المسار المناسب.

$npx @ai-dalil/skills add browser-compat-fixer --agent codex

@ai-dalil/skills على npm - Node.js 18.18 أو أحدث.

الوصف

عربي

يشخّص فروقات سلوك المتصفحات ويصلحها: ميزات بدائل، تحويلات تدريجية، وقائمة دعم واقعية موثقة.

English

Diagnose and fix browser behavior differences: feature fallbacks, progressive enhancement, and a realistic support list.

بيانات المهارة التقنية

SKILL name
browser-compat-fixer
الوصف الأصلي
Diagnose and fix browser behavior differences: feature fallbacks, progressive enhancement, and a realistic support list.
إصدار المهارة
1.0.0
التوافق
وكيل يدعم Agent Skills · بيئة Node.js 18+ أو متصفح حديث للمعاينة
الأدوات المسموح بها
Read, Write
الكلمات المفتاحية
compatibility, css, frontend, debugging
لغة المصدر
multilingual
الفرع / المرجع
main
دليل الترخيص
Original editorial content authored for the AiDalil catalog and released under MIT by the catalog owner. (high)

بيانات المصدر الأصلية (YAML)

عرض Frontmatter الأصلي
name: browser-compat-fixer
description: Diagnose and fix browser behavior differences: feature fallbacks, progressive enhancement, and a realistic support list.
version: 1.0.0
metadata:
  author: AiDalil Editorial
  category: web-frontend
  compatibility: claude-code, droid, opencode, trae, cline, api
  difficulty: intermediate
  tags: [compatibility, css, frontend, debugging]

تعليمات SKILL.md

المحتوى الأصلي للمهارة كما ورد من المصدر، مع الحفاظ على تنسيق Markdown.

عرض التعليمات الكاملة
# Browser Compat Fixer

**Goal:** Diagnose and fix browser behavior differences: feature fallbacks, progressive enhancement, and a realistic support list.

> الهدف: يشخّص فروقات سلوك المتصفحات ويصلحها: ميزات بدائل، تحويلات تدريجية، وقائمة دعم واقعية موثقة.

## When to use
- الحالة النموذجية: يشخّص فروقات سلوك المتصفحات ويصلحها: ميزات بدائل، تحويلات تدريجية، وقائمة دعم واقعية موثقة.
- بناء واجهة جديدة من الصفر أو إعادة بناء واجهة قائمة.
- رفع جودة إتاحة الواجهة لذوي الهمم وفق معايير WCAG.
- تحسين سرعة تحميل الصفحات ومؤشرات الأداء الأساسية.
- إصلاح مشكلات التوافق بين المتصفحات والأجهزة.

## Workflow
1. افحص البنية الحالية للمشروع: نقاط الدخول، نظام التنسيق، وإدارة الحالة، ووثّق ما وجدته.
2. حدّد الهدف بدقة: مصلّح توافق المتصفحات. اكتب النتيجة المتوقعة في سطر واحد قبل أي كود.
3. تحقق من الإتاحة: تباين الألوان، التنقل بلوحة المفاتيح، وتسميات قارئ الشاشة.
4. أضف التفاعلات تدريجياً مع معالجة صريحة لحالات التحميل والفراغ والخطأ.
5. طبّق التنسيق بنظام المشروع المعتمد مع مبدأ الشاشات الصغيرة أولاً.
6. قِس الأداء قبل وبعد التغييرات واحتفظ بالأرقام في ملخص المهام.
7. قسّم الواجهة المطلوبة إلى مكوّنات صغيرة قابلة لإعادة الاستخدام مع تحديد مسؤولية كل مكوّن.
8. ابنِ الهيكل الدلالي أولاً بعناصر HTML صحيحة قبل إضافة أي تنسيق أو تفاعل.

## Rules
- لا تُخفِ الأخطاء؛ اعرض حالة خطأ واضحة ومفهومة للمستخدم.
- التغييرات المرئية تحتاج لقطة قبل/بعد في وصف المراجعة.
- لا تضف مكتبات جديدة قبل استبعاد إمكانية الحل بالأدوات الموجودة.
- حافظ على حجم الحزمة النهائية؛ كل كيلوبايت مبرر.
- أسماء المكوّنات تصف الوظيفة لا الشكل فقط.

## Output contract
- قائمة قرارات تقنية مع مبرر مختصر لكل قرار.
- ملاحظات إتاحة مع نتائج الفحوص اليدوية.
- لقطات شاشة للحالات الرئيسية: عادي، تحميل، فراغ، خطأ.
- ملخص تغيير يوضح المكوّنات المضافة والمعدّلة.

## Quality checks
- [ ] هل اختُبرت حالات التحميل والفراغ والخطأ للبيانات؟
- [ ] هل اجتازت العناصر التفاعلية التنقل الكامل بلوحة المفاتيح؟
- [ ] هل نسب التباين مطابقة للحد الأدنى 4.5:1 للنص العادي؟
- [ ] هل تعمل الواجهة على شاشة بعرض 360 بكسل دون كسر التخطيط؟
- [ ] هل أرقام الأداء بعد التغيير لم تتراجع عن خط الأساس؟

## Skill identity
- Skill name: `browser-compat-fixer`
- Version: 1.0.0
- Domain: Web Frontend Development (تطوير واجهات الويب)
- Tags: compatibility, css, frontend, debugging

التثبيت اليدوي

استخدم هذا المسار عند عدم استخدام CLI أو عند إدارة ملفات المهارات يدويًا.

  1. نزّل ملف ZIP للإصدار المطلوب من أعلى الصفحة، أو افتح المصدر الأصلي إذا لم تتوفر حزمة مستضافة.
  2. فك الضغط، ثم انقل مجلد المهارة الذي يحتوي مباشرة على SKILL.md إلى مجلد الوكيل.
  3. أعد تحميل الوكيل أو افتح جلسة جديدة، ثم تأكد من ظهور المهارة ضمن المهارات المتاحة.
Codex.agents/skills/browser-compat-fixer/
Claude Code.claude/skills/browser-compat-fixer/
Cursor.cursor/skills/browser-compat-fixer/

تعليمات خاصة بهذه المهارة

Extract the skill folder into your agent's skills directory (for example the project skills folder) or install the ZIP package from the skill page. No build step is required; everything is Markdown.

حالات الاستخدام

• تحسين سرعة تحميل الصفحات ومؤشرات الأداء الأساسية. • إصلاح مشكلات التوافق بين المتصفحات والأجهزة. • تحويل تصميم من ملف تصميم إلى كود أمامي دقيق.

المتطلبات

• Any Agent Skills compatible assistant (Claude Code, Claude Desktop, or API agents). • Basic file access to read the bundled reference playbook. • No external services required for the standard workflow.

الإصدارات

الإصدار الحجم الملفات تاريخ النشر تنزيل
vsha-63a8068dbcc7 3 كيلوبايت 2 4 نوفمبر، 2026 تحميل

الأمان والفحص

فحص أساسي ✓ — 1 نوفمبر، 2026