Altinn / Altinn/app-frontend-react
Objects are not valid as a React child
- Dominant language
- TypeScript
- Stars
- 21
- Forks
- 33
- Avg merge
- 6d 23h
- Merged PRs (30d)
- 3
Description
## Description
Rendering UI elements after data is inserted into the data model, then cleaning (parts of) the datamodel results in the front end crashing wiht error "Objects are not valid as a React child (found: object with keys {type, key, ref, props, _owner}). If you meant to render a collection of children, use an array instead."
## To Reproduce
The bug can be preproduced on this branch of Transportloyvegarantier: https://altinn.studio/repos/svv/transportloyvegarantier/src/branch/not_valid_react_child
Add the following role (or remove the role check in the app) to the test user src\development\TestData\authorization\roles\User_1337\party_500700\roles.json
` {
"Type": "altinn",
"value": "A0294"
}`
Steps to reproduce
1. Start the app and open it with the user Sophie Salt representing Oslos Vakreste Borettslag
2. Write a valid organisation number in the field (for example "123456789")
3. Wait for the UI to render the previously hidden elements
4. Write an invalid organsation number in the field (for example "12345678")
## Expected behavior
Hide the UI elements that are governed by rule "1baba030-2c49-11ec-a883-e3e3ff3ab0d3"
## Screenshots



## Additional info
Tested in Edge on Windows 10
First reported in #studio-svv on Slack: https://altinn.slack.com/archives/C02ESDT071T/p1649253408138869
Contributor guide
Research direction
Start by reproducing the failure using the linked Transportloyvegarantier branch, the User_1337 role configuration in src\development\TestData\authorization\roles\User_1337\party_500700\roles.json, and the organisation-number steps. Trace the UI update after rule 1baba030-2c49-11ec-a883-e3e3ff3ab0d3 hides elements. Done means invalid input hides those elements without the React child crash.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100