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

Revert "feat(animation): support animating width/height properties (WIP) (#4917)" (#5136)

Browse Source 
This reverts commit 57ed0cf405.
This commit is contained in:
Svetoslav
2017-12-07 12:11:24 +02:00
committed by Vasil Chimev
parent 1615061591
commit 8973a6febd
25 changed files with 56 additions and 941 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
tests/app/testRunner.ts
View File

@@ -471,4 +471,4 @@ class TestInfo implements TKUnit.TestInfoEntry {
this.testTimeout = testTimeout;
this.duration = duration;
}
}
}

114
tests/app/ui/animation/animation-tests.ts
View File

@@ -9,22 +9,14 @@ import { AnimationPromise } from "tns-core-modules/ui/animation";
// >> animation-require
import * as animation from "tns-core-modules/ui/animation";
import {PercentLength} from "tns-core-modules/ui/styling/style-properties";
// << animation-require
function prepareTest(parentHeight?: number, parentWidth?: number): Label {
function prepareTest(): Label {
let mainPage = helper.getCurrentPage();
let label = new Label();
label.text = "label";
let stackLayout = new StackLayout();
// optionally size the parent extent to make assertions about percentage values
if (parentHeight !== undefined) {
stackLayout.height = PercentLength.parse(parentHeight + '');
}
if (parentWidth !== undefined) {
stackLayout.width = PercentLength.parse(parentWidth + '');
}
stackLayout.addChild(label);
mainPage.content = stackLayout;
TKUnit.waitUntilReady(() => label.isLoaded);
@@ -378,110 +370,6 @@ export function test_AnimateRotate(done) {
});
}
function animateExtentAndAssertExpected(along: 'height' | 'width', value: PercentLength, pixelExpected: PercentLength): Promise<void> {
function pretty(val) {
return JSON.stringify(val, null, 2);
}
const parentExtent = 200;
const height = along === 'height' ? parentExtent : undefined;
const width = along === 'height' ? undefined : parentExtent;
const label = prepareTest(height, width);
const props = {
duration: 5,
[along]: value
};
return label.animate(props).then(() => {
const observedString: string = PercentLength.convertToString(label[along]);
const inputString: string = PercentLength.convertToString(value);
TKUnit.assertEqual(
observedString,
inputString,
`PercentLength.convertToString(${pretty(value)}) should be '${inputString}' but is '${observedString}'`
);
// assert that the animated view's calculated pixel extent matches the expected pixel value
const observedNumber: number = PercentLength.toDevicePixels(label[along], parentExtent, parentExtent);
const expectedNumber: number = PercentLength.toDevicePixels(pixelExpected, parentExtent, parentExtent);
TKUnit.assertEqual(
observedNumber,
expectedNumber,
`PercentLength.toDevicePixels(${inputString}) should be '${expectedNumber}' but is '${observedNumber}'`
);
assertIOSNativeTransformIsCorrect(label);
});
}
export function test_AnimateExtent_Should_ResolvePercentageStrings(done) {
let promise: Promise<any> = Promise.resolve();
const pairs: [string, string][] = [
['100%', '200px'],
['50%', '100px'],
['25%', '50px'],
['-25%', '-50px'],
['-50%', '-100px'],
['-100%', '-200px'],
];
pairs.forEach((pair) => {
const input = PercentLength.parse(pair[0]);
const expected = PercentLength.parse(pair[1]);
promise = promise.then(() => {
return animateExtentAndAssertExpected('height', input, expected);
});
promise = promise.then(() => {
return animateExtentAndAssertExpected('width', input, expected);
});
});
promise.then(() => done()).catch(done);
}
export function test_AnimateExtent_Should_AcceptStringPixelValues(done) {
let promise: Promise<any> = Promise.resolve();
const pairs: [string, number][] = [
['100px', 100],
['50px', 50]
];
pairs.forEach((pair) => {
const input = PercentLength.parse(pair[0]);
const expected = {
unit: 'px',
value: pair[1]
} as PercentLength;
promise = promise.then(() => {
return animateExtentAndAssertExpected('height', input, expected);
});
promise = promise.then(() => {
return animateExtentAndAssertExpected('width', input, expected);
});
});
promise.then(() => done()).catch(done);
}
export function test_AnimateExtent_Should_AcceptNumberValuesAsDip(done) {
let promise: Promise<any> = Promise.resolve();
const inputs: any[] = [200, 150, 100, 50, 0];
inputs.forEach((value) => {
const parsed = PercentLength.parse(value);
promise = promise.then(() => {
return animateExtentAndAssertExpected('height', parsed, parsed);
});
promise = promise.then(() => {
return animateExtentAndAssertExpected('width', parsed, parsed);
});
});
promise.then(() => done()).catch(done);
}
export function test_AnimateExtent_Should_ThrowIfCannotParsePercentLength() {
const label = new Label();
helper.buildUIAndRunTest(label, (views: Array<viewModule.View>) => {
TKUnit.assertThrows(() => {
label.animate({width: '-frog%'});
}, "Invalid percent string should throw");
TKUnit.assertThrows(() => {
label.animate({height: '-frog%'});
}, "Invalid percent string should throw");
});
}
export function test_AnimateTranslateScaleAndRotateSimultaneously(done) {
let label = prepareTest();

55
tests/app/ui/styling/style-properties-tests.ts
View File

@@ -10,7 +10,6 @@ import { isAndroid, isIOS } from "tns-core-modules/platform";
import { View } from "tns-core-modules/ui/core/view";
import { Length, PercentLength } from "tns-core-modules/ui/core/view";
import * as fontModule from "tns-core-modules/ui/styling/font";
import { LengthPercentUnit, LengthPxUnit } from "tns-core-modules/ui/styling/style-properties";
export function test_setting_textDecoration_property_from_CSS_is_applied_to_Style() {
test_property_from_CSS_is_applied_to_style("textDecoration", "text-decoration", "underline");
@@ -863,57 +862,3 @@ export function test_border_radius() {
TKUnit.assertTrue(Length.equals(testView.style.borderBottomRightRadius, expected), "bottom");
TKUnit.assertTrue(Length.equals(testView.style.borderBottomLeftRadius, expected), "left");
}
function assertPercentLengthParseInputOutputPairs(pairs: [string, any][]) {
pairs.forEach((pair: [string, any]) => {
const output = PercentLength.parse(pair[0]) as LengthPxUnit | LengthPercentUnit;
TKUnit.assertEqual(pair[1].unit, output.unit,
`PercentLength.parse('${pair[0]}') should return unit '${pair[1].unit}' but returned '${output.unit}'`
);
TKUnit.assertEqual(pair[1].value.toFixed(2), output.value.toFixed(2),
`PercentLength.parse('${pair[0]}') should return value '${pair[1].value}' but returned '${output.value}'`
);
});
}
export function test_PercentLength_parses_pixel_values_from_string_input() {
assertPercentLengthParseInputOutputPairs([
['4px', {unit: 'px', value: 4}],
['-4px', {unit: 'px', value: -4}],
]);
}
export function test_PercentLength_parses_percentage_values_from_string_input() {
assertPercentLengthParseInputOutputPairs([
['4%', {unit: '%', value: 0.04}],
['17%', {unit: '%', value: 0.17}],
['-27%', {unit: '%', value: -0.27}],
]);
}
export function test_PercentLength_parse_throws_given_string_input_it_cannot_parse() {
const inputs: any[] = [
'-l??%',
'qre%',
'undefinedpx',
'undefined',
'-frog%'
];
inputs.forEach((input) => {
TKUnit.assertThrows(() => {
PercentLength.parse(input);
}, `PercentLength.parse('${input}') should throw.`);
});
}
export function test_PercentLength_returns_unsupported_types_untouched() {
const inputs: any[] = [
null,
undefined,
{baz: true}
];
inputs.forEach((input) => {
const result = PercentLength.parse(input);
TKUnit.assertEqual(input, result, `PercentLength.parse(${input}) should return input value`);
});
}