Repository navigation
[$250] [Dev] Console Warning: ERROR Warning: A props object containing a “key” prop is being spread into JSX: #49064
Description
If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!
Version Number: 9.0.30-9
Reproducible in staging?: Needs reproduction
Reproducible in production?: Needs reproduction
If this was caught during regression testing, add the test name, ID and link from TestRail:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Expensify/Expensify Issue URL:
Issue reported by: @c3024
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1726072795900059?thread_ts=1726072125.690969&cid=C049HHMV9SM
Action Performed:
- Logon to ND on iOS App
- Go to the self DM page
- Track an Expense
- Click on Share with accountant in the whisper
- Continue with the flow till the merchant page.
Expected Result:
No console warning on the workspace merchant page.
Actual Result:
Console Warning
ERROR Warning: A props object containing a “key” prop is being spread into JSX:
let props = {key: someKey, ref: ..., valueType: ..., name: ..., defaultValue: ..., maxLength: ..., label: ..., accessibilityLabel: ..., role: ..., shouldSetTouchedOnBlurOnly: ..., blurOnSubmit: ..., onSubmitEditing: ..., returnKeyType: ..., inputID: ..., errorText: ..., value: ..., onTouched: ..., onPress: ..., onPressOut: ..., onBlur: ..., onInputChange: ...};
<ForwardRef(TextInput) {...props} />
Workaround:
Unknown
Platforms:
Which of our officially supported platforms is this issue occurring on?
- Android: Native
- Android: mWeb Chrome
- iOS: Native
- iOS: mWeb Safari
- MacOS: Chrome / Safari
- MacOS: Desktop
Screenshots/Videos
Add any screenshot/video evidence
Upwork Automation - Do Not Edit
- Upwork Job URL: https://www.upwork.com/jobs/~021836067438259125444
- Upwork Job ID: 1836067438259125444
- Last Price Increase: 2024-09-17
- Automatic offers:
- gijoe0295 | Contributor | 104010367
Issue Owner
Current Issue Owner: @puneetlathMetadata
Metadata
Assignees
Labels
Type
Projects
- Status
Activity
melvin-bot commentedon Sep 12, 2024
Triggered auto assignment to @puneetlath (
Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.MelvinBot commentedon Sep 12, 2024
This has been labelled "Needs Reproduction". Follow the steps here: https://stackoverflowteams.com/c/expensify/questions/16989
gijoe0295 commentedon Sep 12, 2024
Edited by proposal-police: This proposal was edited at 2024-09-12 23:05:24 UTC.
Proposal
Please re-state the problem that we are trying to solve in this issue.
Console Warning: A props object containing a “key” prop is being spread into JSX
What is the root cause of that problem?
This happens in the
InputWrapperwhere we apply spread operator forregisterInputwhich containskeyprop:App/src/components/Form/InputWrapper.tsx
Line 82 in 5a2602c
App/src/components/Form/FormProvider.tsx
Line 298 in d9618ca
What changes do you think we should make in order to solve the problem?
Separate the
keyand other props fromregisterInput:Additionally, we might need to double check every places where we use spread operator for component props to ensure they do not spread
key. We can leverage theeslint-disable-next-line react/jsx-props-no-spreadinglint for this case.[-][Dev] Console Warning: ERROR Warning: A props object containing a “key” prop is being spread into JSX:[/-][+][$250] [Dev] Console Warning: ERROR Warning: A props object containing a “key” prop is being spread into JSX:[/+]melvin-bot commentedon Sep 17, 2024
Job added to Upwork: https://www.upwork.com/jobs/~021836067438259125444
8 remaining items
melvin-bot commentedon Sep 17, 2024
📣 @gijoe0295 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!
Offer link
Upwork job
Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑💻
Keep in mind: Code of Conduct | Contributing 📖
gijoe0295 commentedon Oct 1, 2024
@puneetlath PR reach production on Sep 25. Should be ready for payment on Oct 2.
gijoe0295 commentedon Oct 4, 2024
@puneetlath Ready for payment.
puneetlath commentedon Oct 6, 2024
Sorry for the delay!
Payment summary:
Thanks everyone!
garrettmknight commentedon Oct 15, 2024
$250 approved for @jayeshmangwani
gijoe0295 commentedon Oct 22, 2024
@garrettmknight @puneetlath Hi I haven't received payments for this yet. My Upwork profile is https://www.upwork.com/freelancers/~0187ef68b8203dabee.
garrettmknight commentedon Oct 23, 2024
@puneetlath did you pay @gijoe0295 somewhere else?
puneetlath commentedon Oct 23, 2024
Oh hm, weird. The upwork job shows up as unpaid: https://www.upwork.com/nx/wm/workroom/38445346/overview. It must've been during the time when Upwork was having the payment bug because the contract shows as completed. In any case, I've added the payment as a bonus, so you should have it now @gijoe0295. Sorry about that!