هل تريد طلب ميزة أو الإبلاغ عن خطأ ؟
أريد الإبلاغ عن خطأ.
ما هو السلوك الحالي؟
حاليًا عندما يتم تمرير مكون وظيفي صالح إلى TestUtils.renderIntoDocument ، فإنه يقوم بإرجاع قيمة خالية ولا يظهر أي خطأ.
تجريبي
تم إعادة إنتاج هذا السلوك في وضع الحماية: https://codesandbox.io/s/1zpvll4j24
تحقق من وحدة التحكم ، لمعرفة إخراج TestUtils.renderIntoDocument لمكونات العينة المعدة.
الحلول
الحل البديل الذي يرضي كلاً من SFC و FC هو تغليف المكون في الحاوية:
const FCCounter = () => {
const [count, setCount] = useState(0);
return (
<div>
<div>{count}</div>
<button onClick={() => setCount(count + 1)}>+1</button>
</div>
);
};
TestUtils.renderIntoDocument(
<div>
<FCCounter />
</div>
);
ما هو السلوك المتوقع؟
ما إصدارات React التي تأثرت بهذه المشكلة؟
إصدار رد الفعل: 16.8.6
لا تحتوي المكونات الوظيفية على أي instances
، فماذا تتوقع
TestUtils.renderIntoDocument(<FCCounter/>)
لكي ترجع؟
أيضًا ، على نطاق واسع ، هل يمكنك شرح ما تحاول القيام به؟ يمكنك استخدام forwardRef
/ useImperativeHandle
(https://reactjs.org/docs/hooks-reference.html#useimperativehandle) للوصول إلى "الأساليب" الداخلية ، لكنني أشعر بالفضول أنت تحاول الاختبار على الإطلاق.
بعد استدعاء TestUtils.renderIntoDocument
باستخدام المكون الكلاسيكي ، تم تمكيني تمامًا للوصول إلى state
، props
والتلاعب بالمكون باستخدام setState
. لذا ، ما كنت أتوقع أن يعيده TestUtils.renderIntoDocument
هو بعض العناصر التي تسمح لي باستخدام state
و props
و setState
.
أحاول اختبار المكونات التي يتم تنفيذها كمكونات وظيفية. الهدف الرئيسي هو تغيير حالة المكون والتحقق مما إذا كانت الحالة المتغيرة تتطابق مع الحالة التي يتوقعها الاختبار.
في حالة الاختبار لدي شرط مسبق ، يجب اختبار هذه المكونات كما هي ولا يجب تغييرها لاحتواء الكود المخصص لأغراض الاختبار. لذا ، فإن تغيير المكون نفسه لاستخدام forwardRef/useImperativeHandle
ليس خيارًا.
DeividasBakanas لا تحتوي مكونات دالة TestUtils.renderIntoDocument
(في حالة مكونات الفئة).
مثل trueadm المذكور ، لا نوصي باختبار تفاصيل تنفيذ المكون نفسه ، واستخدام الخاصيات / الأحداث لتشغيل التحديثات ، والقيام بالتأكيدات على ناتج المكون. يمكنني أن أوصي بمكتبات مثل مكتبة التفاعل والاختبار https://github.com/kentcdodds/react-testing-library لجعل هذا أسهل قليلاً. كينت يكتب على نطاق واسع حول هذا الموضوع ، أوصي به.
إغلاق هذه المشكلة لأنها مسألة استخدام أكثر من كونها طلب خطأ / ميزة.