javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-11-05 13:26:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

Inital by-type split

Browse Source 
Split type.class from CssTypeSelector to CssCompositeSelector, probably support type#id.class selectors

Apply review comments, refactor css-selectors internally

Applied refactoring, all tests pass, button does not notify changes

Add tests for the css selectors parser.

Added tests for css-selectors

Added basic implementation of mayMatch and changeMap for css match state

Implemented TKUnit.assertDeepEqual to check key and key/values in Map and Set

Watch for property and pseudoClass changes

Add one child group test

Add typings for animations

Added mechanism to enable/disable listeners for pseudo classes

Count listeners instead of checking handlers, reverse subscription and unsubscription
This commit is contained in:
Panayot Cankov
2016-06-22 13:13:53 +03:00
parent 0477c81dd5
commit c1aeeb51a7
33 changed files with 1560 additions and 1006 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
tests/app/ui/styling/style-tests.ts
View File

@@ -12,7 +12,6 @@ import types = require("utils/types");
import viewModule = require("ui/core/view");
import styleModule = require("ui/styling/style");
import dependencyObservableModule = require("ui/core/dependency-observable");
import {StyleScope} from 'ui/styling/style-scope';
export function test_css_dataURI_is_applied_to_backgroundImageSource() {
var stack = new stackModule.StackLayout();
@@ -358,10 +357,8 @@ export var test_composite_selector_type_and_class = function () {
let testFunc = function (views: Array<viewModule.View>) {
TKUnit.assert(btnWithClass.style.color, "Color property no applied correctly.");
TKUnit.assert(btnWithClass.style.color.hex === "#FF0000", "Color property no applied correctly.");
TKUnit.assert(btnWithNoClass.style.color === undefined, "Color should not have a value");
TKUnit.assert(lblWithClass.style.color === undefined, "Color should not have a value");
TKUnit.assert(btnWithNoClass.style.color === undefined, "btnWithNoClass color should not have a value");
TKUnit.assert(lblWithClass.style.color === undefined, "lblWithClass color should not have a value");
}
helper.buildUIAndRunTest(testStack, testFunc, testCss);
@@ -630,13 +627,6 @@ export function test_styling_properties_are_defined() {
TKUnit.assert(types.isFunction(styling.properties.getPropertyByName), "properties.getPropertyByName function is not defined");
}
export function test_styling_visualStates_are_defined() {
TKUnit.assert(types.isDefined(styling.visualStates), "visualStates module is not defined");
TKUnit.assert(types.isString(styling.visualStates.Hovered), "Hovered state is not defined");
TKUnit.assert(types.isString(styling.visualStates.Normal), "Normal state is not defined");
TKUnit.assert(types.isString(styling.visualStates.Pressed), "Pressed state is not defined");
}
export function test_styling_stylers_are_defined() {
TKUnit.assert(types.isFunction(styleModule.registerHandler), "registerHandler function is not defined");
TKUnit.assert(types.isFunction(styleModule.StylePropertyChangedHandler), "StylePropertyChangedHandler class is not defined");
@@ -1445,16 +1435,6 @@ export function test_CascadingClassNamesAppliesAfterPageLoad() {
});
}
export function test_SortingOfCssSelectorsWithSameSpecificity() {
let scope = new StyleScope();
scope.css = ".button { border-color: #b2b2b2; background-color: hotpink; color: #444; margin: 5; padding: 7 2; border-width: 1; border-style: solid; border-radius: 2; text-align: center; font-size: 18; line-height: 42; } .button-small { background-color: salmon; } .button-large { font-size: 26; } .button-light { border-color: #ddd; background-color: #fff; color: #444; } .button-stable { border-color: #b2b2b2; background-color: #f8f8f8; color: #444; } .button-positive { border-color: #0c60ee; background-color: #387ef5; color: #fff; } .button-calm { border-color: #0a9dc7;background-color: #11c1f3; color: #fff; } .button-balanced { border-color: #28a54c; background-color: #33cd5f; color: #fff; } .button-energized { border-color: #e6b500; background-color: #ffc900; color: #fff; } .button-assertive { border-color: #e42112; background-color: #ef473a; color: #fff; } .button-royal { border-color: #6b46e5; background-color: #886aea; color: #fff; } .button-dark { border-color: #111; background-color: #444; color: #fff; }";
scope.ensureSelectors();
let expressions = [];
(<any>scope)._mergedCssSelectors.forEach((v) => {
expressions.push(v.expression);
});
TKUnit.assertTrue(expressions.indexOf('button') < expressions.indexOf('button-calm'), "button class selector should be before button-calm selector.");
}
// <snippet module="ui/styling" title="styling">
// For information and example how to use style properties please refer to special [**Styling**](../../../styling.md) topic.
// </snippet>