Updating tree mode value on enter key submits form

[javierjulio]

I'm using the original jsoneditor library exclusively within forms. I've been working on an upgrade to use this new library within those same forms and it has gone well. I'm enjoying the new version, thank you!

As reported in #274 which is now closed, I'm noticing the same issue with the tree mode. I'm creating a new issue since this is a bug and should be addressed but a reproduction was requested. The issue is easy to simulate.

Inputting the following in the HTML field of a new codepen reproduces the problem when editing the value in tree mode and hitting the enter key. It will submit the form and load the codepen.io home page.

<form novalidate="novalidate" action="/" accept-charset="UTF-8" method="get">
  <div id="jsoneditor"></div>
</form>

<script type="module">
  import { createJSONEditor } from 'https://cdn.jsdelivr.net/npm/vanilla-jsoneditor/standalone.js'

  const editor = createJSONEditor({
    target: document.getElementById('jsoneditor'),
    props: {
      content: {
        json: {
          greeting: 'Hello World'
        }
      }
    }
  })
</script>

Can this issue be fixed so editing in tree mode won't submit a form when its not desired or expected?

Is there a way to possibly intercept and disable that behavior on my side at least temporarily?

Another option I couldn't figure out in the docs, is it possible to disable the tree mode?

[josdejong]

Thanks for bringing this up. Apparently the form also sees pressing Enter in an editable div as a submit event, also can't find any documentation about that on MDN 🤔. I think we can fix that by adding a preventDefault to the editable div when Enter is pressed.

As a workaround: you can add a submit event listener to your own form and stop the submit there:

document.querySelector('form').addEventListener('submit', (event) => {
  event.preventDefault()
})

Though I'm not sure how to detect whether the submit originated inside the JSON editor or an other form element.

[josdejong]

I think I'll be able to push a fix this afternoon.

[josdejong]

Fixed now in v2.0.1

[javierjulio]

Thank you for the fix! I've tested the v2.0.1 release and it resolves the issue.