Using text-decoration in a template causes iOS app to crash

[tjvantoll]

In Groceries I attempted to add text-decoration: line-through to a <Label> element in an Angular template, and it works fine on Android, but causes the app to crash on iOS.

Here’s the stack trace:

May 23 14:52:38 VANTOLLMAC-7 sampleGroceries[24094]: -[__NSCFNumber length]: unrecognized selector sent to instance 0x7dd02280
May 23 14:52:38 VANTOLLMAC-7 sampleGroceries[24094]: *** JavaScript call stack:
    (
        0   initWithString@[native code]
        1   setTextDecorationAndTransform@file:///app/tns_modules/utils/utils.js:107:78
        2   setTextDecorationProperty@file:///app/tns_modules/ui/text-base/text-base-styler.js:31:48
        3   applyProperty@file:///app/tns_modules/ui/styling/style.js:1214:28
        4   _applyStyleProperty@file:///app/tns_modules/ui/styling/style.js:954:42
        5   @file:///app/tns_modules/ui/styling/style.js:871:103
        6   forEach@[native code]
        7   _endUpdate@file:///app/tns_modules/ui/styling/style.js:871:40
        8   applySelectors@file:///app/tns_modules/ui/styling/style-scope.js:191:30
        9   _applyStyleFromScope@file:///app/tns_modules/ui/core/view-common.js:861:29
        10  onLoaded@file:///app/tns_modules/ui/core/view-common.js:600:34
        11  onLoaded@file:///app/tns_modules/ui/label/label.js:68:39
        12  eachChild@file:///app/tns_modules/ui/core/view-common.js:606:31
        13  _eachChildView@file:///app/tns_modules/ui/layouts/layout-base-common.js:146:30
        14  _loadEachChildView@file:///app/tns_modules/ui/core/view-common.js:609:32
        15  onLoaded@file:///app/tns_modules/ui/core/view-common.js:599:32
        16  _addViewCore@file:///app/tns_modules/ui/core/view-common.js:925:26
        17  _addViewCore@file:///app/tns_modules/ui/core/view.js:64:43
        18  _addView@file:///app/tns_modules/ui/core/view-common.js:913:26
        19  _prepareCell@file:///app/tns_modules/ui/list-view/list-view.js:304:30
        20  tableViewCellForRowAtIndexPath@file:///app/tns_modules/ui/list-view/list-view.js:62:31
        21  UIApplicationMain@[native code]
        22  start@file:///app/tns_modules/application/application.js:233:26
        23  @file:///app/tns_modules/nativescript-angular/application.js:81:26
        24  ZoneAwarePromise@file:///app/tns_modules/zone.js/dist/zone-node.js:542:38
        25  nativeScriptBootstrap@file:///app/tns_modules/nativescript-angular/application.js:80:23
        26  anonymous@file:///app/main.js:6:36
        27  evaluate@[native code]
        28  moduleEvaluation@:1:11
        29  @:8:48
        30  promiseReactionJob@:1:11

You can recreate this in Groceries pretty easily:

• git clone https://github.com/NativeScript/sample-Groceries.git
• git checkout angular
• tns install
• Run the app on iOS.
• Login and make sure at least one grocery is checked.
• Open app.css and uncomment the text-decoration: line-through line.
• Run livesync.

I think this is specific to the Angular plugin, because I can apply my line-through class name to other UI elements without any issues. It’s only when I apply it within an Angular template that I have problems. (Oh and I’m using the class currently on this line).

Thanks

[nsndeck]

@tjvantoll There is no angular branch in sample-Groceries repo. Could you please send me up-to-date instructions how to reproduce this issue?

[tjvantoll]

Hey @nsndeck,

Sorry about that. The Angular code is now in master, and the code in question is now here.

Thanks.

[nsndeck]

Hi @tjvantoll I've made a pull request regarding Everlive synchronization which was the only problem I've found on sample-groceries app. I cannot reproduce the issue with text-decoration. Could you please confirm that the problem still exists?

[tjvantoll]

Hey @nsndeck,

Thanks a lot for your help on this. I can no longer recreate this. Not sure was up, but the problem seems to have been resolved. Thanks again!