BeaconCMS/beacon

Preserve scroll position

Ouverte

#123 ouverte le 31 janv. 2023

Voir sur GitHubGuide contributeur
 (3 commentaires) (1 réaction) (0 personne assignée)Elixir (120 forks)batch import
enhancementgood first issue

Métriques du dépôt

Stars
 (1 194 étoiles)
Métriques de merge PR
 (Aucune PR mergée en 30 j)

Description

This is a problem in LiveView but we can solve it on our own. Pages currently don't preserve scroll position. See:

https://user-images.githubusercontent.com/18524/215903473-99d47362-fac5-495d-b7ad-3071c45a5b61.mp4

I solved this a few years ago in ember-router-scroll: https://github.com/DockYard/ember-router-scroll/blob/master/addon/services/router-scroll.js

We'll need to pull in some JS resources to implement in Beacon. Two cases need to be accounted for:

  1. preserving scroll position when navigating to a new page then back to the original
  2. preserving scroll position when reloading a page (hard refresh also respects position)
  3. if opening a new tab to the same URL or navigating forward from A, to B, and pushing a new instance of A to the history stack it shouldn't inherit the scroll position of the original visit of A but if I go back in history it should

Guide contributeur

Direction de recherche
Examinez l'implémentation d'ember router scroll pour la logique de conservation de la position de défilement et adaptez la à la navigation Phoenix LiveView. Concentrez vous sur la gestion de la position de défilement lors de la navigation arrière/avant et du rechargement de la page.
Stack technique
elixirjavascript
Domaine
frontend
Type d'issue
Fonctionnalité
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
3
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
1-3 heures
Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.
Active
ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.
Claire
Prérequis
ElixirJavaScriptPhoenix LiveView
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
50