Fix checkbox behavior

Signed-off-by: Julius Härtl <jus@bitgrid.net>

1 files changed, 19 insertions, 7 deletions

diff --git a/src/nodes/ListItem.js b/src/nodes/ListItem.js
index 1962d4c71..96a03c95f 100644
--- a/src/nodes/ListItem.js
+++ b/src/nodes/ListItem.js
@@ -30,6 +30,12 @@ const TYPES = {
 	CHECKBOX: 1,
 }
 
+const getParentList = (schema, selection) => {
+	return findParentNode(function(node) {
+		return node.type === schema.nodes.list_item
+	})(selection)
+}
+
 export default class ListItem extends TiptapListItem {
 
 	get defaultOptions() {
@@ -104,17 +110,23 @@ export default class ListItem extends TiptapListItem {
 					const $from = selection.$from
 					const $to = selection.$to
 					const range = $from.blockRange($to)
-					const tr = state.tr
 
-					if (!range) {
-						return false
+					let tr = state.tr
+					let parentList = getParentList(schema, selection)
+
+					if (typeof parentList === 'undefined') {
+						toggleList(schema.nodes.bullet_list, type)(state, (_transaction) => {
+							tr = _transaction
+						}, view)
+						parentList = getParentList(schema, tr.selection)
 					}
 
-					const parentList = findParentNode(function(node) {
-						return node.type === schema.nodes.list_item
-					})(selection)
+					if (!range || typeof parentList === 'undefined') {
+						return false
+					}
 
 					tr.setNodeMarkup(parentList.pos, schema.nodes.list_item, { type: parentList.node.attrs.type === TYPES.CHECKBOX ? TYPES.BULLET : TYPES.CHECKBOX })
+					tr.scrollIntoView()
 
 					if (dispatch) {
 						dispatch(tr)
@@ -146,7 +158,7 @@ export default class ListItem extends TiptapListItem {
 						})(selection)
 
 						const isLabel = event.target.tagName.toLowerCase() === 'label'
-						if (parentList.node.attrs.type !== TYPES.CHECKBOX || !isLabel) {
+						if (typeof parentList === 'undefined' || parentList.node.attrs.type !== TYPES.CHECKBOX || !isLabel) {
 							return
 						}