El desplazamiento a la categoría actual está roto desde 2.8.0.beta5

En las versiones de Discourse anteriores a la 2.8.0.beta5, si editas un tema y haces clic en el menú desplegable de selección de categoría, la categoría actual está tanto seleccionada como desplazada hacia abajo en la lista de categorías, de modo que es inmediatamente visible en la parte superior, y sus subcategorías (si las hay) son visibles. El tema se puede mover fácilmente a una subcategoría más apropiada.

Funcionamiento en la 2.8.0.beta4 y anteriores:

A partir de la 2.8.0.beta5, la categoría actual ya no se desplaza al abrir el menú desplegable de selección de categoría:

Espero que estas breves demostraciones en video sean útiles para mostrar rápidamente lo que intento describir.

Nota: en mis ejemplos, tengo activadas las opciones “posiciones de categoría fijas” y “posiciones de categoría fijas al crear”, sin embargo, el comportamiento de desplazamiento a la actual falta con estas opciones activadas o desactivadas.

Confirmé esto en el desarrollo local instalando la 2.8.0.beta4 y observando el comportamiento deseado, y luego actualizando a la 2.8.0.beta5 y observando que el comportamiento ya no funcionaba.

Revisé el código hasta que encontré que el siguiente gran commit que involucra select-kit.js es donde tuvo lugar el cambio (espera un momento y debería saltar a las líneas de código en cuestión):

El siguiente código se eliminó del método _scrollToRow(), que es llamado por el método _scrollToCurrent():

if (rowContainer) {
  const collectionContainer = rowContainer.parentNode;

  collectionContainer.scrollTop =
    rowContainer.offsetTop - collectionContainer.offsetTop;
}

Confirmé que al volver a agregar este código a select-kit.js en la 2.8.0.beta5 se soluciona el problema, aunque como no está claro por qué se eliminó, no estoy seguro de otros posibles efectos secundarios de agregarlo de nuevo.

Gracias por revisar esto, y espero que podamos hacer que este comportamiento vuelva a funcionar en una futura versión.

4 Me gusta

Hola, gracias por esto :+1:

No recuerdo exactamente por qué hice esto, pero AFAICT ahora mismo, creo que esto también es un error.

Hice este PR:

Si puedes probar este código y decirme si crees que sería suficiente para ti, por favor.

Hola Joffrey, ¡gracias por revisar esto! Probé los últimos cambios, sin embargo, parece que no funcionaron. Como se ha fusionado, lo confirmé en la rama tests-passed.

De los dos commits en el PR, el primero funciona (ab0fbf1), pero es anulado por el segundo (92943ff).

El cambio en la línea 992 parece estar bien pero no tiene el efecto esperado. Parece necesitar el bloque de código que se eliminó y que ajusta el valor de collectionContainer.scrollTop.

¡Gracias de nuevo!

1 me gusta

Sí, no estaba seguro de si este comportamiento sería suficiente. Puedo volver a añadirlo mañana. ¿Podrías ser más preciso sobre qué es exactamente lo que no te gusta de este comportamiento ahora, por favor?

Hola Joffrey,

Gracias por seguir investigando esto. Con los cambios de código actuales (me he asegurado de descargar el último código, limpiar tmp y reiniciar el servidor de desarrollo), no ha recuperado el comportamiento que estaba presente en las versiones anteriores a la 2.8.0.beta5. Todavía no se desplaza para mostrar la categoría actual en la parte superior de las opciones visibles en el menú desplegable.

El comportamiento correcto/deseado es el que se muestra en el primer video de la publicación original, sin embargo, actualmente todavía funciona como en el segundo video. Actualmente, la barra de desplazamiento siempre comienza completamente en la parte superior, independientemente de dónde se encuentre la categoría actual en las opciones.

La línea rowContainer?.focus({ preventScroll }); parece no tener ningún efecto en este caso, independientemente de si preventScroll es true, false, o incluso si se elimina toda la línea.

La línea esencial que hace que el comportamiento funcione (no presente en la versión actual) es:

collectionContainer.scrollTop =
          rowContainer.offsetTop - collectionContainer.offsetTop;

Sin esto, no se desplaza a la posición correcta, ya que scrollTop es 0 por defecto. Después de que se ejecuta esta línea, scrollTop es igual al número correcto de píxeles que necesita desplazarse hacia abajo.

Espero que esto sea útil. Por favor, házmelo saber si puedo ayudar a aclarar más.

¡Gracias!

Sí, no está en la parte superior, pero está en la vista, lo que yo habría dicho que es suficiente.

Hola Joffrey:

Gracias por tus comentarios. Añadí más categorías a mi demostración y confirmé que la categoría actual aparece ahora en la vista, lo que sin duda es una mejora. Aún así, sería ideal que apareciera en la parte superior de la lista, como solía hacerlo. Esto garantizaría que más subcategorías debajo de ella fueran inmediatamente visibles y que el usuario pudiera hacer clic para cambiar a una subcategoría sin tener que desplazarse primero hacia abajo para revelarlas. En mi opinión, este es un caso de uso más sólido que revelar categorías adyacentes no relacionadas. ¿Se cambió para que estuviera centrado a propósito, o fue una regresión accidental del comportamiento anterior? En cualquier caso, tú decides, solo ofrezco mi opinión.

Gracias de nuevo y aprecio tu arduo trabajo en Discourse.