React-dnd: फ़ायरफ़ॉक्स खोने की घटनाओं के साथ मुद्दा

को निर्मित 5 अप्रैल 2018 · 7टिप्पणियाँ · स्रोत: react-dnd/react-dnd

मुझे एक बहुत बुरा बग मिला है जो संभवतः फ़ायरफ़ॉक्स में ही एक मुद्दे को ट्रिप करता हुआ प्रतीत होता है। मैं इस त्रुटि को शतरंज ट्यूटोरियल उदाहरण पर भी पुन: पेश कर सकता हूं। मूल रूप से, आप उस स्थिति में पहुंच सकते हैं जहां फ़ायरफ़ॉक्स ड्रैगस्टार्ट को छोड़कर किसी भी माउस ईवेंट को भेजने के लिए प्रकट नहीं होता है।

प्रजनन

ड्रैग सोर्स पर क्लिक करें और उसे ड्रैग करना शुरू करें, पूर्वावलोकन दिखाई देने से पहले माउस को छोड़ दें। ट्यूटोरियल उदाहरण में, आप इसे एक बार करने के बाद, ड्रॉप लक्ष्य हाइलाइट रहेंगे। आपको कभी-कभी पूर्ण बग को ट्रिगर करने के लिए तुरंत इसे फिर से करना होगा।

यह धीमा पृष्ठों पर पूरा करने के लिए बहुत आसान है जहां पूर्वावलोकन दिखाई देने में कुछ समय लेता है। मेरे पास एक पृष्ठ है जो बहुत धीमा है, और मैं ड्रैग जारी करने के बाद कभी-कभी एक क्लिक पर भी इसे जारी कर पुन: पेश कर सकता हूं।

लक्षण

एक बार जब आप बग को चालू कर देते हैं, तो फ़ायरफ़ॉक्स ड्रैगस्टार्ट के अलावा ड्रैग इवेंट्स को लगभग हर टैब पर भेजना बंद कर देता है। कभी-कभी मैं इस पर एक पृष्ठ wth प्रतिक्रिया-dnd में समस्या का कारण बन सकता हूं, और फिर मेरे सभी अन्य टैब समान लक्षण प्रदर्शित करना शुरू करते हैं।

इस टूटी-फूटी स्थिति से खुद को बाहर निकालने के लिए केवल दो तरीके हैं। सबसे पहले, आप ब्राउज़र को बंद और फिर से खोल सकते हैं। दूसरा, आप एक पृष्ठ पर एक ड्रैग आरंभ कर सकते हैं जहां प्रतिक्रिया-डंड अभी भी काम कर रहा है। एक बार जब आप ऐसा कर लेते हैं, तो पृष्ठ जिसके कारण विराम होता है उसे एक ड्रैगेंड ईवेंट प्राप्त होगा। इसलिए:

टैब 1 एक क्लिकस्टार्ट देखता है
टैब 1 क्लिकस्टार्ट के अलावा और कोई घटना नहीं देखता है
टैब 2 खोलें और खींचना शुरू करें
टैब 1 एक क्लिकेंड देखता है और अब फिर से काम कर रहा है

यहाँ एक वीडियो दिखाया गया है जिसमें दो टैब का उपयोग करके https://react-dnd.github.io/react-dnd/examples-chessboard-tutorial-app.html दिखाया गया है

ReactDnDFirefoxBug.zip

मैं फ़ायरफ़ॉक्स 59.0.2 (64-बिट) के साथ macOS हाई सिएरा 10.13.3 (17D102) पर हूं। यह किसी भी संस्करण> = 57 पर होता प्रतीत होता है। मैंने रिएक्शन-डीएंड 2.6.0 और 2.5.4 के साथ त्रुटि को पुन: पेश किया है।

मुझे यह तय करने के लिए किसी भी परीक्षण या डिबगिंग के साथ मदद करने में खुशी होगी या यदि फ़ायरफ़ॉक्स में समस्या है तो वर्कअराउंड के साथ आएं।

browser bug bug wontfix

स्रोत

jsteel

👍10

सबसे उपयोगी टिप्पणी

यहां मोजिला के साथ टिकट खोला गया: https://bugzilla.mozilla.org/show_bug.cgi?id=1452522

jsteel 6 अप्रैल 2018

👍3

सभी 7 टिप्पणियाँ

मैंने बग को ट्रिगर करने का एक बेहतर तरीका ढूंढ लिया है जो रिएक्शन-डैंड का भी उपयोग नहीं करता है।

एक बार जब आप पृष्ठ को तोड़ चुके होते हैं, तो मुझे इसे ठीक करने का एकमात्र तरीका है कि आप शतरंज के टुकड़े को रिएक्शन-डीएंड उदाहरण पर ले जाएं, या फ़ायरफ़ॉक्स को पुनः आरंभ करें। मुझे यकीन नहीं है कि प्रतिक्रिया-dnd उदाहरण इसे अस्थिर करने के लिए क्या कर रहा है, या इसके लिए वर्कअराउंड कैसे बनाया जाए।

<html>
<head>
</head>
<body>
<p>
  Click and drag the draggable item for longer than 1 second to see it dragging.
  Click, drag, and release within 1 second to cause the error.
</p>

<div class="dropzone">
  <div id="draggable" draggable="true" ondragstart="event.dataTransfer.setData('text/plain',null)">
    This div is draggable
  </div>
</div>
<div class="dropzone"></div>
<div class="dropzone"></div>
<div class="dropzone"></div>

<style>
  #draggable {
    width: 200px;
    height: 20px;
    text-align: center;
    background: white;
  }

  .dropzone {
    width: 200px;
    height: 20px;
    background: blueviolet;
    margin-bottom: 10px;
    padding: 10px;
  }
</style>

<script>
  var dragged;

  /* events fired on the draggable target */
  document.addEventListener("drag", function( event ) {
    console.log('drag')
  }, false);

  function sleep(ms){
      var waitTimeInMilliseconds = new Date().getTime() + ms;
      while(new Date().getTime() < waitTimeInMilliseconds ) true;
  }

  document.addEventListener("dragstart", function( event ) {
      // store a ref. on the dragged elem
      dragged = event.target;
      // make it half transparent
      event.target.style.opacity = .5;

      sleep(1000);

      // You can use this approach instead of the sleep. The image is quite
      // large so it's easy to release the mouse before the image is loaded
      // var img = new Image();
      // img.src = 'http://awakeningthegoddesswithin.net/wp/wp-content/uploads/2015/06/moon.jpg';
      // event.dataTransfer.setDragImage(img, 10, 10);
  }, false);

  document.addEventListener("dragend", function( event ) {
    console.log("dragend")
      // reset the transparency
      event.target.style.opacity = "";
  }, false);

  /* events fired on the drop targets */
  document.addEventListener("dragover", function( event ) {
      console.log("dragover")
      // prevent default to allow drop
      event.preventDefault();
  }, false);

  document.addEventListener("dragenter", function( event ) {
      console.log("dragenter")
      // highlight potential drop target when the draggable element enters it
      if ( event.target.className == "dropzone" ) {
          event.target.style.background = "purple";
      }

  }, false);

  document.addEventListener("dragleave", function( event ) {
      console.log("dragleave")
      // reset background of potential drop target when the draggable element leaves it
      if ( event.target.className == "dropzone" ) {
          event.target.style.background = "";
      }

  }, false);

  document.addEventListener("drop", function( event ) {
      console.log("drop")
      // prevent default action (open as link for some elements)
      event.preventDefault();
      // move dragged elem to the selected drop target
      if ( event.target.className == "dropzone" ) {
          event.target.style.background = "";
          dragged.parentNode.removeChild( dragged );
          event.target.appendChild( dragged );
      }
  }, false);
</script>
</body>

jsteel 6 अप्रैल 2018

यहां मोजिला के साथ टिकट खोला गया: https://bugzilla.mozilla.org/show_bug.cgi?id=1452522

jsteel 6 अप्रैल 2018

👍3

मैं इसकी पुष्टि कर सकता हूं :(

deepj 10 अप्रैल 2018

👍1

की पुष्टि की

darthtrevino 19 अप्रैल 2018

👍1

फ़ायरफ़ॉक्स के लिए एक फिक्स किया गया है और फ़ायरफ़ॉक्स 63 (2018-10-23 पर नियोजित रिलीज़) के साथ जारी किया जाना चाहिए

renchap 3 अग॰ 2018

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

stale[bot] 6 जुल॰ 2019

यह अभी भी फेडोरा 30 और विंडोज 10 (फ़ायरफ़ॉक्स 69) के तहत मेरे लिए हो रहा है। मैंने इस जानकारी को फ़ायरफ़ॉक्स टिकट में भी जोड़ा है। चूंकि खदान पढ़ने से पहले टिकट पर अंतिम टिप्पणी:

मुद्दा यह प्रतीत होता है कि केवल तभी हो रहा है जब "मुख्य सूत्र में" का अनुरोध किया गया है।
जब अनुरोध में Redrawing को लपेटता है।

क्या पुस्तकालय में बग के आसपास काम करने के लिए हम कुछ कर सकते हैं?

संपादित करें 09/19/2019:
लगता है कि इस बग को फिर से शुरू करने के लिए फ़ायरफ़ॉक्स 69 में एक प्रतिगमन है, मैंने उनके साथ एक नया टिकट दर्ज किया है: https://bugzilla.mozilla.org/show_bug.cgi?id=1582401

saltenhub 18 सित॰ 2019

👍2

क्या यह पृष्ठ उपयोगी था?

0 / 5 - 0 रेटिंग्स

React-dnd: फ़ायरफ़ॉक्स खोने की घटनाओं के साथ मुद्दा

प्रजनन

लक्षण

सबसे उपयोगी टिप्पणी

सभी 7 टिप्पणियाँ

संबंधित मुद्दों