From d61ab801e9da8367e44cb39f7152d3604706d1f7 Mon Sep 17 00:00:00 2001 From: Panayot Cankov Date: Thu, 3 Dec 2015 16:53:25 +0200 Subject: [PATCH] Fix native image recreated on layout even if the view is not resized --- apps/tests/testRunner.ts | 33 ++++++++++++++-- apps/tests/ui/view/view-tests.ios.ts | 59 +++++++++++++++++++++++++++- ui/core/view-common.ts | 10 +++-- ui/core/view.ios.ts | 13 +++--- ui/styling/style.ts | 4 +- 5 files changed, 104 insertions(+), 15 deletions(-) diff --git a/apps/tests/testRunner.ts b/apps/tests/testRunner.ts index 55216be2f..c5f896464 100644 --- a/apps/tests/testRunner.ts +++ b/apps/tests/testRunner.ts @@ -144,17 +144,41 @@ function log(): void { TKUnit.write(testsName + " COMPLETED for " + duration + " BACKSTACK DEPTH: " + topmost().backStack.length, messageType.info); } -export var runAll = function (moduleName?: string) { +export var runAll = function (testSelector?: string) { if (running) { // TODO: We may schedule pending run requests return; } + + var singleModuleName, singleTestName; + if (testSelector) { + var pair = testSelector.split("."); + singleModuleName = pair[0]; + if (singleModuleName) { + if (singleModuleName.length === 0) { + singleModuleName = undefined; + } else { + singleModuleName = singleModuleName.toLowerCase(); + } + } + + singleTestName = pair[1]; + if (singleTestName) { + if (singleTestName.length === 0) { + singleTestName = undefined; + } else { + singleTestName = singleTestName.toLowerCase(); + } + } + } + + console.log("TESTS: " + singleModuleName + " " + singleTestName); var totalSuccess = 0; var totalFailed: Array = []; testsQueue.push(new TestInfo(function () { running = true; })); for (var name in allTests) { - if (moduleName && (moduleName.toLowerCase() !== name.toLowerCase())) { + if (singleModuleName && (singleModuleName !== name.toLowerCase())) { continue; } @@ -170,8 +194,11 @@ export var runAll = function (moduleName?: string) { testsQueue.push(new TestInfo(test.setUpModule, test)); } - for (var testName in test) { + if (singleTestName && (singleTestName !== testName.toLowerCase())) { + continue; + } + var testFunction = test[testName]; if ((typeof (testFunction) === "function") && (testName.substring(0, 4) == "test")) { if (test.setUp) { diff --git a/apps/tests/ui/view/view-tests.ios.ts b/apps/tests/ui/view/view-tests.ios.ts index 5b6a9440f..ad26024ce 100644 --- a/apps/tests/ui/view/view-tests.ios.ts +++ b/apps/tests/ui/view/view-tests.ios.ts @@ -1,6 +1,12 @@ import commonTests = require("./view-tests-common"); import view = require("ui/core/view"); +import grid = require("ui/layouts/grid-layout"); +import color = require("color"); +import helper = require("../helper"); +import page = require("ui/page"); +import TKUnit = require("../../TKUnit"); + global.moduleMerge(commonTests, exports); export function getNativeBorderWidth(v: view.View): number { @@ -27,4 +33,55 @@ export function checkNativeBackgroundColor(v: view.View): boolean { export function checkNativeBackgroundImage(v: view.View): boolean { return (v.ios).backgroundColor !== undefined; -} \ No newline at end of file +} + +export function testBackgroundInternalChangedOnceOnResize() { + + var layout = new grid.GridLayout(); + layout.className = "myClass"; + layout.backgroundColor = new color.Color(255, 255, 0, 0); + + var pageFactory = () => { + var root = new page.Page(); + root.css = ".myClass { background-image: url('~/tests/logo.png') }"; + root.content = layout; + return root; + } + + helper.navigate(pageFactory); + + try { + var sizeChangedCount = 0; + function trackCount() { + var result = sizeChangedCount; + sizeChangedCount = 0; + return result; + } + + var base = (layout.style)._applyStyleProperty; + (layout.style)._applyStyleProperty = function(property) { + base.apply(layout.style, arguments); + if (property.name === "_backgroundInternal") { + ++sizeChangedCount; + } + } + + layout.requestLayout(); + layout.layout(0, 0, 200, 200); + + TKUnit.assertEqual(trackCount(), 1, "Expected background to be re-applied at most once when the view is layed-out on 0 0 200 200."); + + layout.requestLayout(); + layout.layout(50, 50, 250, 250); + + TKUnit.assertEqual(trackCount(), 0, "Expected background to NOT change when view is layed-out from 0 0 200 200 to 50 50 250 250."); + + layout.requestLayout(); + layout.layout(0, 0, 250, 250); + + TKUnit.assertEqual(trackCount(), 1, "Expected background to be re-applied at most once when the view is layed-out from 50 50 250 250 to 0 0 250 250."); + } + finally { + helper.goBack(); + } +} diff --git a/ui/core/view-common.ts b/ui/core/view-common.ts index b43eb7c4f..9a5f69105 100644 --- a/ui/core/view-common.ts +++ b/ui/core/view-common.ts @@ -893,14 +893,18 @@ export class View extends proxy.ProxyObject implements definition.View { return { left: this._oldLeft, top: this._oldTop, right: this._oldRight, bottom: this._oldBottom } } - _setCurrentLayoutBounds(left: number, top: number, right: number, bottom: number): boolean { + /** + * Returns two booleans - the first if "boundsChanged" the second is "sizeChanged". + */ + _setCurrentLayoutBounds(left: number, top: number, right: number, bottom: number): { boundsChanged: boolean, sizeChanged: boolean } { this._isLayoutValid = true; - var changed: boolean = this._oldLeft !== left || this._oldTop !== top || this._oldRight !== right || this._oldBottom !== bottom; + var boundsChanged: boolean = this._oldLeft !== left || this._oldTop !== top || this._oldRight !== right || this._oldBottom !== bottom; + var sizeChanged: boolean = (this._oldRight - this._oldLeft !== right - left) || (this._oldBottom - this._oldTop !== bottom - top); this._oldLeft = left; this._oldTop = top; this._oldRight = right; this._oldBottom = bottom; - return changed; + return { boundsChanged, sizeChanged }; } private _applyStyleFromScope() { diff --git a/ui/core/view.ios.ts b/ui/core/view.ios.ts index a81410d94..5f5dc32b4 100644 --- a/ui/core/view.ios.ts +++ b/ui/core/view.ios.ts @@ -138,13 +138,14 @@ export class View extends viewCommon.View { } public layout(left: number, top: number, right: number, bottom: number): void { - var changed: boolean = this._setCurrentLayoutBounds(left, top, right, bottom); + var { boundsChanged, sizeChanged } = this._setCurrentLayoutBounds(left, top, right, bottom); this.layoutNativeView(left, top, right, bottom); - - if (changed || (this._privateFlags & PFLAG_LAYOUT_REQUIRED) === PFLAG_LAYOUT_REQUIRED) { + if (boundsChanged || (this._privateFlags & PFLAG_LAYOUT_REQUIRED) === PFLAG_LAYOUT_REQUIRED) { this.onLayout(left, top, right, bottom); this._privateFlags &= ~PFLAG_LAYOUT_REQUIRED; - this._onBoundsChanged(); + } + if (sizeChanged) { + this._onSizeChanged(); } this._privateFlags &= ~PFLAG_FORCE_LAYOUT; } @@ -246,8 +247,8 @@ export class View extends viewCommon.View { return false; } - private _onBoundsChanged() { - this.style._boundsChanged(); + private _onSizeChanged() { + this.style._sizeChanged(); } public _updateNativeTransform() { diff --git a/ui/styling/style.ts b/ui/styling/style.ts index 89c5f38ef..1a0c3ceb4 100644 --- a/ui/styling/style.ts +++ b/ui/styling/style.ts @@ -647,7 +647,7 @@ export class Style extends DependencyObservable implements styling.Style { }); } - public _boundsChanged() { + public _sizeChanged() { if (!(this._getValue(backgroundInternalProperty)).isEmpty()) { this._applyProperty(backgroundInternalProperty, this._getValue(backgroundInternalProperty)); } @@ -671,7 +671,7 @@ export class Style extends DependencyObservable implements styling.Style { } private _applyStyleProperty(property: Property, newValue: any) { - + if (!this._view._shouldApplyStyleHandlers()) { return; }