Skip to content

Uncaught SyntaxError when remounting a component with JsonForms and a rule in uischema #2215

@davewwww

Description

@davewwww

Describe the bug

I have a component that is mounted and unmounted by a toggle button. After mounting it 3 times (!!!), this error is thrown.

"Uncaught SyntaxError: Unexpected token ':'"

jsonforms.rule.error.mp4

image

This error only appears if the uischema has defined a rule.
And I can avoid this error by providing a global one-time initiated AJV.

Although this is probably an AJV issue, but i could not find any further information on why this is the case and what the best practice is for such behavior on mounted and unmounted formulars.

Expected behavior

I have built a small app with which the error can be reproduced: https://79dmkr-5173.csb.app/

if you turn the form on and off the first 2 times, nothing happens. only the third time the error appears

Steps to reproduce the issue

  1. Go to https://79dmkr-5173.csb.app/ or https://codesandbox.io/p/sandbox/loving-yonath-79dmkr
  2. Click 3 times on 'hide form'
  3. Open Developer Console
  4. See error

Screenshots

No response

In which browser are you experiencing the issue?

Google Chrome 118., Edge 118., Opera 104

Which Version of JSON Forms are you using?

v3.1.0

Framework

Vue 3

RendererSet

Vanilla

Additional context

Find the app here: https://79dmkr-5173.csb.app/ or https://codesandbox.io/p/sandbox/loving-yonath-79dmkr

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions