Xullas reactda qilingan bir loyiha uchun tashqi virtual keyboard ulangan edi. Valuelar visual update bo'lishiga qaramasdan reactning o'zi bo'sh maydon sifatida ko'raverdi. Albatta bu soha odami bo'lmagan odam uchun (backend) nima bo'layotgani tushunarsiz bo'ldi. Nu bir necha soatlik asabbuzarliklardan so'ng oxiri aniq bo'ldiki react virtual dom degan tushunchaga ega ekan. Bunga ko'ra react o'zidagi domlarni alohida klon qilib eventlarni virtual shaklda boshqarar ekan.
Updatega yechim uchun esa input elementlar obyektidan valueni belgilash descriptori yordam berdi. Yana birortangiz reverse engineeringda shunaqa muammoga duch kelib qolmasligingiz uchun quyidagi kodni va muammoga yechimni ulashib qo'yyapman.
const el = document.querySelector("#root > div > input:nth-child(4)");
const desc = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value").set;
desc.call(el, "Hi!");
el.dispatchEvent(new Event('input', { bubbles: true }));
Updatega yechim uchun esa input elementlar obyektidan valueni belgilash descriptori yordam berdi. Yana birortangiz reverse engineeringda shunaqa muammoga duch kelib qolmasligingiz uchun quyidagi kodni va muammoga yechimni ulashib qo'yyapman.
const el = document.querySelector("#root > div > input:nth-child(4)");
const desc = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value").set;
desc.call(el, "Hi!");
el.dispatchEvent(new Event('input', { bubbles: true }));