الخلاصة

  • اقترحت أول مسودة علنية لـ W3C في مايو 2012 حدوداً وظيفية بين الأشجار الفرعية في DOM. وركّزت مسودة 2014 على تركيب الأشجار، ثم سجّلت مذكرة 2018 انتقال المواد إلى مواصفات DOM وHTML وCSS Scoping وUI Events.
  • في DOM الحالي، يمكن إسناد أبناء العنصر الذين تقدمهم الصفحة إلى فتحات داخل شجرة الظل من دون تغيير آبائهم في شجرة العقد. وتحدد قواعد CSS منافذ مقصودة مثل :host و::slotted و::part.

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

وصفت أول مسودة عمل علنية لـ W3C بتاريخ 22 مايو 2012 حدوداً وظيفية بين أشجار فرعية داخل الوثيقة نفسها. يحتفظ المكوّن ببنيته الداخلية ويشارك في الصفحة. ثم وضعت مسودة 17 يونيو 2014 تركيب الأشجار المتعددة في قلب المسألة: أكثر من شجرة تسهم في مشهد واحد، وفق قواعد لقاء واضحة. تعكس هاتان الوثيقتان أسئلة التصميم في زمنهما.

بعد ذلك انتقلت القواعد إلى أكثر من موضع. تقول مذكرة فريق العمل الصادرة في 1 مارس 2018 إن مادة Shadow DOM كانت تُدرج في مواصفات DOM وHTML وCSS Scoping وUI Events. صار لكل جانب من جوانب الغرفة دفتر تعليمات داخل مواصفات المنصة الأوسع. تغيّر موضع النص المستقل، وبقيت مسألة الحدود والتركيب جزءاً من عمل المتصفح.

تشرح مواصفة DOM الحية لدى WHATWG أدوار الأطراف. عنصر في الصفحة يكون مضيفاً لجذر ظل، وتحته الشجرة الداخلية للمكوّن. ويمكن أن تضع الصفحة أبناء عاديين تحت العنصر المضيف، في شجرة المحتوى الخارجي. تحتوي شجرة الظل على فتحات تُسند إليها بعض تلك العقد. قد تظهر الصورة في أعلى البطاقة، لكنها تحتفظ بأبويتها الأصلية في شجرة عقد DOM. الفتحة تحدد مقعد الصورة في العرض المركب؛ إنها لا تنقل سجل ملكيتها.

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

أما جانب الأنماط فتفصّله مسودة المحررين CSS Shadow Module Level 1 لدى CSSWG. لا تعبر محددات الصفحة العادية حدود شجرة الظل لتطلي كل عناصرها الداخلية. يستطيع صانع المكوّن مع ذلك تقديم مقابض معلنة: :host للتعامل مع العنصر المضيف من داخل أنماط المكوّن، و::slotted لمحتوى أُسند إلى الفتحات ضمن نطاق محدد، و::part لعنصر داخلي يختار المكوّن تسميته كي تضبط الصفحة مظهره. من حق الضيف استعمال المقبض المعلن؛ ترتيب بقية الخزائن قرار صاحب الغرفة.

نص CSS المذكور مسودة محررين تشرح التصميم الجاري، بينما تثبت وثائق W3C تسلسل الأعوام 2012 و2014 و2018. ترسم المصادر الأصلية اتفاقاً عملياً: الصفحة تقدم المحتوى، والمكوّن يخصص أماكنه والأسطح المكشوفة للزوار، والمتصفح يجمع المشهد مع إبقاء أصل كل عقدة واضحاً.