diff --git a/CHANGES.md b/CHANGES.md
index 847761b084f..2eb0da46547 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -13,6 +13,7 @@ Fixed Issues:
* [#457](https://github.com/ckeditor/ckeditor-dev/issues/457): Fixed: Error thrown when deleting content from the editor with no selection.
* [#450](https://github.com/ckeditor/ckeditor-dev/issues/450): Fixed: [`CKEDITOR.filter`](http://docs.ckeditor.com/#!/api/CKEDITOR.filter) incorrectly transforms `margin` CSS property.
* [#478](https://github.com/ckeditor/ckeditor-dev/issues/478): Fixed: [Chrome] Error thrown by [Enter Key](http://ckeditor.com/addon/enterkey) plugin when pressing enter with no selection.
+* [#417](https://github.com/ckeditor/ckeditor-dev/issues/417): Fixed: [Table Resize](http://ckeditor.com/addon/tableresize) plugin throws an error when used with a table with only header or footer rows.
## CKEditor 4.7
diff --git a/plugins/tableresize/plugin.js b/plugins/tableresize/plugin.js
index 967d1bb389a..87c26993fc2 100644
--- a/plugins/tableresize/plugin.js
+++ b/plugins/tableresize/plugin.js
@@ -52,26 +52,29 @@
function buildTableColumnPillars( table ) {
var pillars = [],
pillarIndex = -1,
+ pillarHeight = 0,
+ pillarPosition = null,
rtl = ( table.getComputedStyle( 'direction' ) == 'rtl' );
- // Get the raw row element that cointains the most columns.
+ // Get the raw row element that contains the most columns.
var $tr = getMasterPillarRow( table );
- // Get the tbody element and position, which will be used to set the
- // top and bottom boundaries.
- var tbody = new CKEDITOR.dom.element( table.$.tBodies[ 0 ] ),
- pillarPosition = tbody.getDocumentPosition(),
- pillarHeight = tbody.$.offsetHeight;
+ // Sets pillar height and position based on given table element (head, body, footer).
+ function setPillarDimensions( nativeTableElement ) {
+ if ( nativeTableElement ) {
+ var tableElement = new CKEDITOR.dom.element( nativeTableElement );
+ pillarHeight += tableElement.$.offsetHeight;
- if ( table.$.tHead ) {
- var tHead = new CKEDITOR.dom.element( table.$.tHead );
- pillarPosition = tHead.getDocumentPosition();
- pillarHeight += tHead.$.offsetHeight;
+ if ( !pillarPosition ) {
+ pillarPosition = tableElement.getDocumentPosition();
+ }
+ }
}
- if ( table.$.tFoot ) {
- pillarHeight += table.$.tFoot.offsetHeight;
- }
+ // Table may contain only one of thead, tbody or tfoot elements so its existence should be checked (#417).
+ setPillarDimensions( table.$.tHead );
+ setPillarDimensions( table.$.tBodies[ 0 ] );
+ setPillarDimensions( table.$.tFoot );
if ( $tr ) {
// Loop thorugh all cells, building pillars after each one of them.
diff --git a/tests/plugins/tableresize/manual/footeronly.html b/tests/plugins/tableresize/manual/footeronly.html
new file mode 100644
index 00000000000..198216ade82
--- /dev/null
+++ b/tests/plugins/tableresize/manual/footeronly.html
@@ -0,0 +1,19 @@
+
+
+
diff --git a/tests/plugins/tableresize/manual/footeronly.md b/tests/plugins/tableresize/manual/footeronly.md
new file mode 100644
index 00000000000..02213160fa6
--- /dev/null
+++ b/tests/plugins/tableresize/manual/footeronly.md
@@ -0,0 +1,12 @@
+@bender-ui: collapsed
+@bender-tags: bug, 4.7.1, 417
+@bender-ckeditor-plugins: wysiwygarea, toolbar, table, tableresize
+
+1. Focus editor.
+2. Move mouse over the table.
+ * **Expected**: No error is thrown in the browser console.
+3. Try to resize one of the table columns.
+ * **Expected**: The cursor changes to horizontal resize cursor when hovering over table borders. It is possible to
+ resize table. The `column pillar` is visible while resizing table.
+
+**Unexpected**: An error in the browser console occurs. Not possible to resize table.
diff --git a/tests/plugins/tableresize/manual/headeronly.html b/tests/plugins/tableresize/manual/headeronly.html
new file mode 100644
index 00000000000..e6ed398daf8
--- /dev/null
+++ b/tests/plugins/tableresize/manual/headeronly.html
@@ -0,0 +1,19 @@
+
+
+
diff --git a/tests/plugins/tableresize/manual/headeronly.md b/tests/plugins/tableresize/manual/headeronly.md
new file mode 100644
index 00000000000..02213160fa6
--- /dev/null
+++ b/tests/plugins/tableresize/manual/headeronly.md
@@ -0,0 +1,12 @@
+@bender-ui: collapsed
+@bender-tags: bug, 4.7.1, 417
+@bender-ckeditor-plugins: wysiwygarea, toolbar, table, tableresize
+
+1. Focus editor.
+2. Move mouse over the table.
+ * **Expected**: No error is thrown in the browser console.
+3. Try to resize one of the table columns.
+ * **Expected**: The cursor changes to horizontal resize cursor when hovering over table borders. It is possible to
+ resize table. The `column pillar` is visible while resizing table.
+
+**Unexpected**: An error in the browser console occurs. Not possible to resize table.
diff --git a/tests/plugins/tableresize/tableresize.html b/tests/plugins/tableresize/tableresize.html
index 0f863346970..5f832fc3528 100644
--- a/tests/plugins/tableresize/tableresize.html
+++ b/tests/plugins/tableresize/tableresize.html
@@ -51,3 +51,23 @@ Foo
+
+
+
+
diff --git a/tests/plugins/tableresize/tableresize.js b/tests/plugins/tableresize/tableresize.js
index af2a738aafb..ba8666262c3 100644
--- a/tests/plugins/tableresize/tableresize.js
+++ b/tests/plugins/tableresize/tableresize.js
@@ -259,6 +259,48 @@ bender.test( {
}
} );
+ wait();
+ },
+
+ // #417
+ 'test resizing table with thead only': function() {
+ var editor = this.editors.classic2,
+ editable = editor.editable();
+
+ editor.setData( CKEDITOR.document.findOne( '#headeronly' ).getOuterHtml(), {
+
+ callback: function() {
+ resume( function() {
+ editor.document.fire( 'mousemove', new CKEDITOR.dom.event( {
+ target: editable.findOne( 'table' ).$
+ } ) );
+
+ assert.pass();
+ } );
+ }
+ } );
+
+ wait();
+ },
+
+ // #417
+ 'test resizing table with tfoot only': function() {
+ var editor = this.editors.classic2,
+ editable = editor.editable();
+
+ editor.setData( CKEDITOR.document.findOne( '#footeronly' ).getOuterHtml(), {
+
+ callback: function() {
+ resume( function() {
+ editor.document.fire( 'mousemove', new CKEDITOR.dom.event( {
+ target: editable.findOne( 'table' ).$
+ } ) );
+
+ assert.pass();
+ } );
+ }
+ } );
+
wait();
}
} );