React-dnd: يظهر عنصر الشبح بشكل غير متسق للغاية في Chrome 50

بعد تحديث Chrome إلى 50 ، فإن معظم عناصر رد الفعل القابلة للسحب في تطبيقنا تواجه مشكلات في عنصر الشبح ، ولا يمكنني تحديد السبب الجذري (وليس لدي رابط عام لمدير تطبيقنا التي يمكنني إتاحتها). السلوك الأولي ، الذي كان يعمل جيدًا من قبل ، هو أن سحب عنصر أظهر عنصرًا شبحًا بينما كان العنصر المصدر مخفيًا.

هناك 6 مكونات مختلفة لتطبيقنا يمكن سحبها باستخدام رد الفعل-dnd. 2 منهم يعرضون أشباحًا على ما يرام ، 3 منهم لا يظهرون أي شبح على الإطلاق ، وواحد منهم بطريقة ما يعرض العنصر في العرض / الارتفاع الصحيح ولكن بدون محتوى وخلفية بيضاء.

فيما يلي قائمة بالأدلة التي وجدتها حتى الآن:

• تستخدم جميع المكونات عنصر مقبض سحب مع عنصر أصلي كمعاينة
• تضيف جميع المكونات (باستثناء المكون الذي يتحول إلى اللون الأبيض) عتامة مضمنة 0 إلى عنصر المعاينة إذا كانت monitor.isDragging () صحيحًا
• إذا قمت بإزالة العتامة الشرطية
• هذا غريب. بالنسبة إلى مكونين من المكونات ، فإن إضافة z- index: 1 إليهم يصلحها تمامًا. أستطيع أن أرى الشبح ومكون المصدر مخفي. بالنسبة للمكونين المعطلين الآخرين ، لم يؤد هذا إلى حل المشكلة. ولم يكن هناك سابقًا قاعدة z-index أو أي مشكلات في التراص على هذه المكونات.
• قادني ذلك إلى فكرة أنه قد يكون هناك بعض تركيبة CSS تدفع المتصفح إلى الاعتقاد بأن المكون المصدر غير مرئي عند بدء السحب ، وبالتالي لا يخلق الشبح. لقد حاولت إزالة / تغيير جميع أنواع قيم CSS رغم ذلك ولا شيء.
• كان هذا يعمل بالتأكيد قبل تحديث Chrome إلى 50.