Framework: Extract isEditableElement utility

editor/modes/visual-editor/index.js

@@ -20,6 +20,7 @@ import VisualEditorBlockList from './block-list';
 import PostTitle from '../../post-title';
 import { getBlockUids } from '../../selectors';
 import { clearSelectedBlock, multiSelect } from '../../actions';
+import { isEditableElement } from '../../utils/dom';
 
 class VisualEditor extends Component {
 	constructor() {
@@ -54,10 +55,8 @@ class VisualEditor extends Component {
 
 	onKeyDown( event ) {
 		const { uids } = this.props;
-		const isEditable = [ 'textarea', 'input', 'select' ].indexOf( document.activeElement.tagName.toLowerCase() ) !== -1
-			|| document.activeElement.isContentEditable;
 		if (
-			! isEditable &&
+			! isEditableElement( document.activeElement ) &&
 			( event.ctrlKey || event.metaKey ) &&
 			event.keyCode === CHAR_A
 		) {

editor/utils/dom.js

@@ -0,0 +1,13 @@
+
+/**
+ * Utility function to check whether the domElement provided is editable or not
+ * An editable element means we can type in it to edit its content
+ * This includes inputs and contenteditables
+ *
+ * @param  {DomElement} domElement  DOM Element
+ * @return {Boolean}                Whether the DOM Element is editable or not
+ */
+export function isEditableElement( domElement ) {
+	return [ 'textarea', 'input', 'select' ].indexOf( domElement.tagName.toLowerCase() ) !== -1
+		|| !! domElement.isContentEditable;
+}

editor/utils/test/dom.js

@@ -0,0 +1,35 @@
+/**
+ * External dependencies
+ */
+import { expect } from 'chai';
+
+/**
+ * Internal dependencies
+ */
+import { isEditableElement } from '../dom';
+
+describe.only( 'isEditableElement', () => {
+	it( 'should return false for non editable nodes', () => {
+		const div = document.createElement( 'div' );
+
+		expect( isEditableElement( div ) ).to.be.false();
+	} );
+
+	it( 'should return true for inputs', () => {
+		const input = document.createElement( 'input' );
+
+		expect( isEditableElement( input ) ).to.be.true();
+	} );
+
+	it( 'should return true for textareas', () => {
+		const textarea = document.createElement( 'textarea' );
+
+		expect( isEditableElement( textarea ) ).to.be.true();
+	} );
+
+	it( 'should return true for selects', () => {
+		const select = document.createElement( 'select' );
+
+		expect( isEditableElement( select ) ).to.be.true();
+	} );
+} );