[ALOY-628] When merging <viewname>.tss styles, platform specific Themes styles are not having priority over platform specific generic styles

GitHub Issue	n/a
Type	Bug
Priority	High
Status	Closed
Resolution	Fixed
Resolution Date	2013-04-23T03:21:00.000+0000
Affected Version/s	Alloy 1.1.1, Alloy 1.0.0
Fix Version/s	Alloy 1.2.0, Alloy 1.1.2, 2013 Sprint 09
Components	XML
Labels	n/a
Reporter	Federico Casali
Assignee	Tony Lukasavage
Created	2013-04-18T22:29:03.000+0000
Updated	2013-05-01T14:56:31.000+0000

Description

Problem description

Platform specific styles Themes should have always precedence over other styles during the merge process. This is the correct behavior when using 'app.tss' global style. The one defined in the Theme/styles is being reflected correctly. However, when using a style file matching a view.xml file, the generic specific-platform style is being used.

See the first sample code attached - app_APP-TSS.zip

In this sample, all styles are handled using 'app.tss' files. Themes merging behave correctly and theme's app.tss settings get the precedence. 1. Run on Android Result: blu background and orange view are shown, as defined in themes/dark/styles/app.tss 2. Run on iOS: Result: purple background and green view are shown, as defined in themes/green/styles/app.tss

See the second sample code attached - app_INDEX-TSS.zip

In this sample, styles are handled using 'index.tss' files and 'app.tss' files. 'index.tss' files defined in specific-platform folders under 'styles//index.tss' get the precedence over the ones defined by the specific-platform Themes folder. 1. Run on Android Result: red background, as defined in 'styles/android/index.tss' file (instead of blue as defined in the index.tss theme being used by Android) 2. Run on iOS Result: yellow background, as defined in 'styles/ios/index.tss' file (instead of purple as defined in the index.tss theme being used by iOS) 3. Delete generic specific-platform styles folder and create a generic 'index.tss' file under app/styles. Run the app on both platforms. Result: Themes 'style/platformSpecific/index.tss' style has precedence as expected and the theme style is applied correctly.

Attachments

File	Date	Size
app_APP-TSS.zip	2013-04-18T22:29:03.000+0000	3810353
app_INDEX-TSS.zip	2013-04-18T22:29:03.000+0000	3811012

Comments

Tony Lukasavage 2013-04-23 The styles you cite here are actually sorting correctly. How the theme is specified in the config.json does not play into the ordering of the style. A platform-specific theme style would not be one set in the config.json, it would instead be one where the theme was structured like this: * themes ** someTheme *** styles **** android ***** index.tss **** ios ***** index.tss **** index.tss So as per the instructions laid out in ALOY-434, this is actually sorting correctly. If you put the index.tss from your example in a platform-specific folder inside the theme it would work as expected. Having said all this, you helped identify a small bug that would prevent platform-specific themes from working properly. I will be fixing it in this ticket.
Tony Lukasavage 2013-04-24 Resolved in this commit: https://github.com/appcelerator/alloy/commit/229697b735459d5844b06488e683f20cb65924d4 All platform-specific theme folders would have failed on this check. They work now. So any test app that included a theme with a platform-specific style folder would provide a test that this works.
Tony Lukasavage 2013-04-24 The advanced/themes test app has been modified to include an ios-specific folder in the green theme. This app compiling and running without error on ios would confirm that the bug in question has been resolved. jake app:run dir=advanced/themes https://github.com/appcelerator/alloy/tree/master/test/apps/advanced/themes
Tony Lukasavage 2013-04-29 Confirmation from community that 1.1.2-alpha has solved this issue: http://developer.appcelerator.com/question/151717/issues-in-using-class-styles-with-alloy-in-latest-alloy-update
Federico Casali 2013-05-01 Verified as fixed with Alloy version 1.1.2-alpha, SDK 3.1.0 GA iPhone 5 Android Nexus 4 Sample code: https://github.com/appcelerator/alloy/tree/master/test/apps/advanced/themes

JSON Source