Make tableCell represent both <td> and <th>

Adding a 'style' attribute which is set to either 'data' or 'header'

This breaks even more tests because of missing style attributes

Change-Id: I0a75d8c1578b4414eeae8c484f6c4d6f8a59472a

modules/ve2/ce/nodes/ve.ce.TableCellNode.js

@@ -8,7 +8,12 @@
  */
 ve.ce.TableCellNode = function( model ) {
 	// Inheritance
-	ve.ce.BranchNode.call( this, 'tableCell', model, $( '<td></td>' ) );
+	ve.ce.BranchNode.call(
+		this, 'tableCell', model, ve.ce.BranchNode.getDomWrapper( model, 'style' )
+	);
+
+	// Events
+	this.model.addListenerMethod( this, 'update', 'onUpdate' );
 };
 
 /* Static Members */
@@ -24,6 +29,30 @@ ve.ce.TableCellNode.rules = {
 	'canBeSplit': false
 };
 
+/**
+ * Mapping of list item style values and DOM wrapper element types.
+ *
+ * @static
+ * @member
+ */
+ve.ce.TableCellNode.domWrapperElementTypes = {
+	'data': 'td',
+	'heading': 'th'
+};
+
+/* Methods */
+
+/**
+ * Responds to model update events.
+ *
+ * If the style changed since last update the DOM wrapper will be replaced with an appropriate one.
+ *
+ * @method
+ */
+ve.ce.TableCellNode.prototype.onUpdate = function() {
+	this.updateDomWrapper( 'style' );
+};
+
 /* Registration */
 
 ve.ce.nodeFactory.register( 'tableCell', ve.ce.TableCellNode );

modules/ve2/dm/nodes/ve.dm.TableCellNode.js

@@ -37,12 +37,18 @@ ve.dm.TableCellNode.rules = {
  * @member
  */
 ve.dm.TableCellNode.converters = {
-	'domElementTypes': ['td'],
+	'domElementTypes': ['td', 'th'],
 	'toDomElement': function( type, element ) {
-		return document.createElement( 'td' );
+		return element.attributes && ( {
+			'data': document.createElement( 'td' ),
+			'header': document.createElement( 'th' )
+		} )[element.attributes['style']];
 	},
 	'toDataElement': function( tag, element ) {
-		return { 'type': 'tableCell' };
+		return ( {
+			'td': { 'type': 'tableCell', 'attributes': { 'style': 'data' } },
+			'th': { 'type': 'tableCell', 'attributes': { 'style': 'header' } }
+		} )[tag];
 	}
 };
 

tests/ve2/dm/ve.dm.example.js

@@ -77,7 +77,7 @@ ve.dm.example.data = [
 	//  6 - Beginning of row
 	{ 'type': 'tableRow' },
 	//  7 - Beginning of cell
-	{ 'type': 'tableCell' },
+	{ 'type': 'tableCell', 'attributes': { 'style': 'data' } },
 	//  8 - Beginning of paragraph
 	{ 'type': 'paragraph' },
 	//  9 - Plain "d"
@@ -254,7 +254,7 @@ ve.dm.example.tree = new ve.dm.DocumentNode( [
 						new ve.dm.ParagraphNode( [new ve.dm.TextNode( 1 )] )
 					] )
 				], ve.dm.example.data[25].attributes )
-			] )
+			], ve.dm.example.data[7].attributes )
 		] )
 	] ),
 	// Preformatted with "h[image.png]i"
@@ -475,7 +475,7 @@ ve.dm.example.conversions = {
 	},
 	'tableCell': {
 		'domElement': ve.example.createDomElement( 'td' ),
-		'dataElement': { 'type': 'tableCell' }
+		'dataElement': { 'type': 'tableCell', 'attributes': { 'style': 'data' } }
 	},
 	'table': {
 		'domElement': ve.example.createDomElement( 'table' ),