CSS property value of 'opacity' is handled in pixels

[StarpTech]

Marko Version: 4.15.2

You can also try it in the online playground

Repro

<div style={ opacity: 1 }/>

Output

<div style="opacity:1px;"></div>

[DylanPiercey]

Currently we automatically (and blindly) cast all numbers in the style object as pixels. The main reason for this is to avoid creating a map of values that should be in px vs not since this would increase the bundle size.

In any case I think it is acceptable that the opt out is simply to use strings in the styles eg <div style={ opacity: "1" }/>. However it might make sense to show warnings in development.

cc @mlrawlings

[tigt]

I would rather Marko not cast integers to pixels at all:

• Pixels aren’t great practice in CSS: rems, ems, and percentages are preferred except for certain properties (like borders). I’m not banning pixels, but they shouldn’t be the convenient path — not more convenient than the flexible units, at least.

• Not treating units specially would align Marko more with vanilla CSSOM code, which will only get more relevant with Houdini, custom properties, TypedOM, etc.