React-jsonschema-form: Additional properties are not submitted when nested and omit data enabled

Created on 31 Oct 2019  路  4Comments  路  Source: rjsf-team/react-jsonschema-form

Prerequisites

Description

Additional properties are not submitted when nested and omit data enabled. This only happens when it is nested.

Steps to Reproduce

  1. Goto Playground example
  2. Open console so you can see submit data when you click submit button.
  3. Enable Omit extra data checkbox
  4. Add an additional property (click plus button)
  5. Click submit
  6. Check submitted formData in console ... it is empty (why?)

Expected behavior

Additional Properties submitted in form data.

Actual behavior

Nothing submitted.

Version

Used online playground version.

image

bug

All 4 comments

@CodeGains any thoughts on why this might be happening?

@hutch120 did you ever find a workaround for this?

I'm having what I believe is the same issue as you can see with this Playground Link.

I've traced it down to this line https://github.com/rjsf-team/react-jsonschema-form/blob/master/packages/core/src/components/Form.js#L164
Given when adding a new entry to an object it comes in with default, and of course if my form pre-populates with many entries for this field, the _isEmpty check at this line will never pass and the accumulator won't end up with this field.

1419 introduced this line and may be worth looking at further.

If there is an alternative approach to have a key/value field in a form with JSON Schema I'd be happy to go that route instead but this is the only one I've seen (this is new to me).

here's a test I was writing for this:

    it.only("should rename formData key if key input is renamed in a nested object with omitExtraData=true and liveOmit=true", () => {
      const { node, onChange } = createFormComponent({
        schema: {
          type: "object",
          properties: {
            nested: {
              additionalProperties: { type: "string" }
            }
          }
        },
        formData: { nested: { key1: "value" } }
      }, {omitExtraData: true, liveOmit: true});

      const textNode = node.querySelector("#root_key1-key");
      Simulate.blur(textNode, {
        target: { value: "key1new" },
      });

      sinon.assert.calledWithMatch(onChange.lastCall, {
        formData: { nested: { key1new: "value" } }
      });
    });

@achendrick Hi. so we applied this to a bunch of existing JSON configuration files and the config would not fit the schema correctly without using nested additional properties. So the workaround was to leave omitExtraData set to false. This is a shame because it means our saved configs are quite messy because when we do migrations, etc, they retain the old data. Anyway, it worked, so we left it. I'd be keen to revisit/test an update if it was available.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

mammad2c picture mammad2c  路  3Comments

abhishekpdubey picture abhishekpdubey  路  3Comments

norim13 picture norim13  路  3Comments

ClockerZadq picture ClockerZadq  路  3Comments

ebower12 picture ebower12  路  3Comments