Fix writing-mode for Chrome/any WebKit except Safari

[AleshaOleg]

This one need to be checked because only Safari, should be prefixed.

[kof]

Can we feature test that somehow?

[AleshaOleg]

@kof i will fix tests firstly today. What you mean about "feature test" in this case?

[kof]

Feature test is a test that allows to detect support of a certain feature without sniffing on agent name.

[AleshaOleg]

@kod idk, detecting agent name is only way i know how to fix that. Because, even Chrome need to be prefixed on 47 version and less. As well as old Android Browser.

[kof]

What if we use https://developer.mozilla.org/en-US/docs/Web/API/CSS/supports where it is supported and prefix all others?

[kof]

It seems to be wildly implemented: https://caniuse.com/#feat=css-featurequeries

[AleshaOleg]

no support for IE:( It's actually Candidate Recommendation

[kof]

yes, but IE has no writing-mode support either, right?

[AleshaOleg]

partial support, as i understood.

[kof]

Another option: render some text and check if writing mode was correctly applied. Do it once and cache the result.

[AleshaOleg]

will it cause any UI problems? Why you don't like check simply check browser version?

[kof]

will it cause any UI problems?

No if you don't render it in a visible way.

Why you don't like check simply check browser version?

Browser version checks are fragile, we can't test in every possible browser version and we don't know if there are problems with future versions.

Browser sniffing is the worst thing you can do, always avoid if possible

[AleshaOleg]

ok, will try implement render some text later today.

[kof]

Also you can try CSS.supports, if there is no implementation, try render test.

[AleshaOleg]

CSS.supports('writing-mode', 'initial') for Safari 11, returns true. But it should be prefixed. So CSS.supports will not help us to detect if value should be prefixed.

[kof]

I see, it returns true even if the property is supported behind the vendor prefix.

[AleshaOleg]

Could you explain how you wanna check if property is applied correctly to element?

[AleshaOleg]

Hm, I have an idea. What if we usually will add three properties? Like:

-webkit-writing-mode: initial;
-ms-writing-mode: initial;
writing-mode: initial;

[kof]

we can't do that, API expects us to return one property. Also this is something user can easily do as well.

[AleshaOleg]

It seems, like Safari 11 should not be prefixed as we expected. I created issue, to fix this on caniuse website

https://github.com/Fyrd/caniuse/issues/3794

[kof]

merged