fix: matching required paths with slashes

packages/core/src/mappers/renderer.ts

@@ -73,6 +73,7 @@ import {
   isVisible,
   Resolve,
   resolveSchema,
+  decode
 } from '../util';
 import {
   Translator,
@@ -114,7 +115,7 @@ const isRequired = (
   rootSchema: JsonSchema
 ): boolean => {
   const pathSegments = schemaPath.split('/');
-  const lastSegment = pathSegments[pathSegments.length - 1];
+  let lastSegment = pathSegments[pathSegments.length - 1];
   // Skip "properties", "items" etc. to resolve the parent
   const nextHigherSchemaSegments = pathSegments.slice(
     0,
@@ -127,6 +128,9 @@ const isRequired = (
     rootSchema
   );
 
+  // decode JSON Pointer escape sequences
+  lastSegment = decode(lastSegment);
+
   return (
     nextHigherSchema !== undefined &&
     nextHigherSchema.required !== undefined &&

packages/core/test/mappers/renderer.test.ts

@@ -1871,6 +1871,38 @@ test('mapStateToControlProps - i18n errors - custom keyword wins over all other
   t.is(props.errors, 'this is my error custom error message');
 });
 
+test('mapStateToControlProps - required is calculated correctly from encoded JSON Pointer', (t) => {
+  const uischema: ControlElement = {
+    type: 'Control',
+    scope: '#/properties/~1firstName',
+  };
+  const schema = {
+    type: 'object',
+    properties: {
+      '/firstName': { type: 'string' },
+    },
+    required: ['/firstName'],
+  };
+  const ownProps = {
+    visible: true,
+    uischema,
+    path: 'foo',
+    schema
+  };
+  const state = {
+    jsonforms: {
+      core: {
+        schema,
+        data: {},
+        uischema,
+        errors: [] as ErrorObject[],
+      },
+    },
+  };
+  const props = mapStateToControlProps(state, ownProps);
+  t.true(props.required === true);
+});
+
 test('mapStateToEnumControlProps - i18n - should not crash without i18n', (t) => {
   const ownProps = {
     uischema: coreUISchema,