Inline color property not applied to span in a FormattedString when used on a Page since 3.1

[corne-de-bruin]

After we upgraded to NativeScript 3.1.0 we ran into an issue where the inline color property is ignored as soon as i set a default Page color in my app.css.

I've provided a sample application:
https://github.com/corne-de-bruin/FormattedStringExample

If you run the app you'll see that the complete sentence is red.

If you put the content from first-page.component.html to the app.component.htm, remove the page-router-outlet and set the default color with a css class on the GridLayout it works fine.

So it looks like the combination with the page-router-outlet and the inheritance of the color property from css files is going wrong.

This is found in tns-core-modules 3.1.0 it works fine in 3.0.0.
The issue is occurring on both iOS and Android.

[NickIliev]

Hey, @corne-de-bruin thank you for the provided sample project!

After some additional tests it appears that the issue is only reproducible on iOS (tested on Android API-19, APi-23, and API-25 and it works as expected on my side)

Steps to reproduce the issue

• use the applicaiton provided by @corne-de-bruin
• or use the following after creating base NG app.

<GridLayout rows="*">
    <Label textWrap="true">
        <FormattedString>
            <Span text="This is an example to test "></Span>
            <Span color="#349aff" text="the color of a span"></Span>
            <Span text=" in a formattedstring."></Span>
        </FormattedString>
    </Label>
</GridLayout>

and in app.css

Page {
    color: #ff1744;
}

The above is observed also when trying to set the color via CSS style. (again only on iOS)

[corne-de-bruin]

Hey, @NickIliev

Thanks for your reply, today i've tested again with the sample project and i can confirm that it's not reproducible on Android sorry for the inconvenience.

[NickIliev]

Reproducible with [email protected]

https://play.nativescript.org/?template=play-ng&id=NcZGcl