Fixed preact errors regarding `contentEditable`

This commit is contained in:
jos 2016-08-05 11:21:16 +02:00
parent 4baa98c961
commit 7f6e7459df
3 changed files with 13 additions and 13 deletions

View File

@ -53,7 +53,6 @@ export default class JSONNode extends Component {
this.renderExpandButton(), this.renderExpandButton(),
this.renderContextMenuButton(), this.renderContextMenuButton(),
this.renderProperty(path, data, options), this.renderProperty(path, data, options),
this.renderSeparator(), // TODO: remove separator for Object and Array (gives an issue in Preact)
this.renderReadonly(`{${childCount}}`, `Array containing ${childCount} items`) this.renderReadonly(`{${childCount}}`, `Array containing ${childCount} items`)
]) ])
] ]
@ -81,7 +80,6 @@ export default class JSONNode extends Component {
this.renderExpandButton(), this.renderExpandButton(),
this.renderContextMenuButton(), this.renderContextMenuButton(),
this.renderProperty(path, data, options), this.renderProperty(path, data, options),
this.renderSeparator(), // TODO: remove separator for Object and Array (gives an issue in Preact)
this.renderReadonly(`[${childCount}]`, `Array containing ${childCount} items`) this.renderReadonly(`[${childCount}]`, `Array containing ${childCount} items`)
]) ])
] ]
@ -105,7 +103,7 @@ export default class JSONNode extends Component {
renderJSONValue ({path, data, options}) { renderJSONValue ({path, data, options}) {
return h('li', {}, [ return h('li', {}, [
h('div', {class: 'jsoneditor-node'}, [ h('div', {class: 'jsoneditor-node'}, [
h('div', {class: 'jsoneditor-button-placeholder'}), h('div', {class: 'jsoneditor-button-placeholder', contentEditable: 'false'}),
this.renderContextMenuButton(), this.renderContextMenuButton(),
this.renderProperty(path, data, options), this.renderProperty(path, data, options),
this.renderSeparator(), this.renderSeparator(),
@ -115,7 +113,7 @@ export default class JSONNode extends Component {
} }
renderReadonly (text, title = null) { renderReadonly (text, title = null) {
return h('div', {class: 'jsoneditor-readonly', contentEditable: false, title}, text) return h('div', {class: 'jsoneditor-readonly', contentEditable: 'false', title}, text)
} }
renderProperty (path, data, options) { renderProperty (path, data, options) {
@ -153,7 +151,7 @@ export default class JSONNode extends Component {
} }
renderSeparator() { renderSeparator() {
return h('div', {class: 'jsoneditor-separator'}, ':') return h('div', {class: 'jsoneditor-separator', contentEditable: 'false'}, ':')
} }
renderValue (value) { renderValue (value) {
@ -163,7 +161,7 @@ export default class JSONNode extends Component {
return h('div', { return h('div', {
class: valueClass, class: valueClass,
contentEditable: true, contentEditable: 'true',
spellCheck: 'false', spellCheck: 'false',
onInput: this.handleChangeValue, onInput: this.handleChangeValue,
onClick: this.handleClickValue, onClick: this.handleClickValue,
@ -174,7 +172,7 @@ export default class JSONNode extends Component {
renderExpandButton () { renderExpandButton () {
const className = `jsoneditor-button jsoneditor-${this.props.data.expanded ? 'expanded' : 'collapsed'}` const className = `jsoneditor-button jsoneditor-${this.props.data.expanded ? 'expanded' : 'collapsed'}`
return h('div', {class: 'jsoneditor-button-container'}, return h('div', {class: 'jsoneditor-button-container', contentEditable: 'false'},
h('button', {class: className, onClick: this.handleExpand}) h('button', {class: className, onClick: this.handleExpand})
) )
} }
@ -183,7 +181,7 @@ export default class JSONNode extends Component {
const className = 'jsoneditor-button jsoneditor-contextmenu' + const className = 'jsoneditor-button jsoneditor-contextmenu' +
(this.props.data.contextMenu ? ' jsoneditor-visible' : '') (this.props.data.contextMenu ? ' jsoneditor-visible' : '')
return h('div', {class: 'jsoneditor-button-container'}, return h('div', {class: 'jsoneditor-button-container', contentEditable: 'false'},
this.props.data.contextMenu this.props.data.contextMenu
? this.renderContextMenu(this.props.data.contextMenu) ? this.renderContextMenu(this.props.data.contextMenu)
: null, : null,

View File

@ -47,8 +47,8 @@ export default class Main extends Component {
} }
render() { render() {
return h('div', {class: 'jsoneditor', onClick: this.handleHideContextMenu}, [ return h('div', {class: 'jsoneditor', contentEditable: 'false', onClick: this.handleHideContextMenu}, [
h('ul', {class: 'jsoneditor-list'}, [ h('ul', {class: 'jsoneditor-list', contentEditable: 'false'}, [
h(JSONNode, { h(JSONNode, {
data: this.state.data, data: this.state.data,
events: this.state.events, events: this.state.events,

View File

@ -20,6 +20,8 @@
const editor = jsoneditor(container, options); const editor = jsoneditor(container, options);
const json = { const json = {
'array': [1, 2, 3], 'array': [1, 2, 3],
'emptyArray': [],
'emptyObject': {},
'boolean': true, 'boolean': true,
'null': null, 'null': null,
'number': 123, 'number': 123,
@ -28,9 +30,9 @@
}; };
editor.set(json, { editor.set(json, {
name: 'myObject', name: 'myObject',
expand: function (path) { // expand: function (path) {
return true // return true
} // }
}); });
// set json // set json