Nativescript: Inconsistent text-transform: capitalize behaviour

Created on 22 Mar 2019  路  3Comments  路  Source: NativeScript/NativeScript

Environment

  • CLI: 5.2
  • Cross-platform modules: 5.2.2
  • Android Runtime: 5.2.0
  • iOS Runtime: 5.2.1

Describe the bug

When using text-transform: capitalize on label/text/button/etc. UI elements, the behaviour on iOS and Android inconsistent and wrong on Android.

On Android, the source string is split on " " (space) to get an array of words, then each word gets lower-cased(!), then the first character of each word gets upper-cased.

On iOS, a platform native function is used which which uses a different/hidden implementation.

To Reproduce

<Label text="this is kind-Of-Magic - or a bUG?" style="text-transform: capitalize"></Label>

This produces

  • on iOS: This Is Kind-Of-Magic - Or A Bug?
  • on Android: This Is Kind-of-magic - Or A Bug?

Expected behavior
I would expect the display of This Is Kind-Of-Magic - Or A BUG?

Sample project
https://play.nativescript.org/?template=play-tsc&id=pb9SJ0&v=6


Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

backlog bug css good first issue android

Most helpful comment

I'm currently working on it. Just having some issues with tests.

All 3 comments

@lambourn marking this one as a bug as it looks like that the splitting words on Android is not cognitive enough to recognize different ones when a dash is used.

@NickIliev agreed. Even the iOS implementation does not produce what I would expect as it also does automatic lower-case on the last word (Bug vs BUG) - but that's due to the underlying NSString implementation. But here I think the Android implementation should produce the same as on iOS.

I'm currently working on it. Just having some issues with tests.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

yclau picture yclau  路  3Comments

NordlingDev picture NordlingDev  路  3Comments

vtisnado picture vtisnado  路  3Comments

guillaume-roy picture guillaume-roy  路  3Comments

rLoka picture rLoka  路  3Comments