React-dnd: प्रतिक्रिया डीएनडी क्रोम 59 पर काम नहीं कर रहा है

मामला नहीं; यह काम बिल्कुल ठीक है। बिना किसी एक्सटेंशन के Chrome चलाने का प्रयास करें

@theTechie क्या आपने विंडोज़ पर मैक पर चेक किया था? मैक पर यह सामान्य रूप से काम कर रहा है।

मैंने मैक पर चेक किया। क्या यह एक विशिष्ट मंच के साथ एक समस्या है?

@theTechie किसी कारण से, प्रतिक्रिया-डीएनडी सामान्य रूप से 'ड्रैजेंड' को ट्रिगर नहीं करता है। मैंने युगल मशीन पर परीक्षण किया, एक मैक में एक ही समस्या है, सभी विंडोज़ में यह समस्या है। कोई सोच?

मैंने क्रोम पर विंडोज 8.1/विंडोज 7 और आईई 10 और आईई 11 पर कई प्लेटफॉर्म पर परीक्षण किया। यह मेरे लिए ठीक काम करता है।

@hunterbmt - क्या आपको कंसोल में कोई त्रुटि दिखाई देती है? क्या आप किसी संदर्भ के लिए GIF साझा कर सकते हैं?

@theTechie मैंने प्रतिक्रिया dnd की उदाहरण साइट पर परीक्षण किया, कोई समस्या नहीं थी। लेकिन हमारे आवेदन में, क्रोम 59 ने कुछ परिदृश्यों में 'ड्रैजेंड' को ट्रिगर नहीं किया जो क्रोम 58, एफएफ, सफारी और यहां तक ​​​​कि आईई पर पूरी तरह से सामान्य काम करता है।
मैंने 'ड्रॉप' के बाद मैन्युअल रूप से 'ड्रैजेंड' को ट्रिगर करके तय किया है यदि ब्राउज़र थोड़ी देर के बाद इसे ट्रिगर नहीं करता है।
मुझे नहीं पता कि क्या अन्य लोग भी इस मुद्दे में विफल होते हैं, अगर ऐसा है, तो मैं फिक्स को प्रतिक्रिया-डीएनडी में स्थानांतरित कर सकता हूं।

क्रोम 59 के चेंजलॉग को देखते हुए लेकिन कुछ भी नहीं मिला, अगर आपके पास कोई अंतर्दृष्टि है, तो मैं इनपुट की बहुत सराहना करूंगा।

@hunterbmt मुझे लगता है कि यह आपके कोड के लिए कुछ अनोखा हो सकता है; यहां तक ​​​​कि मैंने कई उदाहरणों में प्रतिक्रिया-डीएनडी का उपयोग किया है और वे सभी क्रोम 59 पर ठीक काम करते हैं।

दुर्भाग्य से, मैं आपको यह नहीं बता सकता कि ऐसा क्यों हो रहा है। हो सकता है, अगर आप यहां अपना कोड साझा कर रहे हैं तो मैं कुछ कोशिश कर सकता हूं और ढूंढ सकता हूं।

मुझे विंडोज़ पर क्रोम 59.0.3071.86 में भी यही समस्या है। यह फ़ायरफ़ॉक्स में ठीक काम करता है, और पुराने क्रोम संस्करणों में ठीक काम करता है। पैकेज.जेसन:

{
  "dependencies": {
    "react-dnd": "2.1.4",
    "react-dnd-html5-backend": "2.1.2",
  }
}

परिणाम 2.4.0/2.4.1 . के साथ समान है

इस हैक के साथ हल:

const ModifiedBackend = (...args) => {
    const instance = new HTML5Backend(...args);

    // Fix Chrome 59 not sending a DragEnd after Drop, which other browsers do and react-dnd expects
    const originalTopDrop = instance.handleTopDrop;
    const originalTopDragEndCapture = instance.handleTopDragEndCapture;
    let dragEndTimeout;
    instance.handleTopDrop = (e, ...args) => {
        dragEndTimeout = setTimeout(() => {
            originalTopDragEndCapture(e, ...args);
        }, 0);
        originalTopDrop(e, ...args);
    };
    instance.handleTopDragEndCapture = (e, ...args) => {
        clearTimeout(dragEndTimeout);
        originalTopDragEndCapture(e, ...args);
    };

    return instance;
};

// Decorate root elements with this
export default DragDropContext(ModifiedBackend);

@awestroke मैं काफी समान हैक के साथ समाप्त

@hunterbmt मुझे बिना रुके क्षेत्रों में गिरने से कोई समस्या नहीं है। मैंने जाँच नहीं की है कि कौन सी घटनाएँ ट्रिगर होती हैं, लेकिन प्रतिक्रिया-डीएनडी दूषित स्थिति में प्रवेश नहीं करता है, इसलिए सब कुछ ठीक से काम करता प्रतीत होता है।

मैंने एंडड्रैग को ट्रिगर करने की स्थिति को सरल बनाकर इस समस्या और संभावित मुद्दों को ठीक करने के लिए एक पीआर बनाया है
https://github.com/react-dnd/react-dnd/pull/801

मुझे एक ही समस्या है, हालांकि हर बार नहीं, बस कुछ मामलों में, और उदाहरण के लिए वह मामला है:
मेरे पास एक विजेट है जिसे ड्रॉप क्षेत्र के अंदर छोड़ा जा सकता है, और जब विजेट गिरा दिया जाता है तो वह ड्रॉप क्षेत्र कुछ HTML प्रस्तुत करेगा। अगर मैं वीडियो विजेट छोड़ना चुनता हूं तो यह iframe प्रस्तुत करेगा और यह टूट जाता है और मैं उसके बाद किसी भी अन्य विजेट को नहीं खींच सकता ( dragend ईवेंट को निकाल दिया नहीं जाता है)। लेकिन अगर मैं उस iframe को कुछ टेक्स्ट या इमेज से बदल देता हूं, तो यह पूरी तरह से ठीक काम करता है, और यह क्रोम 59 से पहले काम कर रहा था, और यह किसी भी अन्य ब्राउज़र में काम करता है, मैं इसका पता नहीं लगा सकता, क्या इसमें समस्या है क्रोम या प्रतिक्रिया-डीएनडी?

@rogyvoje मेरा मानना ​​​​है कि क्रोम ने 'ड्रैजेंड' के लिए ट्रिगर होने वाली घटना में कुछ बदल दिया है। अधिक जानकारी के लिए खोज करने की कोशिश की लेकिन मैं उन्हें कहीं भी इसका उल्लेख नहीं देखता।
बीटीडब्ल्यू, 'ड्रैगस्टार्ट' के बाद 'माउसमोव' के आधार पर अधिक समझ और सरल बना देता है कि ज्यादातर मामलों में 'ड्रैजेंड' और कुछ मामलों में 'माउसमोव' (डीओएम से हटाए गए तत्व को खींचकर) मेरे पीआर के रूप में।

@hunterbmt रहस्योद्घाटन करने के लिए धन्यवाद
लेकिन मैं एनपीएम/यार्न के माध्यम से आपके पुल अनुरोध का उपयोग कैसे कर सकता हूं? क्योंकि ऐसा लगता है कि यह विलय नहीं हुआ है, या मैं गलत हूँ? मैं

@rogyvoje मुझे लगता है कि आप संस्करण के बजाय सीधे मेरी शाखा को इंगित कर सकते हैं। पीआर विलय कर दिया गया था लेकिन प्रतिक्रिया-डीएनडी अभी तक नया संस्करण जारी नहीं किया गया है, इसलिए आप इसे सीधे प्रतिक्रिया-डीएनडी एनपीएम/यार्न से प्राप्त नहीं कर सकते हैं।

@hunterbmt
मैंने इसे इस तरह करने की कोशिश की:

npm install git+https://github.com/react-dnd/react-dnd.git#41eb8caa0bc106c9edf0d3ca628b49e70525090b

लेकिन लॉगिन स्क्रीन हमेशा पॉप अप होती है

क्या इस धागे में कोई भी समस्या का पुनरुत्पादित मामला प्रदान कर सकता है? मैं react-dnd का बहुत उपयोग कर रहा हूं लेकिन मैं क्रोम 59 पर किसी भी मुद्दे की पहचान नहीं कर सकता, इसलिए मुझे एक पुनरुत्पादित मामला रखने में बहुत दिलचस्पी है जहां react-dnd विफल हो जाता है क्योंकि क्रोम 59 drag/drop को सक्रिय नहीं करता है

मुझे लगता है कि अगर कोई समस्या है, तो इसे आप में से कुछ लोगों द्वारा बहुत आसानी से पुन: उत्पन्न किया जाना चाहिए, जिन्होंने पहली बार समस्या देखी है, इसलिए कृपया एक प्रतिलिपि प्रस्तुत करने योग्य मामला पोस्ट करने के लिए समय निकालने का प्रयास करें (यह एक जीथब रेपो या कोड पोस्ट किया जा सकता है यहां https://codesandbox.io/) और कोई भी सार्थक जानकारी (जैसे OS, प्रतिक्रिया-dnd का संस्करण, आदि) प्रदान करने का प्रयास करें। धन्यवाद!

@bjrmatos यहाँ, मैंने एक बनाया, यह मेरा मामला है और मुझे आशा है कि इससे मदद मिलेगी!

https://github.com/rogyvoje/react-dnd-chrome-59

क्रोम 59 पर और वर्तमान अपडेट पर इसका परीक्षण किया:
संस्करण 60.0.3112.78 (आधिकारिक बिल्ड) (64-बिट)

विंडोज़ जानकारी के लिए:
ओएस का नाम: माइक्रोसॉफ्ट विंडोज 10 प्रो
ओएस संस्करण: 10.0.14393 एन/ए बिल्ड 14393

क्रोम पर परीक्षण किया गया: संस्करण 55.0.2883.87 (64-बिट) (लिनक्स/मिंट 18 पर) और पूरी तरह से काम करता है ...

@rogyvoje धन्यवाद ! मैं बाद में देखूंगा, देखते हैं कि क्या मैं अपने विंडोज 7 वीएम में समस्या देख सकता हूं, अन्यथा मैं विंडोज़ 10 के साथ एक और वीएम की कोशिश करूंगा। धन्यवाद!

हाय @rogyvoje मैंने नवीनतम क्रोम रिलीज में सीधे आपके भंडार की कोशिश की है क्योंकि आपने कहा था कि आपको वही समस्या थी (संस्करण 60.0.3112.78 (आधिकारिक बिल्ड) (64-बिट) - विंडोज 10 प्रो) लेकिन मुझे नहीं दिख रहा है कोई त्रुटि।

यह अपेक्षित परिणाम है, है ना?

क्या आपकी समस्या को पुन: उत्पन्न करने के लिए कोई/अधिक अन्य कदम हैं?

मैंने [email protected] ( yarn का उपयोग करने के बजाय) के साथ निर्भरताएं स्थापित की हैं और यहां केवल रिकॉर्ड के लिए निर्भरता के सटीक संस्करण स्थापित हैं:

नोट: मैं विंडोज़ 10 प्रो वीएम का उपयोग कर रहा हूं (क्योंकि मेरा मुख्य ओएस ओएसएक्स एल कैपिटन है, जिसमें क्रोम के साथ समस्या मौजूद नहीं है)

और मेरे सभी क्रोम एक्सटेंशन अक्षम के साथ एक ही परिणाम:

@rogyvoje मैंने अभी आपकी पिछली टिप्पणियां पढ़ी हैं और अब मैं समस्या को पुन: उत्पन्न कर सकता हूं, जैसा कि आप कहते हैं कि पहला ड्रैग काम करता है, लेकिन अगर कोई दूसरी बार खींचने का प्रयास करता है तो Cannot call hover after drop त्रुटि दिखाई देती है।

भंडार के लिए धन्यवाद, मैं समस्या में गोता लगाने और एक समाधान की तलाश करने की कोशिश करूंगा जो सभी को खुश करे।

ऐसा लगता है कि बग की पुष्टि हो गई है: https://bugs.chromium.org/p/chromium/issues/detail?id=737691&q=dragend&colspec=ID%20Pri%20M%20Stars%20ReleaseBlock%20Component%20Status%20Owner%20Summary%20OS %20संशोधित

https://stackoverflow.com/questions/44764343/dragend-event-not-firing-in-chrome-when-an-iframe-is-moved-in-drop-function

रिकॉर्ड के लिए मैं क्रोम (60) मैक ओएस (एल कैपिटन) में भी उसी उदाहरण के साथ त्रुटि को पुन: उत्पन्न कर सकता हूं (इस बारे में निश्चित नहीं है कि यह मैक के लिए क्रोम 59 में भी मौजूद था), इसलिए क्रोम का उपयोग करते समय यह हर जगह विफल हो रहा है (> =59) और iframes का उपयोग करते समय

@bjrmatos बढ़िया, खुशी है कि आपने इसे सफलतापूर्वक पुन: पेश किया 😄
अभी सुनिश्चित नहीं हैं कि आगे क्या होने वाला है, क्या हमें Chrome 61 की प्रतीक्षा करनी चाहिए? मैं

अभी सुनिश्चित नहीं हैं कि आगे क्या होने वाला है, क्या हमें Chrome 61 की प्रतीक्षा करनी चाहिए?

हो सकता है, वैसे भी मैं एक अच्छा पैच खोजने की कोशिश कर रहा हूं जो क्रोम 59, 60 में प्रतिक्रिया-डीएनडी काम करता है, इसलिए मैं यहां और अपडेट बाद में पोस्ट करूंगा

मुझे लगता है कि यह समस्या हल करता है। https://github.com/react-dnd/react-dnd/pull/820
यह पहले ही विलय हो चुका है, लेकिन जारी नहीं किया गया है।

इस मुद्दे के बारे में कोई खबर?
मुझे अभी भी नवीनतम क्रोम में समस्याएं आ रही हैं ...

@ ms88privat #820 अपवाद को हल करता है, लेकिन प्रारंभिक समस्या नहीं है कि क्रोम पर (मैं 67 का उपयोग कर रहा हूं) source.endDrag को कभी भी आईफ्रेम प्रस्तुत होने पर कॉल नहीं किया जाता है।

3.0 से पहले हमने @0rvar द्वारा प्रदान किए गए वर्कअराउंड का उपयोग किया था, लेकिन सख्त TS टाइपिंग के साथ इंस्टेंस विधियों या निजी वर्ग विधियों को ओवरराइड करना संभव नहीं है।

आप @rogyvoje के टेस्ट रेपो में एंडड्रैग को Video.js में जोड़कर इसे पुन: पेश कर सकते हैं

const source = {
    beginDrag(props) {
        return {
            renderVideo: true
        };
    },
    // Add end drag
    endDrag(props, monitor) {
        if (!monitor) return;
        // Only gets called when the iframe is already rendered
        console.log("endDrag");
    }
};

पहली बार जब आप इसे खींचते हैं, तो क्रोम के लिए endDrag को कॉल नहीं किया जाता है।

यह तब भी जम जाता है जब आप क्रोम के अंदर पेज में iframe में शामिल करते हैं (59 से वर्तमान तक) @0rvar का फिक्स इस मामले में भी काम करता है

यह अब क्रोम 72 में तय है, जिसे कल जारी किया गया था।

इस समस्या को स्वचालित रूप से पुराने के रूप में चिह्नित कर दिया गया है क्योंकि इसमें हाल की गतिविधि नहीं है। आगे कोई गतिविधि नहीं होने पर इसे बंद कर दिया जाएगा। आपके योगदानों के लिए धन्यवाद।