Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Warning: React does not recognize the errorSchema and Invalid DOM property autocomplete. #4134

Open
3 of 4 tasks
brianlaw033 opened this issue Mar 18, 2024 · 3 comments · Fixed by #4140
Open
3 of 4 tasks
Labels
bug material-ui material-ui related theme issue

Comments

@brianlaw033
Copy link

brianlaw033 commented Mar 18, 2024

Prerequisites

What theme are you using?

mui

Version

5.17.1

Current Behavior

Warning: React does not recognize the 'errorSchema' prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase 'errorschema' instead. If you accidentally passed it from a parent component, remove it from the DOM element.

Warning: Invalid DOM property 'autocomplete'. Did you mean 'autoComplete'?

I am getting these warnings when using Form imported from "@rjsf/mui" when having anyOf or oneOf with type object

Sample Schema

SomeSchema:
  type: object
  properties: 
     someProp:
        type: object
        anyOf:
          - properties:
               a:
                 type: string
          - properties:
               b:
                 type: string

Expected Behavior

No warnings, like using Normal Form from "@rjsf/core"

Steps To Reproduce

import Form from "@rjsf/mui"

<Form
    validator={validator}
    schema={{
        "title": "Location",
        "type": "object",
        "additionalProperties": true,
        "anyOf": [
            {
            "title": "City",
            "properties": {
                "city": {
                "type": "string"
                }
            },
            },
            {
            "title": "Coordinates",
            "properties": {
                "lat": {
                "type": "number"
                },
                "lon": {
                "type": "number"
                }
            },
            }
        ]
    }}
/>

Environment

- OS:
- Node:
- npm:

Anything else?

Screenshot 2024-03-18 at 17 43 46 Screenshot 2024-03-18 at 17 43 30
@brianlaw033 brianlaw033 added bug needs triage Initial label given, to be assigned correct labels and assigned labels Mar 18, 2024
@heath-freenome heath-freenome added material-ui material-ui related theme issue and removed needs triage Initial label given, to be assigned correct labels and assigned labels Mar 22, 2024
@heath-freenome
Copy link
Member

Ah, we are spreading in the @rjsf/mui theme, and clearly we aren't removing those two properly. I'll push a fix and soon.

heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Mar 22, 2024
Fixes: rjsf-team#4134 by updating the spreading of props onto the `TextField` to remove bad DOM fields
- In `@rjsf/mui`, updated `SelectField` and `BaseInputTemplate` to filter out `errorSchema` and `autocomplete` from the `textFieldProps` before they are spread onto `TextField`
- Updated `CHANGELOG.md` accordingly, moving `@rjsf/antd` above `@rjsf/core`
heath-freenome added a commit that referenced this issue Mar 22, 2024
Fixes: #4134 by updating the spreading of props onto the `TextField` to remove bad DOM fields
- In `@rjsf/mui`, updated `SelectField` and `BaseInputTemplate` to filter out `errorSchema` and `autocomplete` from the `textFieldProps` before they are spread onto `TextField`
- Updated `CHANGELOG.md` accordingly, moving `@rjsf/antd` above `@rjsf/core`
nickgros added a commit that referenced this issue Apr 19, 2024
Co-authored-by: Heath C <51679588+heath-freenome@users.noreply.github.com>
Co-authored-by: Abdallah Al-Soqatri <abdallah.al-soqatri@aspentech.com>
Co-authored-by: Kevin Burnett <18027+burnettk@users.noreply.github.com>
Co-authored-by: Marek Bodinger <marek.bodinger@gmail.com>
Co-authored-by: Mehdi Salem <mehdi.salem@qt.io>
Co-authored-by: Jonasz Wiącek <jonaszwiacek@gmail.com>
Co-authored-by: Bogdan Savluk <savluk.bogdan@gmail.com>
Co-authored-by: Christian Wendt <54559756+cwendtxealth@users.noreply.github.com>
Co-authored-by: Ben Lambert <ben@blam.sh>
Co-authored-by: David R. Bild <david@davidbild.org>
Co-authored-by: Ariqun <38001928+Ariqun@users.noreply.github.com>
Co-authored-by: Shivam Anand Murmu <35562703+Rozamo@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Shubham Biswas <46351104+Shubhcoder@users.noreply.github.com>
Co-authored-by: popmanhe <neo_temp@hotmail.com>
Co-authored-by: Yuki Aoki <me@aoki.app>
Co-authored-by: Xiangcheng Kuo <37873394+orange-guo@users.noreply.github.com>
Co-authored-by: Bart van Andel <bavanandel@gmail.com>
Co-authored-by: Laurent Direr <laurent.direr@gmail.com>
Co-authored-by: Vegard Stenvik <42935080+vstenvik@users.noreply.github.com>
Co-authored-by: Appie <abdallarko@hotmail.com>
Co-authored-by: Oren Forer <oforer@gmail.com>
Co-authored-by: Marcus Penn <11893741+mpenndev@users.noreply.github.com>
Co-authored-by: joachimhagheim <47362824+joachimhagheim@users.noreply.github.com>
Co-authored-by: MarekBodingerBA <104828482+MarekBodingerBA@users.noreply.github.com>
Co-authored-by: momesana <momesana@gmail.com>
Co-authored-by: Martti Roitto <MarttiR@users.noreply.github.com>
fix(utils): direct lodash function import to improve bundling on library client side (#3976)
fix: #3961 resolve all recurse list for object properties (#3981)
fix gap in outline when label is hidden (#3984)
Fix: Expose the internal `ajv` variable in the validator implementation classes (#3991)
Fixes: #3972 indirectly by exposing the `ajv` variable for use in the issue
Fix: Change FormHelperText usage with @mui/material to render divs (#4032)
Fixes #4031 by switching the render component for `FormHelperText` to be `div`
fix: Added support for anyOf/oneOf in uiSchema (#4055)
Fixes #4039 by updating `MultiSchemaField` to properly support `anyOf`/`oneOf` arrays in the `uiSchema`
Fix checkbox with 0 as a value was unselectable in antd (#4068)
Fixed #4067 by properly dealing with enums that have 0 as a value
Fix potential XSS in the preview button of FileWidget (#4065)
Fix: Make 'ui:rows' option work with chakra-ui for textarea elements #4070 (#4078)
Fix typo in ErrorsListTemplate example (#4087)
Fix #4080 by moving `base64` encoder/decoder from `@rjsf/utils` to playground (#4093)
Fix: Error state not resetting when schema changes (#4079) (#4103)
Fix noImplicitAny error (#4106)
Fixes: [WARNING] Duplicate key "include" in object literal [duplicate-object-key] (#4114)
Fixes: Warning: validateDOMNesting(...): <p> cannot appear as a descendant of <p>. (#4117)
Fix documentation to add missing Form imports (#4131)
Fix #4127 to add missing `Form` import in documentation
Fix: filename should be bold (#4125)
Fix: use correct ConfigProvider context by using named imports (#4132)
Fix 4134 by filtering out bad DOM props (#4140)
Fixes: #4134 by updating the spreading of props onto the `TextField` to remove bad DOM fields
Fixed Programmatic submit not working properly in Firefox (#4150)
Fix Maximum call stack size exceeded in findSchemaDefinition (#4123)
@thaikoh
Copy link

thaikoh commented Aug 8, 2024

Facing exactly same issue with version 5.19.4.
Seems bug was fixed in 5.18.0?

Warning: React does not recognize the `errorSchema` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `errorschema` instead. If you accidentally passed it from a parent component, remove it from the DOM element.\
Warning: Invalid DOM property `autocomplete`. Did you mean `autoComplete`?

@heath-freenome
Copy link
Member

@thaikoh Can you provide an example using the a shared playground link that highlights this. Thanks!

nickgros added a commit that referenced this issue Aug 18, 2024
Co-authored-by: Heath C <51679588+heath-freenome@users.noreply.github.com>
Co-authored-by: Abdallah Al-Soqatri <abdallah.al-soqatri@aspentech.com>
Co-authored-by: Kevin Burnett <18027+burnettk@users.noreply.github.com>
Co-authored-by: Marek Bodinger <marek.bodinger@gmail.com>
Co-authored-by: Mehdi Salem <mehdi.salem@qt.io>
Co-authored-by: Nick Grosenbacher <nickgrosenbacher@gmail.com>
Co-authored-by: Abdallah Al-Soqatri <abdallah.al-soqatri@inmation.com>
Co-authored-by: Jonasz Wiącek <jonaszwiacek@gmail.com>
Co-authored-by: Bogdan Savluk <savluk.bogdan@gmail.com>
Co-authored-by: Christian Wendt <54559756+cwendtxealth@users.noreply.github.com>
Co-authored-by: Ben Lambert <ben@blam.sh>
Co-authored-by: David R. Bild <david@davidbild.org>
Co-authored-by: Ariqun <38001928+Ariqun@users.noreply.github.com>
Co-authored-by: Shivam Anand Murmu <35562703+Rozamo@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Shubham Biswas <46351104+Shubhcoder@users.noreply.github.com>
Co-authored-by: popmanhe <neo_temp@hotmail.com>
Co-authored-by: Yuki Aoki <me@aoki.app>
Co-authored-by: Xiangcheng Kuo <37873394+orange-guo@users.noreply.github.com>
Co-authored-by: Bart van Andel <bavanandel@gmail.com>
Co-authored-by: Laurent Direr <laurent.direr@gmail.com>
Co-authored-by: Vegard Stenvik <42935080+vstenvik@users.noreply.github.com>
Co-authored-by: Appie <abdallarko@hotmail.com>
Co-authored-by: Oren Forer <oforer@gmail.com>
Co-authored-by: Marcus Penn <11893741+mpenndev@users.noreply.github.com>
Co-authored-by: joachimhagheim <47362824+joachimhagheim@users.noreply.github.com>
Co-authored-by: MarekBodingerBA <104828482+MarekBodingerBA@users.noreply.github.com>
Co-authored-by: momesana <momesana@gmail.com>
Co-authored-by: Martti Roitto <MarttiR@users.noreply.github.com>
Co-authored-by: Serge van den Oever <serge@macaw.nl>
Co-authored-by: Enzo Ferey <hello@enzoferey.com>
Co-authored-by: Skyf0l <tom.rorato@gmail.com>
Co-authored-by: Jaejoon Han <jj2726@gmail.com>
Co-authored-by: とまとみ <tomatommy.bs@gmail.com>
Co-authored-by: Daniel Todd <todddaniel@gmail.com>
Co-authored-by: Dmitry Dzhus <dima@dzhus.org>
Co-authored-by: Alexander Kachkaev <alexander@kachkaev.ru>
Co-authored-by: shaddollxz <56341682+shaddollxz@users.noreply.github.com>
Co-authored-by: Changyu Geng <gcyyq@hotmail.com>
Co-authored-by: Helen Lin <46795546+helen-m-lin@users.noreply.github.com>
Co-authored-by: solimant <solimant@users.noreply.github.com>
Co-authored-by: David Li <davidli@cs.stanford.edu>
fix(utils): direct lodash function import to improve bundling on library client side (#3976)
fix: #3961 resolve all recurse list for object properties (#3981)
fix gap in outline when label is hidden (#3984)
Fix: Expose the internal `ajv` variable in the validator implementation classes (#3991)
Fixes: #3972 indirectly by exposing the `ajv` variable for use in the issue
Fix: Change FormHelperText usage with @mui/material to render divs (#4032)
Fixes #4031 by switching the render component for `FormHelperText` to be `div`
fix: Added support for anyOf/oneOf in uiSchema (#4055)
Fixes #4039 by updating `MultiSchemaField` to properly support `anyOf`/`oneOf` arrays in the `uiSchema`
Fix checkbox with 0 as a value was unselectable in antd (#4068)
Fixed #4067 by properly dealing with enums that have 0 as a value
Fix potential XSS in the preview button of FileWidget (#4065)
Fix: Make 'ui:rows' option work with chakra-ui for textarea elements #4070 (#4078)
Fix typo in ErrorsListTemplate example (#4087)
Fix #4080 by moving `base64` encoder/decoder from `@rjsf/utils` to playground (#4093)
Fix: Error state not resetting when schema changes (#4079) (#4103)
Fix noImplicitAny error (#4106)
Fixes: [WARNING] Duplicate key "include" in object literal [duplicate-object-key] (#4114)
Fixes: Warning: validateDOMNesting(...): <p> cannot appear as a descendant of <p>. (#4117)
Fix documentation to add missing Form imports (#4131)
Fix #4127 to add missing `Form` import in documentation
Fix: filename should be bold (#4125)
Fix: use correct ConfigProvider context by using named imports (#4132)
Fix 4134 by filtering out bad DOM props (#4140)
Fixes: #4134 by updating the spreading of props onto the `TextField` to remove bad DOM fields
Fixed Programmatic submit not working properly in Firefox (#4150)
Fix Maximum call stack size exceeded in findSchemaDefinition (#4123)
fix typos in constants.ts, Form.tsx (#4185)
Fix mui imports in docs (#4218)
fix] Resetting number fields should check the entire string when deciding to leave the input text alone (#4202) (#4220)
Fixed performance issue with large schema dependencies and oneOf (#4203) (#4204)
Fixed performance issue #4203
fix(core): field ui-options higher priority (#4212)
fix(antd): disabled property of options of antd theme (#4216)
fix: omitExtraData on submit and on validateForm (#4228)
Fix IdSchema and PathSchema types (#4196)
fixes #4236
Fix #4197 in various themes by showing empty option in SelectWidget when appropriate (#4200)
fix: xss when rendering schema errors (#4256)
fix 4215 and 4260 by updating optionsList() to take a uiSchema (#4263)
Fixes #4215 and #4260 by supporting alternate titles for enums and anyOf/oneOf lists via the uiSchema
Fixed Changelog (#4269)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug material-ui material-ui related theme issue
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants