@remoteoss/json-schema-form 0.10.1-beta.0 → 0.11.0-beta.0

package/src/tests/modify.test.js

@@ -53,12 +53,15 @@ const schemaPet = {
       properties: {
         street: {
           title: 'Street',
+          'x-jsf-presentation': {
+            inputType: 'text',
+          },
         },
       },
     },
   },
   required: ['has_pet'],
-  'x-jsf-order': ['has_pet', 'pet_name'],
+  'x-jsf-order': ['has_pet', 'pet_name', 'pet_age', 'pet_fat', 'pet_address'],
   allOf: [
     {
       id: 'pet_conditional_id',
@@ -102,6 +105,36 @@ const schemaAddress = {
   },
 };
 
+beforeAll(() => {
+  jest.spyOn(console, 'warn').mockImplementation(() => {});
+});
+
+afterAll(() => {
+  console.warn.mockRestore();
+});
+
+describe('modify() - warnings', () => {
+  it('logs a warning by default', () => {
+    const result = modify(schemaPet, {});
+
+    expect(console.warn).toBeCalledWith(
+      'json-schema-form modify(): We highly recommend you to handle/report the returned `warnings` as they highlight possible bugs in your modifications. To mute this log, pass `muteLogging: true` to the config.'
+    );
+
+    console.warn.mockClear();
+    expect(result.warnings).toEqual([]);
+  });
+
+  it('given muteLogging, it does not log the warning', () => {
+    const result = modify(schemaPet, {
+      muteLogging: true,
+    });
+
+    expect(console.warn).not.toBeCalled();
+    expect(result.warnings).toEqual([]);
+  });
+});
+
 describe('modify() - basic mutations', () => {
   it('replace base field', () => {
     const result = modify(schemaPet, {
@@ -119,7 +152,7 @@ describe('modify() - basic mutations', () => {
       },
     });
 
-    expect(result).toMatchObject({
+    expect(result.schema).toMatchObject({
       properties: {
         pet_name: {
           title: 'Your pet name',
@@ -135,24 +168,30 @@ describe('modify() - basic mutations', () => {
   it('replace nested field', () => {
     const result = modify(schemaAddress, {
       fields: {
+        // You can use dot notation
         'address.street': {
           title: 'Street name',
         },
         'address.city': () => ({
           title: 'City name',
         }),
-        address: () => {
+        // Or pass the native object
+        address: (fieldAttrs) => {
           return {
             properties: {
-              number: { title: 'Door number' },
+              number: (nestedAttrs) => {
+                return {
+                  'x-test-siblings': Object.keys(fieldAttrs.properties),
+                  title: `Door ${nestedAttrs.title}`,
+                };
+              },
             },
           };
         },
-        // TODO: write test to nested field
       },
     });
 
-    expect(result).toMatchObject({
+    expect(result.schema).toMatchObject({
       properties: {
         address: {
           properties: {
@@ -160,7 +199,8 @@ describe('modify() - basic mutations', () => {
               title: 'Street name',
             },
             number: {
-              title: 'Door number',
+              title: 'Door Number',
+              'x-test-siblings': ['street', 'number', 'city'],
             },
             city: {
               title: 'City name',
@@ -171,6 +211,44 @@ describe('modify() - basic mutations', () => {
     });
   });
 
+  it('replace fields that dont exist gets ignored', () => {
+    // IMPORTANT NOTE on this behavior:
+    // Context: At Remote we have a lot of global customization that run equally across multiple different JSON Schemas.
+    // With this, we avoid applying customizations to non-existing fields. (aka create fields)
+    // That's why we have the "create" config, specific to create new fields.
+    const result = modify(schemaPet, {
+      fields: {
+        unknown_field: {
+          title: 'This field does not exist in the original schema',
+        },
+        'nested.field': {
+          title: 'Nop',
+        },
+        pet_name: {
+          title: 'New pet title',
+        },
+      },
+    });
+
+    expect(result.schema.properties.unknown_field).toBeUndefined();
+    expect(result.schema.properties.nested).toBeUndefined();
+    expect(result.schema.properties.pet_name).toEqual({
+      ...schemaPet.properties.pet_name,
+      title: 'New pet title',
+    });
+
+    expect(result.warnings).toEqual([
+      {
+        type: 'FIELD_TO_CHANGE_NOT_FOUND',
+        message: 'Changing field "unknown_field" was ignored because it does not exist.',
+      },
+      {
+        type: 'FIELD_TO_CHANGE_NOT_FOUND',
+        message: 'Changing field "nested.field" was ignored because it does not exist.',
+      },
+    ]);
+  });
+
   it('replace all fields', () => {
     const result = modify(schemaPet, {
       allFields: (fieldName, fieldAttrs) => {
@@ -188,7 +266,7 @@ describe('modify() - basic mutations', () => {
       },
     });
 
-    expect(result).toMatchObject({
+    expect(result.schema).toMatchObject({
       properties: {
         has_pet: {
           dataFoo: 'abc',
@@ -203,6 +281,7 @@ describe('modify() - basic mutations', () => {
           styleDecimals: 2,
         },
         pet_address: {
+          // assert recursivity
           properties: {
             street: {
               dataFoo: 'abc',
@@ -213,7 +292,7 @@ describe('modify() - basic mutations', () => {
     });
   });
 
-  it('replace field options (radio/select)', () => {
+  it('replace field attrs that are arrays (partial)', () => {
     const result = modify(schemaPet, {
       fields: {
         has_pet: (fieldAttrs) => {
@@ -239,7 +318,7 @@ describe('modify() - basic mutations', () => {
       },
     });
 
-    expect(result).toMatchObject({
+    expect(result.schema).toMatchObject({
       properties: {
         has_pet: {
           oneOf: [
@@ -257,7 +336,30 @@ describe('modify() - basic mutations', () => {
     });
   });
 
-  it('error message', () => {
+  it('replace field attrs that are arrays (full)', () => {
+    const result = modify(schemaPet, {
+      fields: {
+        has_pet: {
+          oneOf: [{ const: 'yaaas', title: 'YAAS!' }],
+        },
+      },
+    });
+
+    expect(result.schema).toMatchObject({
+      properties: {
+        has_pet: {
+          oneOf: [
+            {
+              const: 'yaaas',
+              title: 'YAAS!',
+            },
+          ],
+        },
+      },
+    });
+  });
+
+  it('customize x-jsf-errorMessage (shorthand)', () => {
     const result = modify(schemaPet, {
       fields: {
         pet_age: (fieldAttrs) => {
@@ -277,7 +379,7 @@ describe('modify() - basic mutations', () => {
       // ...
     });
 
-    expect(result).toMatchObject({
+    expect(result.schema).toMatchObject({
       properties: {
         pet_age: {
           'x-jsf-errorMessage': {
@@ -297,4 +399,418 @@ describe('modify() - basic mutations', () => {
       },
     });
   });
+
+  it('customize x-jsf-presentation (shorthand)', () => {
+    const result = modify(schemaPet, {
+      fields: {
+        pet_age: () => {
+          return {
+            presentation: {
+              'data-foo': 123,
+            },
+          };
+        },
+        'pet_address.street': {
+          presentation: {
+            'data-foo': 456,
+          },
+        },
+      },
+    });
+
+    const originalPetAgePresentation = schemaPet.properties.pet_age['x-jsf-presentation'];
+    expect(originalPetAgePresentation).toBeDefined();
+
+    const originalPetStreetPresentation =
+      schemaPet.properties.pet_address.properties.street['x-jsf-presentation'];
+    expect(originalPetStreetPresentation).toBeDefined();
+
+    expect(result.schema).toMatchObject({
+      properties: {
+        pet_age: {
+          'x-jsf-presentation': {
+            ...originalPetAgePresentation,
+            'data-foo': 123,
+          },
+        },
+        pet_address: {
+          properties: {
+            street: {
+              'x-jsf-presentation': {
+                ...originalPetStreetPresentation,
+                'data-foo': 456,
+              },
+            },
+          },
+        },
+      },
+    });
+  });
+});
+
+const schemaTickets = {
+  properties: {
+    age: {
+      title: 'Age',
+      type: 'integer',
+    },
+    quantity: {
+      title: 'Quantity',
+      type: 'integer',
+    },
+    has_premium: {
+      title: 'Has premium',
+      type: 'string',
+    },
+    premium_id: {
+      title: 'Premium ID',
+      type: 'boolean',
+    },
+    reason: {
+      title: 'Why not premium?',
+      type: 'string',
+    },
+  },
+  'x-jsf-order': ['age', 'quantity', 'has_premium', 'premium_id', 'reason'],
+  allOf: [
+    {
+      // Empty conditional to sanity test empty cases
+      if: {},
+      then: {},
+      else: {},
+    },
+    // Create two conditionals to test both get matched
+    {
+      if: {
+        has_premium: {
+          const: 'yes',
+        },
+        required: ['has_premium'],
+      },
+      then: {
+        required: ['premium_id'],
+      },
+      else: {},
+    },
+    {
+      if: {
+        properties: {
+          has_premium: {
+            const: 'no',
+          },
+        },
+        required: ['has_premium'],
+      },
+      then: {
+        properties: {
+          reason: false,
+        },
+      },
+      else: {},
+    },
+  ],
+};
+
+describe('modify() - reoder fields', () => {
+  it('reorder fields - basic usage', () => {
+    const baseExample = {
+      properties: {
+        /* does not matter */
+      },
+      'x-jsf-order': ['field_a', 'field_b', 'field_c', 'field_d'],
+    };
+    const result = modify(baseExample, {
+      orderRoot: ['field_c', 'field_b'],
+    });
+
+    // 💡 Note how the missing field (field_d) was added to the end as safety measure.
+    expect(result.schema).toMatchObject({
+      'x-jsf-order': ['field_c', 'field_b', 'field_a', 'field_d'],
+    });
+
+    expect(result.warnings).toMatchObject([
+      {
+        type: 'ORDER_MISSING_FIELDS',
+        message:
+          'Some fields got forgotten in the new order. They were automatically appended: field_a, field_d',
+      },
+    ]);
+  });
+
+  it('reorder fields - basic usage fallback', () => {
+    const baseExample = {
+      properties: {
+        /* does not matter */
+      },
+    };
+    const result = modify(baseExample, {
+      orderRoot: ['field_c', 'field_b'],
+    });
+
+    // Does not explode if it doesn't have an original order.
+    expect(result.schema).toMatchObject({
+      'x-jsf-order': ['field_c', 'field_b'],
+    });
+
+    expect(result.warnings).toEqual([]);
+  });
+
+  it('reorder fields -  as callback based on original order', () => {
+    const baseExample = {
+      properties: {
+        /* does not matter */
+      },
+      'x-jsf-order': ['field_a', 'field_b', 'field_c', 'field_d'],
+    };
+    const result = modify(baseExample, {
+      orderRoot: (original) => original.reverse(),
+    });
+
+    expect(result.schema).toMatchObject({
+      'x-jsf-order': ['field_d', 'field_c', 'field_b', 'field_a'],
+    });
+  });
+
+  it('reorder fields in fieldsets (through config.fields)', () => {
+    // NOTE: A better API is needed but we decided to not implement it yet
+    // as we didn't agreed on the best DX. Check PR #78 for proposed APIs.
+    // Until then this is the workaround.
+    // Note the warning "ORDER_MISSING_FIELDS" won't be added.
+
+    const baseExample = {
+      properties: {
+        address: {
+          properties: {
+            /* does not matter */
+          },
+          'x-jsf-order': ['first_line', 'zipcode', 'city'],
+        },
+        age: {
+          /* ... */
+        },
+      },
+      'x-jsf-order': ['address', 'age'],
+    };
+
+    const result = modify(baseExample, {
+      fields: {
+        address: (attrs) => {
+          // eslint-disable-next-line no-unused-vars
+          const [_firstLine, ...restOrder] = attrs['x-jsf-order'];
+          return { 'x-jsf-order': restOrder.reverse() }; // ['city', 'zipcode']
+        },
+      },
+    });
+
+    expect(result.schema).toMatchObject({
+      properties: {
+        address: {
+          // Note how first_line was NOT appended
+          'x-jsf-order': ['city', 'zipcode'],
+        },
+      },
+    });
+  });
+});
+
+describe('modify() - create fields', () => {
+  it('create base field', () => {
+    const result = modify(schemaAddress, {
+      create: {
+        new_field: {
+          title: 'New field',
+          type: 'string',
+        },
+        address: {
+          someAttr: 'foo',
+        },
+      },
+    });
+
+    expect(result.schema).toMatchObject({
+      properties: {
+        new_field: {
+          title: 'New field',
+          type: 'string',
+        },
+        address: schemaAddress.properties.address,
+      },
+    });
+
+    // this is ignored because the field already exists
+    expect(result.schema.properties.address.someAttr).toBe(undefined);
+
+    expect(result.warnings).toEqual([
+      {
+        type: 'FIELD_TO_CREATE_EXISTS',
+        message: 'Creating field "address" was ignored because it already exists.',
+      },
+    ]);
+  });
+
+  it('create nested field', () => {
+    const result = modify(schemaAddress, {
+      create: {
+        // Pointer as string
+        'address.state': {
+          title: 'State',
+        },
+        // Pointer as object
+        address: {
+          someAttr: 'foo',
+          properties: {
+            district: {
+              title: 'District',
+            },
+          },
+        },
+        // Ignore field street because the field already exists [1]
+        'address.street': {
+          title: 'Foo',
+        },
+      },
+    });
+
+    expect(result.schema.properties.address.properties).toMatchObject({
+      ...schemaAddress.properties.address.properties,
+      state: {
+        title: 'State',
+      },
+      district: {
+        title: 'District',
+      },
+    });
+
+    // Ignore address.someAttr because the address itself already exists.
+    expect(result.schema.properties.address.someAttr).toBeUndefined();
+
+    // Ignore field street because it already exists [1]
+    expect(result.schema.properties.address.properties.street.title).toBe('Street');
+
+    expect(result.warnings).toEqual([
+      {
+        type: 'FIELD_TO_CREATE_EXISTS',
+        message: 'Creating field "address" was ignored because it already exists.',
+      },
+      {
+        type: 'FIELD_TO_CREATE_EXISTS',
+        message: 'Creating field "address.street" was ignored because it already exists.',
+      },
+    ]);
+  });
+});
+
+describe('modify() - pick fields', () => {
+  it('basic usage', () => {
+    const { schema, warnings } = modify(schemaTickets, {
+      pick: ['quantity'],
+    });
+
+    // Note how the other fields got removed from
+    // from the root properties, the "order" and "allOf".
+    expect(schema.properties).toEqual({
+      quantity: {
+        title: 'Quantity',
+        type: 'integer',
+      },
+    });
+    expect(schema.properties.age).toBeUndefined();
+    expect(schema.properties.has_premium).toBeUndefined();
+    expect(schema.properties.premium_id).toBeUndefined();
+
+    expect(schema['x-jsf-order']).toEqual(['quantity']);
+    expect(schema.allOf).toEqual([]); // conditional got removed.
+
+    expect(warnings).toHaveLength(0);
+  });
+
+  it('related conditionals are kept - (else)', () => {
+    const { schema, warnings } = modify(schemaTickets, {
+      pick: ['has_premium'],
+    });
+
+    expect(schema).toMatchObject({
+      properties: {
+        has_premium: {
+          title: 'Has premium',
+        },
+        premium_id: {
+          title: 'Premium ID',
+        },
+        reason: {
+          title: 'Why not premium?',
+        },
+      },
+      allOf: [schemaTickets.allOf[1], schemaTickets.allOf[2]],
+    });
+
+    expect(schema.properties.quantity).toBeUndefined();
+    expect(schema.properties.age).toBeUndefined();
+    expect(warnings).toEqual([
+      {
+        type: 'PICK_MISSED_FIELD',
+        message:
+          'The picked fields are in conditionals that refeer other fields. They added automatically: "premium_id", "reason". Check "meta" for more details.',
+        meta: { premium_id: { path: 'allOf[1].then' }, reason: { path: 'allOf[2].then' } },
+      },
+    ]);
+  });
+
+  it('related conditionals are kept - (if)', () => {
+    const { schema, warnings } = modify(schemaTickets, {
+      pick: ['premium_id'],
+    });
+
+    expect(schema).toMatchObject({
+      properties: {
+        has_premium: {
+          title: 'Has premium',
+        },
+        premium_id: {
+          title: 'Premium ID',
+        },
+      },
+      allOf: [schemaTickets.allOf[0]],
+    });
+
+    expect(schema.properties.quantity).toBeUndefined();
+    expect(schema.properties.age).toBeUndefined();
+    expect(warnings).toEqual([
+      {
+        type: 'PICK_MISSED_FIELD',
+        message:
+          'The picked fields are in conditionals that refeer other fields. They added automatically: "has_premium". Check "meta" for more details.',
+        meta: { has_premium: { path: 'allOf[1].if' } },
+      },
+    ]);
+  });
+
+  it('reorder only handles the picked fields', () => {
+    const { schema, warnings } = modify(schemaTickets, {
+      pick: ['age', 'quantity'],
+      orderRoot: (original) => original.reverse(),
+    });
+
+    // The order only includes those 2 fields
+    expect(schema['x-jsf-order']).toEqual(['quantity', 'age']);
+    // There are no warnings about forgotten fields.
+    expect(warnings).toHaveLength(0);
+
+    // Sanity check the result
+    expect(schema.properties.quantity).toBeDefined();
+    expect(schema.properties.age).toBeDefined();
+    expect(schema.properties.has_premium).toBeUndefined();
+    expect(schema.properties.premium_id).toBeUndefined();
+    expect(schema.allOf).toEqual([]);
+  });
+
+  // For later on when needed.
+  it.todo('ignore conditionals with unpicked fields');
+
+  it.todo('pick nested fields (fieldsets)');
+  /* Use cases:
+      - conditionals inside fieldstes. eg properties.family.allOf[0].if...
+      - conditional in the root pointing to nested fields: eg if properties.family.properties.simblings is 0 then hide properties.playTogether ...
+      - variations of each one of these similar to the existing tests.
+      */
 });