Skip to content

isRequired encoded scope paths with slashes not properly matched #2366

@adamskeeled

Description

@adamskeeled

Describe the bug

Consider the following schema:

{
  "type": "object",
  "unevaluatedProperties": false,
  "properties": {
      "/work/email": {
          "title": "Email with slash",
          "description": "Email address With Slash",
          "type": "string",
          "format": "email"
      }
  },
  "required": [
      "/work/email"
  ],
}

Since the path(/work/email) contains a forward slash, the final encoded scope looks a bit different (forward slashes get converted to ~1). When trying to check if the field is required, the most direct path is to use the required prop inside the control from mapStateToControlProps. However, since the path doesn't get decoded, it doesn't match with what is inside the global required.

Expected behavior

The scope path should be decoded and then matched against the required field

Steps to reproduce the issue

  1. Use the above schema
  2. Use any renderer which matches the above sub-schema and is using the control.required to show an asterisk for example
  3. Notice that the asterisk won't show up

Screenshots

No response

Which Version of JSON Forms are you using?

v3.3.0

Framework

Core

RendererSet

No response

Additional context

I believe I know where to implement a fix and can even create a PR to help do this.
In the isRequired function in the src/util/renderers.ts file, the decode needs to get imported and then used on the lastSegment before isRequired returns

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions