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

منظمة WaSP لها هدف نبيل جدا وهو مساعدة شركات المتصفحات والعمل معهم على تطبيق المعايير القياسية، ولكن وبعد مرور حوالي 10 سنوات من تطبيق هذه الاختبارات، وطرح 3 نسخ منها، للأسف لم يتم تطبيق أحد أهم المعايير القياسية وهي كيفية ظهور عناصر Right-to-Left (RTL) في المستند.

ادعاءات Opera بأن متصفحها نجح وبتفوق في ACID2

ﻻ تزال النسخة الثابتة من متصفح Opera -وقد قلت الثابتة لأن هذه الثغرة قد تم اصلاحها في النسخة التجريبية والتي نجحت في اختبار ACID3- ضعيف في تطبيق معايير CSS وHTML القياسية بخصوص ظهور العناصر RTL، وقد اكتشفت هذه الثغرة منذ حوالي سبعة شهور تقريبا وقمت بالتبليغ عنها bug-290464@bugs.opera.com، ولكن وللأسف لم يجبني أحد، وربما أرادوا اصلاحها في الجيل القادم لا أدري، ولكن ولضعف امتحان ACID2 فإن هذا المتصفح يعتبر "قياسيا".

شرح مشكلة Opera

عندما يكون لديك مستند HTML وأردت أن يتم تطبيق خاصية RTL على كامل المستند عبر الوسم <html> بإضافة dir="rtl" إليه، ومن ثم تضيف عنصر إلى هذا المستند لنقل على سبيل المثال <ul> وأردت محاذاته إلى اليسار عن طريق خاصية CSS float:left ومن ثم إضافة هامش إلى اليسار عن طريق padding-left:40px لن يتحرك هذا العنصر كما يجب على حسب المعايير القياسية، وقد أرفقت صورة لما يجب أن يظهر بالصورة الصحيحة وما يظهر الآن في Opera.

الشيفرة المصدرية لهذا الخطأ:

PLAIN TEXT
HTML:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" dir="rtl" xml:lang="ar" lang="ar">
  3. <head profile="http://www.w3.org/2000/08/w3c-synd/#">
  4. <title>Opera Margin + Padding Bug</title>
  6. ul {
  7.     float: left;
  8.     padding-left: 40px;
  9.     list-style: circle;
  10. }
  11. </style>
  12. </head>
  15.     <li>aaa</li>
  16.     <li>bbb</li>
  17.     <li>ccc</li>
  18. </ul>
  19. </body>
  20. </html>

مشكلة RTL في Firefox

على العكس من Opera، فإن متصفح Firefox لم ينجح في اختبار ACID2، على الأقل في نسخ الجيل الثاني، ولكن يعتبر من المتصفحات الجيدة والمتوافقة نسبيا مع المعايير القياسية الأساسية، ولكن وللأسف يفشل في دعم العناصر RTL أيضا، وقد قمت بالتبليغ عنها، ولكن ردوا علي بأن هذه المشكلة مكررة وقد تم اصلاحها في نسخ الجيل الثالث من المتصفح، ولكن ليس أي من نسخ الجيل الثاني. وهذا أيضا يبعث إلى التحطيم. نظرا لأني قد بلغت عنها منذ حوالي 6 شهور تقريبا عندما اكتشفتها، وهناك من قد اكتشفها وبلغ عنها قبلي بسنة ونصف، أي أن هذه الثغرة موجودة في المتصفح منذ ظهوره، ولكن ما عسانا أن نعمل غير الصبر لحين صدور الجيل الثالث بشكل رسمي.

شرح مشكلة Firefox 2.x

أيضا عندما يكون لديك مستند HTML وأردت جعل العناصر المندرجة تحته RTL عن طريق الوسم <html dir="rtl"> وأردت إضافة عنصر كتلة Block element كمثال الفقرة <p> وأردت هذه الفقرة فقط أن تكون dir="ltr" أي عكس المستند، وللتوضيح جعلتها في برواز وعرضها 50%، المفروض أنها تبقى في مكانها، ولكن Firefox يذهب بها إلى اليسار، وقد أرفقت صورة توضيحية تظهر الشكل الصحيح على الجيل الثالث من Firefox والجيل الثاني.

الشيفرة المصدرية لهذا الخطأ:

PLAIN TEXT
HTML:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" dir="rtl" xml:lang="ar" lang="ar">
  4. <title>Firefox direction bug</title>
  6. h1,p {
  7.     width: 50%;
  8.     border: 1px solid #000000;
  9.     direction: ltr;
  10. }
  11. </style>
  12. </head>
  14. <h1>Test</h1>
  15. <p>This is a test paragraph.</p>
  16. </body>
  17. </html>

الخلاصة

قمت بمراسلة القائمين على اختبارات ACID وإلى WaSP منذ فترة ولم يصلني جواب إلى الآن، وﻻ زلت أحاول مراسلتهم بخصوص تطوير اختبار ACID3، ولكن وكما يقول المثل "اليد الواحدة ﻻ تصفق"، أتمنى من المطورين العرب المتابعة في مراسلتهم حتى يتم تطبيق بعض الاختبارات لقياس مدى تطبيق المعايير القياسية المتعلقة بظهور العناصر RTL لأنها تهمنا كعرب في تطوير صفحاتنا.

ملاحظة: لقد كتبت هذا المقال في مدونتي ولكن نظرا لأهميته أردت أن أنشره في أكثر من موقع لتوعية المطورين.