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

Bug: Custom field that is anyOf displays twice #2691

Closed
3 tasks done
abemedia opened this issue Feb 6, 2022 · 3 comments · Fixed by #3400
Closed
3 tasks done

Bug: Custom field that is anyOf displays twice #2691

abemedia opened this issue Feb 6, 2022 · 3 comments · Fixed by #3400
Labels

Comments

@abemedia
Copy link
Contributor

abemedia commented Feb 6, 2022

Prerequisites

Description

When using a custom field that's an anyOf, the field is displayed twice. First on it's own and then again wrapped in the AnyOfField.
Looking at the code at https://github.com/rjsf-team/react-jsonschema-form/blob/master/packages/core/src/components/fields/SchemaField.js#L356-L381 I can see the field is first used and then the AnyOf and OneOf fields are used below. Might be an idea to wrap the latter in an if statement so if it's a custom field it doesn't show (that's what I did in a local override).

Steps to Reproduce

See fiddle: https://jsfiddle.net/pajetb10/

Expected behavior

AnyOfField isn't used as we have supplied a custom field.

Actual behavior

The field is displayed twice. First on it's own and then again wrapped in the AnyOfField.

Version

3.2.1

@jacqueswho jacqueswho added the bug label Feb 22, 2022
@romainbessugesmeusy
Copy link

Hello there,
I'm encountering the issue as well. Here's a Code sandbox explaining my situation:
https://codesandbox.io/s/hopeful-dust-vs82wn?file=/src/Playground.js

@truh
Copy link
Contributor

truh commented May 12, 2022

Was about to report the same problem.

Current behavior

The customized field is rendered as

  • Custom field
  • Select box
  • Custom field (again but a bit more nested)

Expected behavior

I thought it would only render the custom field in place of the default view of the relevant part of the form.

I expected to be able to handle the anyOf choice within my custom field.

Steps To Reproduce

https://codepen.io/jakob-moonvision/pen/NWyRXxv (this is a minimal example hence a rather pointless use of anyOf but I have the same problem with a more complex )

  • Create a schema with a anyOf
  • Create custom field
  • Create a uiSchema where the custom field is set for the schema containing the anyOf

Environment

  • OS: macOS Monterey 12.3.1
  • Node: 14.17.4
  • yarn: 1.22.17

@truh
Copy link
Contributor

truh commented May 16, 2022

I believe that I have found a solution to this problem. Will open a PR when I can get the development environment working.

In the meanwhile you can try to pass this https://gist.github.com/truh/ce6a1b93bdd0b7533d2d65f5c5290300 for the SchemaField.

truh added a commit to truh/react-jsonschema-form that referenced this issue Jun 23, 2022
truh added a commit to truh/react-jsonschema-form that referenced this issue Jun 23, 2022
truh added a commit to truh/react-jsonschema-form that referenced this issue Aug 17, 2022
heath-freenome pushed a commit that referenced this issue Aug 19, 2022
* Create playground example *Any Of with Custom Field*

* Fix Bug: Custom field that is anyOf displays twice

#2691

* Update CHANGELOG.md

* Avoid breaking anyOf/oneOf select with ObjectField

* Verify custom field is only rendered once with anyOf/oneOf

* Verify select is not rendered when custom field set

* Example without imports

* Cleanup

* Fix merge  conflict

* Delete SchemaField.js

* Update changelog

* Run cs-format
heath-freenome pushed a commit to heath-freenome/react-jsonschema-form that referenced this issue Aug 27, 2022
…m#2890)

* Create playground example *Any Of with Custom Field*

* Fix Bug: Custom field that is anyOf displays twice

rjsf-team#2691

* Update CHANGELOG.md

* Avoid breaking anyOf/oneOf select with ObjectField

* Verify custom field is only rendered once with anyOf/oneOf

* Verify select is not rendered when custom field set

* Example without imports

* Cleanup

* Fix merge  conflict

* Delete SchemaField.js

* Update changelog

* Run cs-format
heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Jan 25, 2023
Fixes: rjsf-team#2691 better by providing an opt-out behavior for the automatic wrapping of fields by anyOf/oneOf components

The original fix (rjsf-team#2980) to never wrap components is a breaking change from 4.x and could cause existing users problems.
This new fix provides the opt-out instead thereby reversing the breaking change

- In `@rjsf/utils`, updated just the `UiSchema` type to add the new `ui:fieldReplacesAnyOrOneOf` flag
- In `@rjsf/core`, updated `SchemaField` to only skip wrapping a custom field in the `anyOf`/`oneOf` if the `ui:fieldReplacesAnyOrOneOf` is true along with there being a custom field
  - Updated/added tests to verify the fix
- Updated the `uiSchema` documentation to include `ui:fieldReplacesAnyOrOneOf`
- Updated the `CHANGELOG.md` accordingly
heath-freenome added a commit to heath-freenome/react-jsonschema-form that referenced this issue Jan 25, 2023
Fixes: rjsf-team#2691 better by providing an opt-out behavior for the automatic wrapping of fields by anyOf/oneOf components

The original fix (rjsf-team#2980) to never wrap components is a breaking change from 4.x and could cause existing users problems.
This new fix provides the opt-out instead thereby reversing the breaking change

- In `@rjsf/utils`, updated just the `UiSchema` type to add the new `ui:fieldReplacesAnyOrOneOf` flag
- In `@rjsf/core`, updated `SchemaField` to only skip wrapping a custom field in the `anyOf`/`oneOf` if the `ui:fieldReplacesAnyOrOneOf` is true along with there being a custom field
  - Updated/added tests to verify the fix
- Updated the `uiSchema` documentation to include `ui:fieldReplacesAnyOrOneOf`
- Updated the `CHANGELOG.md` accordingly
heath-freenome added a commit that referenced this issue Jan 26, 2023
* Fix: 2691 with an opt-out for custom fields for anyOf/oneOf
Fixes: #2691 better by providing an opt-out behavior for the automatic wrapping of fields by anyOf/oneOf components

The original fix (#2980) to never wrap components is a breaking change from 4.x and could cause existing users problems.
This new fix provides the opt-out instead thereby reversing the breaking change

- In `@rjsf/utils`, updated just the `UiSchema` type to add the new `ui:fieldReplacesAnyOrOneOf` flag
- In `@rjsf/core`, updated `SchemaField` to only skip wrapping a custom field in the `anyOf`/`oneOf` if the `ui:fieldReplacesAnyOrOneOf` is true along with there being a custom field
  - Updated/added tests to verify the fix
- Updated the `uiSchema` documentation to include `ui:fieldReplacesAnyOrOneOf`
- Updated the `CHANGELOG.md` accordingly

* - Responded to reviewer feedback
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants