react-jsonschema-form: Dependency defaults do not render for uncontrolled Form components

Prerequisites

Description

With release 1.6.1, some of our dependency defaults now render correctly - incl. the ones listed in a previous issue. However, we still have one set of dependency defaults that do not render. My hypothesis is that it may be because we also use “definitions” as part of the structure.

Steps to Reproduce

I will provide a playground example of the issue - but the playground seems to be 1.6.0 rather than 1.6.1, so currently I can’t create one. However, I’ve added the example Schema below. Note that the option C is the one that has default values that do not get inserted.

{
  "type": "object",
  "definitions": {
    "can": {
      "type": "object",
      "properties": {
        "phy": {
          "title": "TitleX",
          "type": "object",
          "properties": {
            "bit_rate_cfg_mode": {
              "title": "TitleY",
              "type": "integer",
              "default": 0,
              "anyOf": [
                {
                  "title": "A",
                  "enum": [
                    0
                  ]
                },
                {
                  "title": "B",
                  "enum": [
                    1
                  ]
                },
                {
                  "title": "C",
                  "enum": [
                    2
                  ]
                }
              ]
            }
          },
          "dependencies": {
            "bit_rate_cfg_mode": {
              "oneOf": [
                {
                  "properties": {
                    "bit_rate_cfg_mode": {
                      "enum": [
                        0
                      ]
                    }
                  }
                },
                {
                  "properties": {
                    "bit_rate_cfg_mode": {
                      "enum": [
                        1
                      ]
                    }
                  }
                },
                {
                  "properties": {
                    "bit_rate_cfg_mode": {
                      "enum": [
                        2
                      ]
                    },
                    "brp": {
                      "title": "XYZ 1",
                      "type": "integer",
                      "default": 12,
                      "minimum": 1
                    }
                  }
                }
              ]
            }
          }
        }
      }
    }
  },
  "properties": {
    "can_1": {
      "title": "CHANNEL 1",
      "$ref": "#/definitions/can"
    }
  }
}

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Comments: 20 (8 by maintainers)

Most upvoted comments

It seems like the workaround is to make the form a controlled component – i.e., save the form data in the state and update it in during onChange – see this jsfiddle for example: https://jsfiddle.net/qrhws8f6/

@epicfaace Our challenge with such a solution is that we need to have a specific value in the dropdown be the default selection of the dropdown. However, one of the non-default dropdown selections have dependency defaults - hence we run into the rendering issue.

Since this seems to work in the playground, I guess there’s some sort of compensation fix going on in that code. Perhaps a similar thinking could be used to solve this issue. I use the pagination extension to rjsf and noticed that when I select the “option C” in the dropdown example, the default value will be populated when I switch tabs back and forth. So I’d assume some form of similar effect could be triggered as a special case in rjsf when dependency defaults need to be rendered.

Best,

Yes, you’re right – here’s a jsfiddle reproduction: https://jsfiddle.net/h0adfqjy/