[Bug]: Next button throws a runtime error instead of cycling to the first sculpture
Nobody has claimed this yet.
Assessment
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Newbie friendliness
- 74/100
- Issue type
- Bug
- Clarity
- Mostly clear
- Activity status
- Active
- Tech stack
- javascript, react
- Domain
- documentation, frontend
Research direction
Open the State: A Component's Memory page and inspect the Sculpture Gallery example, then reproduce the error by clicking Next on sculpture 12 of 12. Trace the example's index update and verify that the gallery returns to the first sculpture without accessing an undefined entry.
Written by the indexing model from the issue text.
Description
Summary
On the State: A Component's Memory page, the Sculpture Gallery example allows users to navigate through sculptures using the Next button. The gallery works correctly while navigating through valid entries, but when the user clicks Next on the final sculpture (12 of 12), the application does not cycle back to the first sculpture.
Instead, the index exceeds the sculpture list bounds, making sculpture undefined and causing the runtime error:
App.js: can't access property "name", sculpture is undefined
Expected: The gallery should wrap around from the last sculpture to the first sculpture when Next is clicked.
Actual: The application throws a runtime error because it attempts to access properties such as sculpture.name on an undefined object.
Affected screen: React.dev → Learn React → Adding Interactivity → State: A Component's Memory → Sculpture Gallery example.
Page
https://react.dev/learn/state-a-components-memory
Details
No response
- Dominant language
- JavaScript
- Stars
- 11.8k
- Forks
- 7.9k
- Avg merge
- 16h 6m
- Merged PRs (30d)
- 7
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from reactjs/react.dev
-
type: documentation
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
-
Difficulty 1/5 Under an hour Newbie friendliness 82/100
-
type: typos
Difficulty 1/5 Under an hour Newbie friendliness 90/100
-
bug: unconfirmed
Difficulty 2/5 1-3 hours Newbie friendliness 68/100
-
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
All issues in reactjs/react.dev
Similar issues
-
bug
Difficulty 1/5 Under an hour Newbie friendliness 90/100
apache/cloudstack#14222 ·
-
Browser Waiting for: Product Owner
Difficulty 2/5 1-3 hours Newbie friendliness 85/100
getsentry/sentry-javascript#24577 · 1 comment ·
-
curation good first issue
Difficulty 2/5 1-3 hours Newbie friendliness 88/100
amponce/archive-movie-browser#186 ·
-
light
Difficulty 2/5 1-3 hours Newbie friendliness 85/100
aemdemos/patients-stryker#253 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 86/100
clerk/javascript#9852 ·