@json-editor/json-editor 2.10.0 → 2.11.0

package/package.json

@@ -2,7 +2,7 @@
   "name": "@json-editor/json-editor",
   "title": "JSONEditor",
   "description": "JSON Schema based editor",
-  "version": "2.10.0",
+  "version": "2.11.0",
   "main": "dist/jsoneditor.js",
   "author": {
     "name": "Jeremy Dorn",

package/src/editors/multiple.js

@@ -1,7 +1,7 @@
 /* Multiple Editor (for when `type` is an array, also when `oneOf` is present) */
 import { AbstractEditor } from '../editor.js'
 import { Validator } from '../validator.js'
-import { extend, mergeDeep } from '../utilities.js'
+import { extend, mergeDeep, overwriteExistingProperties } from '../utilities.js'
 
 export class MultipleEditor extends AbstractEditor {
   register () {
@@ -62,7 +62,7 @@ export class MultipleEditor extends AbstractEditor {
       this.buildChildEditor(i)
     }
 
-    const currentValue = this.getValue()
+    let currentValue = this.getValue()
 
     this.type = i
 
@@ -72,6 +72,10 @@ export class MultipleEditor extends AbstractEditor {
       if (!editor) return
 
       if (this.type === type) {
+        if (this.keep_only_existing_values) {
+          currentValue = overwriteExistingProperties(editor.getValue(), currentValue)
+        }
+
         if (this.keep_values || this.if) editor.setValue(currentValue, true)
         editor.container.style.display = ''
       } else {
@@ -138,6 +142,10 @@ export class MultipleEditor extends AbstractEditor {
     if (typeof this.jsoneditor.options.keep_oneof_values !== 'undefined') this.keep_values = this.jsoneditor.options.keep_oneof_values
     if (typeof this.options.keep_oneof_values !== 'undefined') this.keep_values = this.options.keep_oneof_values
 
+    this.keep_only_existing_values = false
+    if (typeof this.jsoneditor.options.keep_only_existing_values !== 'undefined') this.keep_only_existing_values = this.jsoneditor.options.keep_only_existing_values
+    if (typeof this.options.keep_only_existing_values !== 'undefined') this.keep_only_existing_values = this.options.keep_only_existing_values
+
     if (this.schema.oneOf) {
       this.oneOf = true
       this.types = this.schema.oneOf
@@ -244,6 +252,10 @@ export class MultipleEditor extends AbstractEditor {
       this.validators[i] = new Validator(this.jsoneditor, schema, validatorOptions, this.defaults)
     })
 
+    this.jsoneditor.on('change', () => {
+      this.switchIf()
+    })
+
     this.switchEditor(0)
   }
 
@@ -253,7 +265,6 @@ export class MultipleEditor extends AbstractEditor {
       this.refreshHeaderText()
     }
 
-    this.switchIf()
     super.onChildEditorChange()
   }
 

package/src/utilities.js

@@ -126,3 +126,13 @@ export function mergeDeep (target, ...sources) {
 
   return mergeDeep(target, ...sources)
 }
+
+export function overwriteExistingProperties (obj1, obj2) {
+  Object.keys(obj2).forEach(function (key) {
+    if (key in obj1) {
+      obj1[key] = obj2[key]
+    }
+  })
+
+  return obj1
+}

package/tests/codeceptjs/constrains/if-then-else_test.js

@@ -68,23 +68,27 @@ Scenario('validate agaist if-then-else @if-then-else', async ({ I }) => {
   I.waitForElement('.je-ready')
 
   I.selectOption('[name="root[country]"]', 'America')
+  I.waitForElement('[name="root[postal_code]"]')
   I.fillField('[name="root[postal_code]"]', 'K1M 1M4')
   I.pressKey('Tab')
   I.waitForElement('.invalid-feedback')
   I.waitForText('Value must match the pattern [0-9]{5}(-[0-9]{4})?.')
 
   I.selectOption('[name="root[country]"]', 'Canada')
+  I.waitForElement('[name="root[postal_code]"]')
   I.fillField('[name="root[postal_code]"]', '10000')
   I.pressKey('Tab')
   I.waitForElement('.invalid-feedback')
   I.waitForText('Value must match the pattern [A-Z][0-9][A-Z] [0-9][A-Z][0-9].')
 
   I.selectOption('[name="root[country]"]', 'America')
+  I.waitForElement('[name="root[postal_code]"]')
   I.fillField('[name="root[postal_code]"]', '10000')
   I.pressKey('Tab')
   I.dontSee('.invalid-feedback')
 
   I.selectOption('[name="root[country]"]', 'Canada')
+  I.waitForElement('[name="root[postal_code]"]')
   I.fillField('[name="root[postal_code]"]', 'K1M 1M4')
   I.pressKey('Tab')
   I.dontSee('.invalid-feedback')
@@ -95,22 +99,26 @@ Scenario('validate agaist if-then @if-then-else', async ({ I }) => {
   I.waitForElement('.je-ready')
 
   I.selectOption('[name="root[country]"]', 'America')
+  I.waitForElement('[name="root[postal_code]"]')
   I.fillField('[name="root[postal_code]"]', 'K1M 1M4')
   I.pressKey('Tab')
   I.waitForElement('.invalid-feedback')
   I.waitForText('Value must match the pattern [0-9]{5}(-[0-9]{4})?.')
 
   I.selectOption('[name="root[country]"]', 'Canada')
+  I.waitForElement('[name="root[postal_code]"]')
   I.fillField('[name="root[postal_code]"]', '10000')
   I.pressKey('Tab')
   I.dontSee('.invalid-feedback')
 
   I.selectOption('[name="root[country]"]', 'America')
+  I.waitForElement('[name="root[postal_code]"]')
   I.fillField('[name="root[postal_code]"]', '10000')
   I.pressKey('Tab')
   I.dontSee('.invalid-feedback')
 
   I.selectOption('[name="root[country]"]', 'Canada')
+  I.waitForElement('[name="root[postal_code]"]')
   I.fillField('[name="root[postal_code]"]', 'K1M 1M4')
   I.pressKey('Tab')
   I.dontSee('.invalid-feedback')
@@ -121,22 +129,57 @@ Scenario('validate agaist if-else @if-then-else', async ({ I }) => {
   I.waitForElement('.je-ready')
 
   I.selectOption('[name="root[country]"]', 'America')
+  I.waitForElement('[name="root[postal_code]"]')
   I.fillField('[name="root[postal_code]"]', 'K1M 1M4')
   I.pressKey('Tab')
   I.dontSee('.invalid-feedback')
 
   I.selectOption('[name="root[country]"]', 'Canada')
+  I.waitForElement('[name="root[postal_code]"]')
   I.fillField('[name="root[postal_code]"]', '10000')
   I.pressKey('Tab')
   I.waitForElement('.invalid-feedback')
   I.waitForText('Value must match the pattern [A-Z][0-9][A-Z] [0-9][A-Z][0-9].')
 
   I.selectOption('[name="root[country]"]', 'America')
+  I.waitForElement('[name="root[postal_code]"]')
   I.fillField('[name="root[postal_code]"]', '10000')
   I.pressKey('Tab')
   I.dontSee('.invalid-feedback')
 
   I.selectOption('[name="root[country]"]', 'Canada')
+  I.waitForElement('[name="root[postal_code]"]')
+  I.fillField('[name="root[postal_code]"]', 'K1M 1M4')
+  I.pressKey('Tab')
+  I.dontSee('.invalid-feedback')
+})
+
+Scenario('validate agaist if-then-else when disabled fields are present in fields @if-then-else', async ({ I }) => {
+  I.amOnPage('if-then-else-disable-fields.html')
+  I.waitForElement('.je-ready')
+
+  I.selectOption('[name="root[country]"]', 'America')
+  I.waitForElement('[name="root[postal_code]"]')
+  I.fillField('[name="root[postal_code]"]', 'K1M 1M4')
+  I.pressKey('Tab')
+  I.waitForElement('.invalid-feedback')
+  I.waitForText('Value must match the pattern [0-9]{5}(-[0-9]{4})?.')
+
+  I.selectOption('[name="root[country]"]', 'Canada')
+  I.waitForElement('[name="root[postal_code]"]')
+  I.fillField('[name="root[postal_code]"]', '10000')
+  I.pressKey('Tab')
+  I.waitForElement('.invalid-feedback')
+  I.waitForText('Value must match the pattern [A-Z][0-9][A-Z] [0-9][A-Z][0-9].')
+
+  I.selectOption('[name="root[country]"]', 'America')
+  I.waitForElement('[name="root[postal_code]"]')
+  I.fillField('[name="root[postal_code]"]', '10000')
+  I.pressKey('Tab')
+  I.dontSee('.invalid-feedback')
+
+  I.selectOption('[name="root[country]"]', 'Canada')
+  I.waitForElement('[name="root[postal_code]"]')
   I.fillField('[name="root[postal_code]"]', 'K1M 1M4')
   I.pressKey('Tab')
   I.dontSee('.invalid-feedback')

package/tests/codeceptjs/core_test.js

@@ -170,6 +170,14 @@ Scenario('should validate against anyOf schemas and display single anyOf and edi
   I.dontSee('Property must be set.', '[data-schemapath="root.age"] .invalid-feedback')
 })
 
+Scenario('should keep only existent values @core @anyof @keep_only_existing_values', async ({ I }) => {
+  I.amOnPage('keep_only_existing_values.html')
+  I.waitForElement('.je-ready')
+  I.waitForValue('#value', '{"name":"Afred","surname":"hitchcock","zip":"12345"}')
+  I.selectOption('.je-switcher', 'object 2')
+  I.waitForValue('#value', '{"name":"Afred","surname":"hitchcock","other_zip":""}')
+})
+
 Scenario('should display anyOf and oneOf error messages in the correct places @848', async ({ I }) => {
   I.amOnPage('issues/issue-gh-848.html')
   I.selectOption('.je-switcher', 'Value, string')

package/tests/pages/if-then-else-disable-fields.html

@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8"/>
+    <title>If-Then-Else</title>
+    <script src="../../dist/jsoneditor.js"></script>
+    <link rel="stylesheet" id="theme-link" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
+    <link rel="stylesheet" id="iconlib-link" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
+</head>
+<body>
+
+<div class="container">
+    <div id='editor-container'></div>
+</div>
+
+<script>
+  var editorContainer = document.querySelector('#editor-container')
+  var schema = {
+    'type': 'object',
+    'properties': {
+      "id": {
+        "type": "string",
+        "format": "uuid",
+        "title": "ID"
+      },
+      'country': {
+        'type': 'string',
+        'default': 'America',
+        'enum': [
+          'America',
+          'Canada'
+        ]
+      },
+      'postal_code': {
+        'type': 'string'
+      }
+    },
+    'if': {
+      'properties': {
+        'country': {
+          'const': 'America'
+        }
+      }
+    },
+    'then': {
+      'properties': {
+        'postal_code': {
+          'pattern': '[0-9]{5}(-[0-9]{4})?'
+        }
+      }
+    },
+    'else': {
+      'properties': {
+        'postal_code': {
+          'pattern': '[A-Z][0-9][A-Z] [0-9][A-Z][0-9]'
+        }
+      }
+    }
+  }
+
+  var editor = new JSONEditor(editorContainer, {
+    schema: schema,
+    theme: 'bootstrap4',
+    iconlib: 'fontawesome'
+  })
+</script>
+
+</body>
+</html>

package/tests/pages/keep_only_existing_values.html

@@ -0,0 +1,80 @@
+<!DOCTYPE html>
+<html lang="de">
+<head>
+    <meta charset="utf-8"/>
+    <title>oneOf</title>
+    <link rel="stylesheet" id="theme-link" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
+    <link rel="stylesheet" id="iconlib-link" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
+    <script src="../../dist/jsoneditor.js"></script>
+</head>
+<body>
+
+<div class="container">
+    <label for="value">Value</label>
+    <textarea class="form-control" id="value" rows="12" style="font-size: 12px; font-family: monospace;"></textarea>
+    <button id="set-value">Set Value</button>
+    <div class='json-editor-container'></div>
+</div>
+
+<script>
+  var jsonEditorContainer = document.querySelector('.json-editor-container')
+  var value = document.querySelector('#value')
+  var setValue = document.querySelector('#set-value')
+  var schema = {
+    'anyOf': [
+      {
+        'type': 'object',
+        'properties': {
+          'name': {
+            'type': 'string',
+            "default": "Afred"
+          },
+          'surname': {
+            'type': 'string',
+            "default": "hitchcock"
+          },
+          'zip': {
+            'type': 'string',
+            "default": "12345"
+          }
+        }
+      },
+      {
+        'type': 'object',
+        'properties': {
+          'name': {
+            'type': 'string'
+          },
+          'surname': {
+            'type': 'string'
+          },
+          'other_zip': {
+            'type': 'string'
+          }
+        }
+      }
+    ]
+  }
+
+  var editor = new JSONEditor(jsonEditorContainer, {
+    schema: schema,
+    theme: 'bootstrap4',
+    show_errors: 'always',
+    iconlib: 'fontawesome5',
+    disable_collapse: true,
+    disable_edit_json: true,
+    disable_properties: true,
+    keep_only_existing_values: true
+  })
+
+  editor.on('change', function () {
+    value.value = JSON.stringify(editor.getValue())
+  })
+
+  setValue.addEventListener('click', function () {
+    editor.setValue(JSON.parse(value.value))
+  })
+</script>
+
+</body>
+</html>