Style attribute object and lengths not handled properly

[ghost]

Hello

Bug Report

I was moving a div around the page with the mouse, then I got a weird behavior. I'm quite new with all this stuff but it looks like a bug.

Context

Marko template:
div style={position:'absolute',top:0} -- test
Rendering:
var bloc = require('./bloc');
bloc.renderSync().appendTo(document.body);

Expected Behavior

'top' property should be set to zero and the text should be displayed at the top of the page.

Actual Behavior

The value 0 for 'top' is ignored and the 'top' property is not set in the style (according to FF inspector). The text is displayed at the default position that depends on previous elements in body.

• No error message.
• Negative values are accepted and the position of the div is correct
• Same problem with 'left' property (not tested with other ones)
• Same problem when state is changed with code

Additional Info

Your Environment

• Version used: marko 4.2.0
• Environment name and version: node.js 6.10.0-win-x64 Firefox 52.0.2
• Operating System and version: Windows 10 desktop

[patrick-steele-idem]

That does indeed look like a bug. I'll investigate.

[patrick-steele-idem]

The following line looks like the problem:

marko/runtime/vdom/helper-styleAttr.js

Line 19 in 47d3fc3

if (value) {

If value === 0 then the if condition will not evaluate. Interested in submitting a Pull Request to fix the problem?

[patrick-steele-idem]

Actually, I'm going to go ahead and take this one. There are some other changes that I think need to be made.

[patrick-steele-idem]

New version published with fix: marko@4.2.2

Thanks for reporting the problem!

[ghost]

I surely could not have be so quick. I don't even know how I can test modified code… I may be more helpful in some days/weeks.
Many thanks.