Add more comment field shortcuts (refined-github#961)

source/features/add-keyboard-shortcuts-to-comment-fields.js

@@ -30,6 +30,21 @@ function indentInput(el) {
 	}
 }
 
+// Element.blur() will reset the tab focus to the start of the document.
+// This places it back next to the blurred field
+function blurAccessibly(field) {
+	field.blur();
+
+	const range = new Range();
+	const selection = getSelection();
+	const focusHolder = new Text();
+	field.after(focusHolder);
+	range.selectNodeContents(focusHolder);
+	selection.removeAllRanges();
+	selection.addRange(range);
+	focusHolder.remove();
+}
+
 export default function () {
 	delegate('.js-comment-field', 'keydown', event => {
 		const field = event.target;
@@ -49,10 +64,24 @@ export default function () {
 				event.preventDefault();
 			}
 		} else if (event.key === 'Escape') {
-			const cancelButton = select('.js-hide-inline-comment-form', field.form);
+			const inlineCancelButton = select('.js-hide-inline-comment-form', field.form);
+
+			// Cancel comment if inline, blur the field if it's a regular comment
+			if (field.value === '') {
+				blurAccessibly(field);
+			} else if (inlineCancelButton) {
+				inlineCancelButton.click();
+			}
+		} else if (event.key === 'ArrowUp' && field.id === 'new_comment_field' && field.value === '') {
+			const lastOwnComment = select.all(`.js-comment.current-user`).pop();
+
+			if (lastOwnComment) {
+				select('.js-comment-edit-button', lastOwnComment).click();
 
-			if (field.value !== '' && cancelButton) {
-				cancelButton.click();
+				// Move caret to end of field
+				requestAnimationFrame(() => {
+					select('.js-comment-field', lastOwnComment).selectionStart = Number.MAX_SAFE_INTEGER;
+				});
 			}
 		}
 	});