Ticket #4809 (closed Bug: fixed)

Opened 5 years ago

Last modified 15 months ago

Table caption tag is output in wrong place

Reported by: pomu0325 Owned by: garry.yao
Priority: Normal Milestone: CKEditor 3.5.3
Component: Core : Tables Version: 3.0.1
Keywords: Cc: pomu@…

Description

<caption> is output after <thead>. Seems to be the same issue with #2874. Occurs with IE and FF. Chrome seems to work fine.

To Reproduce

  • Insert new table with <th> and caption using table dialog.
  • Switch to source mode.
    <table border="1" cellpadding="1" cellspacing="1" style="width: 200px">
    	<thead>
    		<tr>
    			<th scope="col">
    				&nbsp;</th>
    			<th scope="col">
    				&nbsp;</th>
    		</tr>
    	</thead>
    	<caption>
    		foo</caption>
    	<tbody>
    		<tr>
    			<td>
    				&nbsp;</td>
    			<td>
    				&nbsp;</td>
    		</tr>
    		<tr>
    			<td>
    				&nbsp;</td>
    			<td>
    				&nbsp;</td>
    		</tr>
    	</tbody>
    </table>
    

Attachments

4809.patch (722 bytes) - added by pomu0325 5 years ago.
I know it's a bit forcible way but it worked with IE/FF/Chrome
4809_2.patch (1.2 KB) - added by garry.yao 4 years ago.

Change History

Changed 5 years ago by pomu0325

I know it's a bit forcible way but it worked with IE/FF/Chrome

comment:1 Changed 5 years ago by alfonsoml

  • Keywords Confirmed HasPatch added

comment:2 Changed 4 years ago by fredck

#5142 has been marked as DUP.

comment:3 Changed 4 years ago by jorgeoa

Will the bug be solved in any oficial release of CKEditor? It's a bit tedious have to change it every time you update the editor.

comment:4 Changed 4 years ago by wwalc

  • Milestone set to CKEditor 3.5.2

comment:5 Changed 4 years ago by wwalc

  • Component changed from General to Core : Tables

Changed 4 years ago by garry.yao

comment:6 Changed 4 years ago by garry.yao

  • Status changed from confirmed to review
  • Keywords HasPatch removed
  • Owner set to garry.yao

comment:7 Changed 4 years ago by jorgeoa

Hi.

Thank you for the patch, but there is a small mistake in the order of the TFOOT and TBODY elements.

According to the HTML specification, TFOOT have to appears before TBODY in the source code, otherwise the generated code will have validation errors.

http://www.w3.org/TR/html401/struct/tables.html#h-11.2.3

comment:8 Changed 3 years ago by Saare

  • Status changed from review to review_passed

Make sure to update the code according to @jorgeoa's comment above.

comment:9 Changed 3 years ago by garry.yao

  • Status changed from review_passed to closed
  • Resolution set to fixed

Fixed with [6431], thanks for jorgeoa's remind.

comment:10 Changed 2 years ago by cwall

Are we sure the logic for this patch is correct? (Source edited w/ http://dev.ckeditor.com/changeset/6544.) Yes, tags are ordered according to tableOrder, but same-named tags are re-ordered unintentionally.

Path source:

return node1.type == CKEDITOR.NODE_ELEMENT && node2.type == node1.type ? 
    CKEDITOR.tools.indexOf( tableOrder, node1.name )  > 
        CKEDITOR.tools.indexOf( tableOrder, node2.name ) ? 1 : -1 : 0;

For example, with this logic and the given the following source:

<table>
    <colgroup id="B">
    </colgroup>
    <colgroup id="A">
    </colgroup>
    <caption id="B">
    </caption>
    <caption id="A">
    </caption>
...
</table>

Results in:

<table>
    <caption id="A">
    </caption>
    <caption id="B">
    </caption>
    <colgroup id="A">
    </colgroup>
    <colgroup id="B">
    </colgroup>	
...
</table>

Note that the caption tag ordering was changed to before colgroup, but the ordering of the caption and colgroup tags changed relative to their peer. This changes the style applied to each column.

This logic works:

if (node1.type == CKEDITOR.NODE_ELEMENT && node2.type == node1.type) {
	var idx1 = CKEDITOR.tools.indexOf( tableOrder, node1.name );
	var idx2 = CKEDITOR.tools.indexOf( tableOrder, node2.name );
	if (idx1 > idx2) {
		return 1;
	} else if (idx1 < idx2) {
		return -1
	}
}

return 0;

comment:11 Changed 15 months ago by j.swiderski

@cwall please note that only one caption is allowed per table and it should be inserted right after table tag (http://www.w3schools.com/tags/tag_caption.asp). Fixing the code to:

<table border="1">
	<caption id="A">
		aa</caption>
	<colgroup id="B">
		<col style="background-color:red" />
	</colgroup>
	<colgroup id="A">
		<col style="background-color:yellow" />
	</colgroup>
	<tbody>
		<tr>
			<th>
				ISBN</th>
			<th>
				Title</th>
		</tr>
		<tr>
			<td>
				3476896</td>
			<td>
				My first HTML</td>
		</tr>
	</tbody>
</table>

and checking it in latest CKEditor 3.6.6.1 or 4.1.1 resulted in no reordering so i think logic is correct. If I have missed anything please leave a comment.

Note: See TracTickets for help on using tickets.
© 2003 – 2012 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy