Resizing the window during the tutorial leaves its demonstration session active as a real session

Abierto Apto para principiantes
  • ¿Algo no está bien?
#1,765 1 comentario 0 reacciones 0 asignados Ver en GitHub

Los mantenedores suelen responder en 3 días

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
2/5
Tiempo estimado
1-3 horas
Aptitud para principiantes
85/100
Tipo de issue
Error
Claridad
Bien especificado
Estado de actividad
Activo
Stack tecnológico
react, typescript
Área
frontend

Línea de trabajo

Empieza por apps/web/src/providers/WalkthroughProvider.tsx y las pruebas existentes del walkthrough en apps/web/src/providers/__tests__/WalkthroughProvider.test.tsx; sigue cómo se inicia la sesión de demostración y cómo un cambio de tamaño o el desmontaje cierra el walkthrough. Ejecuta las dos pruebas descritas y, después, verifica que cerrar el walkthrough por cualquiera de las dos vías no deje ninguna sesión de tutorial activa. El issue también menciona una nueva spec de extremo a extremo en testing/src/specs/walkthrough.spec.ts.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

Area: Web Bug Difficulty: Low Good First Issue Priority: Low

If the tutorial is dismissed by resizing the window, its demonstration session (subject 123, session 123) stays in the store as a real session in progress. At the "Session in Progress" step the walkthrough calls startSession(SESSION_DATA) to have something to point at, and only its close() handler calls endSession() to undo that. Resizing the window closes the walkthrough through a different path: a resize listener that only sets isWalkthroughOpen to false. Shrinking below the desktop breakpoint does the same, because WalkthroughProvider stops rendering the walkthrough. In both cases close() never runs. A first-time user who maximizes or snaps the browser window part-way through the tutorial is left with a "session in progress" for a subject that does not exist. "Start Session" is disabled, and "Accessible Instruments" opens instruments against session id 123, which the API cannot accept when the record is saved.

Where

apps/web/src/providers/WalkthroughProvider.tsx:68:

useEventListener('resize', () => setIsWalkthroughOpen(false), undefined, { once: true });

apps/web/src/providers/WalkthroughProvider.tsx:286-288 (the fake session) and :416-421 (the only cleanup):

onBeforeQuery() {
  startSession(SESSION_DATA);
},
// ...
const close = () => {
  endSession();
  removeSpotlight();
  setIndex(0);
  setIsWalkthroughOpen(false);
};

Reproduce

  1. Sign in with a browser window that is not maximized, accept the disclaimer, and let the tutorial open (or open it from the user menu → Tutorial).
  2. Click Next until the "Session in Progress" step.
  3. Resize or maximize the window.

Actual: the tutorial disappears, but the sidebar still shows a current session for subject 123. Start Session is disabled until the user ends that session by hand.
Expected: dismissing the tutorial by any route removes its demonstration session, as the close button does.

Tests

  • apps/web/src/providers/__tests__/WalkthroughProvider.test.tsx: it('should end the demonstration session when a resize closes the walkthrough'), plus it('should end the demonstration session when the walkthrough unmounts below the desktop breakpoint').
  • testing/src/specs/walkthrough.spec.ts (new): open the tutorial from the user menu, advance past "Session in Progress", resize the viewport, and assert no current session card is shown.

Suggested fix

Do the cleanup on unmount rather than only in close(): e.g. a useEffect(() => () => endSession(), []) in Walkthrough, guarded so it only ends the session when the current session is the tutorial's SESSION_DATA. Alternatively, have the resize listener call close().

Lenguaje dominante
TypeScript
Estrellas
119
Forks
19
Merge medio
6 d 16 min
PR fusionados (30 d)
34

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de DouglasNeuroInformatics/OpenDataCapture

Todos los issues de DouglasNeuroInformatics/OpenDataCapture

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.