diff --git a/src/components/TextMode.js b/src/components/TextMode.js index de1a326..fbb7f98 100644 --- a/src/components/TextMode.js +++ b/src/components/TextMode.js @@ -6,6 +6,12 @@ import { enrichSchemaError, limitErrors } from '../utils/schemaUtils' import { jsonToData, dataToJson, patchData } from '../jsonData' import ModeButton from './menu/ModeButton' +const AJV_OPTIONS = { + allErrors: true, + verbose: true, + jsonPointers: true +} + /** * TextMode * @@ -59,6 +65,7 @@ export default class TextMode extends Component { /** @protected */ renderMenu () { + // TODO: move Menu into a separate Component return h('div', {class: 'jsoneditor-menu'}, [ h('button', { class: 'jsoneditor-format', @@ -86,7 +93,7 @@ export default class TextMode extends Component { /** @protected */ renderSchemaErrors () { - // TODO: move the JSON Schema stuff into a separate Component? + // TODO: move the JSON Schema stuff into a separate Component try { // TODO: only validate again when json is changed since last validation @@ -99,8 +106,12 @@ export default class TextMode extends Component { const allErrors = this.state.compiledSchema.errors.map(enrichSchemaError) const limitedErrors = limitErrors(allErrors) - return h('table', {class: 'jsoneditor-text-errors'}, - h('tbody', {}, limitedErrors.map(TextMode.renderSchemaError)) + console.log('errors', allErrors) + + return h('div', { class: 'jsoneditor-errors'}, + h('table', {}, + h('tbody', {}, limitedErrors.map(TextMode.renderSchemaError)) + ) ) } else { @@ -126,7 +137,7 @@ export default class TextMode extends Component { static renderSchemaError (error) { const icon = h('input', {type: 'button', class: 'jsoneditor-schema-error'}) - if (error && error.data && error.schema) { + if (error && error.schema && error.schemaPath) { // this is an ajv error message return h('tr', {}, [ h('td', {}, icon), @@ -136,6 +147,7 @@ export default class TextMode extends Component { } else { // any other error message + console.log('error???', error) return h('tr', {}, h('td', {}, icon), h('td', {colSpan: 2}, h('code', {}, String(error))) @@ -150,8 +162,7 @@ export default class TextMode extends Component { */ setSchema (schema) { if (schema) { - const ajv = this.props.options.ajv || - Ajv && Ajv({ allErrors: true, verbose: true }) + const ajv = this.props.options.ajv || Ajv && Ajv(AJV_OPTIONS) if (!ajv) { throw new Error('Cannot validate JSON: ajv not available. ' + diff --git a/src/jsoneditor.less b/src/jsoneditor.less index 7401d90..9e78ac6 100644 --- a/src/jsoneditor.less +++ b/src/jsoneditor.less @@ -576,23 +576,26 @@ div.jsoneditor-code { /* JSON schema errors displayed at the bottom of the editor in mode text and code */ -.jsoneditor-text-errors { +.jsoneditor-errors { width: 100%; - border-collapse: collapse; background-color: #ffef8b; border-top: 1px solid #ffd700; - font-family: @fontFamily; - font-size: @fontSize; + table { + border-collapse: collapse; - td { - padding: 3px 6px; - vertical-align: middle; - } + font-family: @fontFamily; + font-size: @fontSize; - code { - display: block; - white-space: pre-wrap; + td { + padding: 3px 6px; + vertical-align: middle; + + code { + display: block; + white-space: pre-wrap; + } + } } .jsoneditor-schema-error {