reactjs / reactjs/react.dev

Mobile in-app browser navigation glitching

Ouverte
#656 0 commentaires 0 réactions 0 personnes assignées Voir sur GitHub

Personne n'a encore pris cette issue.

Langage dominant
JavaScript
Étoiles
11.8k
Forks
7.9k
Merge moyen
1 j 11 h
PR mergées (30 j)
11

Description

Opened up an article inside the Reddit in-app browser and noticed some funky glitching in the navigation.

Issue
On open, the nav starts half-scrolled, and then on scroll you can see the bottom of the text going behind the navigation.

On mobile Chrome, Safari, and Firefox, the same thing happens- where if the user scrolls inside the nav, the content behind it scrolls- you just can't see it in these browsers due to correct screen positioning of the nav. The in-app browser seems to force the nav to have some kind of margin at the bottom.

bug-f

This definitely could also be a gatsby problem, reddit mobile problem, in-app browsers as a whole problem, or this particular site problem. I also never throw out the possibility of it being a problem with my own device. I'll poke around and see what I can find.

Sidenote: I also have a CSS hack fix that prevents background content from scrolling when the user scrolls in the nav. I'll open a new issue for that if that's wanted.

Guide de contribution

Ouvrir le guide de contribution

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Piste de recherche

Commencez par reproduire le comportement de navigation dans le navigateur intégré de Reddit et comparez-le à celui de Chrome, Safari et Firefox sur mobile. Inspectez la navigation et le CSS du site, puis vérifiez que la navigation est positionnée de manière cohérente et que le défilement à l'intérieur de celle-ci ne révèle ni ne déplace le contenu situé derrière.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
css, javascript, react
Domaine
frontend, web-dev
Type d'issue
Bug
Difficulté
4/5
Temps estimé
3-5 jours
Activité
À l'abandon
Clarté
À clarifier
Accessibilité débutants
28/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.