Looking at the issue of style bindings and htmlt templates with exist…

…ing style attribute values.
UIZE · Mar 29, 2015 · 81edd2e · 81edd2e
1 parent 74ee98b
commit 81edd2e
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 0 deletions.
diff --git a/site-source/js/Uize/Test/Uize/Widget/HtmltCompiler.js b/site-source/js/Uize/Test/Uize/Widget/HtmltCompiler.js
@@ -901,6 +901,44 @@ Uize.module ({
 										'<div id="widget-foo" style="border-left-width:10px;"></div>' +
 									'</div>'
 								),
+								/*
+								_htmlBindingsTest (
+									'If state properties are bound to style properties of a node and those style properties already have values specified, then the style properties\' initial values are ignored and are replaced by the values from the state property bindings',
+									{
+										stateProperties:{
+											width:{value:'100%'},
+											height:{value:'100%'}
+										},
+										htmlBindings:{
+											width:'foo:style.width',
+											height:'foo:style.height'
+										}
+									},
+									'<div>' +
+										'<div id="foo" style="width:50%;height:50%;"></div>' +
+									'</div>',
+									'<div id="widget">' +
+										'<div id="widget-foo" style="width:100%;height:100%;"></div>' +
+									'</div>'
+								),
+								*/
+								_htmlBindingsTest (
+									'If a state property is bound to a style property of a node and that node already contains other style properties, those other style properties for which there are no bindings are retained',
+									{
+										stateProperties:{
+											foo:{value:'100%'}
+										},
+										htmlBindings:{
+											foo:'foo:style.width'
+										}
+									},
+									'<div>' +
+										'<div id="foo" style="left:0;top:0;"></div>' +
+									'</div>',
+									'<div id="widget">' +
+										'<div id="widget-foo" style="left:0;top:0;width:100%;"></div>' +
+									'</div>'
+								),
 								{
 									title:'Number type values for state properties are resolved to string values, with the "px" being appended in certain cases',
 									test:[

diff --git a/site-source/js/Uize/Widget/HtmltCompiler.js b/site-source/js/Uize/Widget/HtmltCompiler.js
@@ -321,6 +321,11 @@ Uize.module ({
 											_styleAttribute = _ensureNodeAttribute (_node,'style'),
 											_styleAttributeValue = _styleAttribute.value.value
 										;
+										/*
+											- TODO:
+												- parse style properties from the style attribute value, in order to remove style properties for which there are bindings
+												- re-serialize the existing style properties and update _styleAttributeValue
+										*/
 										_addAttributeValueReplacement (
 											_styleAttribute,
 											(_styleAttributeValue ? Uize.Json.to (_styleAttributeValue) + ' + ' : '') +