RNTester: example list search filter resets after returning from an example

Aberta
  • Algo errado?
#59,868 3 comentários 0 reações 0 responsáveis Ver no GitHub

Mantenedores costumam responder em até 2 dias

Ninguém assumiu esta issue ainda.

Avaliação

Dificuldade
3/5
Tempo estimado
1-2 dias
Facilidade para iniciantes
69/100
Tipo de issue
Bug
Clareza
Claramente especificada
Status de atividade
Ativa
Stack de tecnologia
javascript, react-native
Domínio
mobile

Direção de pesquisa

Start with RNTesterExampleFilter, RNTesterAppShared, and RNTesterModuleList under packages/rn-tester; trace how filter and category state is lost when the list unmounts. Keep that state available when returning from an example, then reproduce the Components list steps and confirm the search text and selected category persist.

Escrita pelo modelo de indexação a partir do texto da issue.

Descrição

Needs: Attention Needs: Repro
Description

In RNTester, the search text in the Components and APIs lists resets when you open an example and go back. You must enter the filter again each time.

The cause is in RNTester itself: RNTesterExampleFilter keeps filter and category in its own component state, and RNTesterAppShared renders RNTesterModuleList, which contains the filter, only when no example is open. Opening an example unmounts the filter and drops its state. A possible fix is to keep the filter state in RNTesterAppShared or in the navigation reducer, next to the recentlyUsed state that already lives there.

Steps to reproduce
  1. Open RNTester and go to the Components list.
  2. Type Flat in the "Search..." field and press Return. The list shows only FlatList.
  3. Open FlatList.
  4. Tap Back.

Expected: The list shows with the search text Flat, as before.

Actual: The search field is empty ("Search...") and the full list shows, with FlatList under "Recently Viewed".

TV builds (react-native-tvos) also show category pills above the list, and the selected category resets in the same way.

React Native Version

main at f480836ad8e (packages/react-native version 1000.0.0)

Affected Platforms

Runtime - iOS

Tested on an iPhone 18 Pro simulator, iOS 27.0, RNTester debug build. Also seen on the Apple TV 4K (3rd generation) simulator, tvOS 27.0, with the react-native-tvos RNTester, which uses the same code. Not tested on Android.

Output of npx @react-native-community/cli info
System:
  OS: macOS 26.7.1
  CPU: (18) arm64 Apple M5 Pro
  Memory: 1.60 GB / 48.00 GB
  Shell:
    version: 5.3.20
    path: /opt/homebrew/bin/bash
Binaries:
  Node:
    version: 24.13.0
    path: /usr/local/bin/node
  Yarn:
    version: 1.22.22
    path: /opt/homebrew/bin/yarn
  npm:
    version: 11.4.2
    path: /opt/homebrew/bin/npm
  Watchman:
    version: 2026.07.27.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.17.0
    path: /opt/homebrew/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 27.2
      - iOS 27.2
      - macOS 27.2
      - tvOS 27.2
      - visionOS 27.2
      - watchOS 27.2
  Android SDK: Not Found
IDEs:
  Android Studio: 2025.1 AI-251.26094.121.2512.13840223
  Xcode:
    version: 27.2/27B52
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.20.1
    path: /usr/bin/javac
  Ruby:
    version: 4.0.7
    path: /opt/homebrew/opt/ruby/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react: Not Found
  react-native: Not Found
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: false
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: true
Stacktrace or Logs
None. No error or warning is logged; the filter state is lost when the list unmounts.
MANDATORY Reproducer

The reproducer is RNTester in this repository (packages/rn-tester), with the steps above.

Screenshots and Videos

No response

Linguagem predominante
C++
Estrelas
127k
Forks
25.5k
Merge médio
3d 18h
PRs com merge (30d)
188

Preparar o ambiente

Primeiros passos

  1. Leia a issue inteira e depois o guia de contribuição do projeto.
  2. Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
  3. Faça um fork do repositório e trabalhe em uma branch.
  4. Abra um pull request que referencie o número da issue.

Mais de react/react-native

Todas as issues de react/react-native

Issues semelhantes

Mais issues de C++

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.