React-dnd: No funciona en Firefox

Sin embargo, React-dnd funciona en Firefox 55.0.2.

tampoco funciona en 56.0, no se producen errores. Simplemente no puedo hacer clic y arrastrar en absoluto. funciona bien en Chrome

¿Alguna idea sobre éste?
"react-dnd": "^ 2.5.4",
"react-dnd-html5-backend": "^ 2.5.4",

Firefox: 56.0
Muchas veces deja de funcionar. Especialmente si se abren muchas pestañas.

¿Alguien puede apuntar a un repositorio con un caso de muestra en el que react-dnd está fallando? Tengo una aplicación que usa mucho react-dnd pero no veo ningún problema en Firefox 56.

También asegúrese de especificar el sistema operativo que está utilizando, he visto que recientemente html5 Drag and Drop API tiene algunas inconsistencias en diferentes sistemas operativos

También he observado problemas con FF 56 en Linux (no lo probé en Windows ni OSX).

http://react-dnd.github.io/react-dnd/examples-sortable-simple.html

Intentando ese ejemplo simple, un elemento se moverá en la posición máxima 1 y luego ya no cambiará los elementos, si, por ejemplo, agarro el elemento inferior e intento moverlo hacia arriba.

También discutido en # 778

Para nuestro caso - DnD no funciona en FF, caso de ejemplo https://react-dnd.github.io/react-dnd/examples-drag-around-naive.html - Solucioné el problema con la solicitud de extracción que envié ayer . Quizás podría intentar informar si también resuelve su caso.

Todavía tengo problemas con FF 57.0.1 en Ubuntu 16.04. No puedo arrastrar y soltar en absoluto, parece que el evento de arrastre comienza pero se cancela inmediatamente después. Funciona bien en cromo.

También tengo problemas con FF y OSX 10.13.1

Editar: encontré otro problema similar a este (https://github.com/react-dnd/react-dnd/issues/778). Compruébelo para más detalles. También probé la versión beta de FF Nightly (https://nightly.mozilla.org/) y los errores desaparecieron. Tal vez este sea un problema de FF y no react-dnd.

@yankopetrov

Todavía estoy experimentando los problemas en Nightly, pero parece que se rompen mucho más en la aplicación que solo RDandD. Por lo tanto, no estoy seguro de que confíe en eso como una indicación de si FF es la causa real del error y si lo han solucionado.

@erwinverdonk , ¿podrías compartir tu solución? que fue el PR?
salud

@ Paddy-Hamilton sí con FF Nightly todavía aparecen algunos errores. Trabajar con Chrome y Safari como un encanto debería ser un problema de FF. Mi caso es exactamente el del problema de FF informado.

@ Paddy-Hamilton: Sí, veo que no se vinculó automáticamente aquí, así que aquí está el enlace a PR: https://github.com/react-dnd/react-dnd/pull/928

Entonces, ¿alguien sabe cuál es el problema?
Estoy usando FF 57.0.4 64bit en Ubuntu 17.04 y todavía no funciona. Incluso este ejemplo: http://react-dnd.github.io/react-dnd/examples-chessboard-tutorial-app.html

Hola, encontré algún tipo de solución que funcionó para mí. Mi arrastrar y soltar funcionó bien en Chrome pero no funcionó en FF en absoluto.
Entonces mi código antes:
render() { return ( isDragging ? null : <div className='myDraggableComponent'>...</div>)}
Y después:
render() { return <div className='myDraggableComponent' style={{ visibility: isDragging ? 'hidden' : 'visible' }}>...</div>)}

@dmitrystril @yankopetrov

El problema seguía siendo suyo para mí en FF Nightly, así que tuve que buscar alternativas, me encontré con react-beautiful-dnd y funciona como un encanto en FF, así como en todos los demás navegadores principales, y tiene menos marcado que react-dnd que es una ventaja.

El ejemplo de Ajedrez todavía no funciona en FF 59.0.2

El tutorial de ajedrez no funciona en Linux con FF 60.0:

1. Haga clic y mantenga presionado el caballero
2. Mover a un cuadrado válido (uno que se vuelve verde)
3. Mover a una casilla adyacente

Resultados esperados: el cuadrado se resalta en rojo
Resultados reales: el cuadrado verde permanece resaltado para siempre

Además: no importa en qué cuadrado esté mi cursor, soltar el mouse cancela el arrastre.

¿Estás en Linux @adamhooper? No puedo reproducir en OSX

Fedora 28

Esperaba que la instalación de la actualización 3.0.2 de hoy lo solucionara. Desafortunadamente, todavía está roto. Sin embargo, solo he probado en Linux. ¿Alguien ha probado el ejemplo en un sistema operativo diferente?

Las actualizaciones 3.x se han dirigido principalmente a mejorar los tipos. No tengo una máquina Linux, pero si alguien puede reproducir esto y cortar un PR, sería genial

Examinaré diferentes herramientas de prueba entre navegadores que podemos usar para detectar problemas como este. Los ejemplos existentes deberían ser una base bastante buena para las pruebas.

Puedo confirmar que solo he visto este problema en la versión Linux de Firefox. Funciona bien en Windows.

Si observa los ejemplos sortable simple no funciona, pero stress test funciona.
La diferencia es que stress test actualiza el estado dentro de requestAnimationFrame .

Usar requestAnimationFrame resuelve por mí.
Firefox para Linux.

Entendido, eso tiene sentido. así que probablemente tenga algo que ver con el tonto
settimeouts que estaban pensados ​​solo para Firefox. Si corto una rama con un
solución propuesta, ¿estaría dispuesto a vincularlo con npm y probarlo en Linux?

El martes 5 de junio de 2018 a las 5:10 a.m., Kyriakos Z. [email protected] escribió:

Si observa los ejemplos clasificables, lo simple no funciona, pero la prueba de esfuerzo
trabajos.
La diferencia es que la prueba de esfuerzo actualiza el estado dentro de un
requestAnimationFrame.

Usar requestAnimationFrame lo resuelve por mí.
Firefox en Linux.

-
Estás recibiendo esto porque comentaste.
Responda a este correo electrónico directamente, véalo en GitHub
https://github.com/react-dnd/react-dnd/issues/869#issuecomment-394685648 ,
o silenciar el hilo
https://github.com/notifications/unsubscribe-auth/AAG7iExIfA_El7IoR80oWgIvo87n2ABBks5t5nVFgaJpZM4PPxNf
.

@darthtrevino ¡ sí, por supuesto!

Me acabo de encontrar con un problema similar.
Aunque ya tenía las últimas versiones de Firefox y reaccioné dnd (en linux).

Lo que estaba causando mi problema era que mi controlador de arrastre (componente con ref={props.connectDragSource} ) estaba dentro de un <Link> del enrutador react.

No sé por qué estaba causando el problema, pero tan pronto como lo puse fuera de <Link> , todo funcionó bien.

Publicar aquí en caso de que ayude a alguien

Tengo el mismo problema en Firefox 60.8.0esr en Debian 10.

Actualizar el estado dentro de requestAnimationFrame corrige para Firefox, pero hace que el arrastre y Chrome sea lento y roto.

Este problema se ha marcado automáticamente como obsoleto porque no ha tenido actividad reciente. Se cerrará si no se produce más actividad. Gracias por sus aportaciones.

Por favor, no cierre esto. Todavía está roto en Firefox 60.9.0esr.

@SystemParadox ¿Qué sistema operativo estás usando?

Linux (Debian 10). Todavía no he tenido la oportunidad de probarlo en Windows, pero parece muy extraño que sea diferente.

Fedora 30
Todo funciona bien en Firefox 69.0.1
Roto en Firefox Nightly 70.0a1 (2019-08-21)

• Funciona en 68.10.0esr
• Funciona en 78.0.2

Si lo rompieron en 70.0a1, entonces parecería que esto sigue rompiendo por alguna razón, lo cual es un poco preocupante. Si vuelve a romperse, entonces realmente necesitamos crear un caso de prueba mínimo y enviar un ticket a los desarrolladores de Firefox.