!985 ut adapting custom component

Merge pull request !985 from yfwang6/utmaster

compiler/test/ut/import/importAllEts.ts

@@ -91,6 +91,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+let __generate__Id = 0;
+function generateId() {
+    return "importAllEts_" + ++__generate__Id;
+}
 const AllComponent = __importStar(require("./test/pages/NamespaceComponent"));
 const TsModule_1 = __importDefault(require("./test/pages/TsModule"));
 class ImportTest extends View {
@@ -149,7 +153,7 @@ class ImportTest extends View {
     }
     render() {
         Column.create();
-        let earlierCreatedChild_2 = this.findChildById("2");
+        let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
         if (earlierCreatedChild_2 == undefined) {
             View.create(new AllComponent.NamespaceComponent1("2", this, {
                 NamespaceComponent1Link1: this.__myState1,
@@ -169,7 +173,7 @@ class ImportTest extends View {
         }
         __Common__.create();
         __Common__.width(100);
-        let earlierCreatedChild_3 = this.findChildById("3");
+        let earlierCreatedChild_3 = (this && this.findChildById) ? this.findChildById("3") : undefined;
         if (earlierCreatedChild_3 == undefined) {
             View.create(new AllComponent.NamespaceComponent1("3", this, {
                 NamespaceComponent1Link1: this.__myState1,
@@ -188,7 +192,7 @@ class ImportTest extends View {
             View.create(earlierCreatedChild_3);
         }
         __Common__.pop();
-        let earlierCreatedChild_4 = this.findChildById("4");
+        let earlierCreatedChild_4 = (this && this.findChildById) ? this.findChildById("4") : undefined;
         if (earlierCreatedChild_4 == undefined) {
             View.create(new AllComponent.default("4", this, {
                 NamespaceComponent3Link1: this.__myState1,
@@ -208,7 +212,7 @@ class ImportTest extends View {
         }
         __Common__.create();
         __Common__.height(200);
-        let earlierCreatedChild_5 = this.findChildById("5");
+        let earlierCreatedChild_5 = (this && this.findChildById) ? this.findChildById("5") : undefined;
         if (earlierCreatedChild_5 == undefined) {
             View.create(new AllComponent.default("5", this, {
                 NamespaceComponent3Link1: this.__myState1,

compiler/test/ut/import/importEts.ts

@@ -123,6 +123,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+let __generate__Id = 0;
+function generateId() {
+    return "importEts_" + ++__generate__Id;
+}
 const LinkComponent_1 = __importStar(require("./test/pages/LinkComponent"));
 const DefaultComponent_1 = __importDefault(require("./test/pages/DefaultComponent"));
 const AMDComponentDefault = require("./test/pages/AMDComponent");
@@ -183,7 +187,7 @@ class ImportTest extends View {
     }
     render() {
         Column.create();
-        let earlierCreatedChild_2 = this.findChildById("2");
+        let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
         if (earlierCreatedChild_2 == undefined) {
             View.create(new LinkComponent_1.LinkComponent2("2", this, {
                 LinkComponent2Link1: this.__myState1,
@@ -209,7 +213,7 @@ class ImportTest extends View {
         Text.fontSize(20);
         Text.fontColor(Color.Red);
         Text.pop();
-        let earlierCreatedChild_3 = this.findChildById("3");
+        let earlierCreatedChild_3 = (this && this.findChildById) ? this.findChildById("3") : undefined;
         if (earlierCreatedChild_3 == undefined) {
             View.create(new LinkComponent_1.LinkComponent("3", this, {
                 LinkComponent1Link1: this.__myState1,
@@ -231,7 +235,7 @@ class ImportTest extends View {
             });
             View.create(earlierCreatedChild_3);
         }
-        let earlierCreatedChild_4 = this.findChildById("4");
+        let earlierCreatedChild_4 = (this && this.findChildById) ? this.findChildById("4") : undefined;
         if (earlierCreatedChild_4 == undefined) {
             View.create(new DefaultComponent_1.default("4", this, {
                 DefaultComponentLink1: this.__myState1,
@@ -249,7 +253,7 @@ class ImportTest extends View {
             });
             View.create(earlierCreatedChild_4);
         }
-        let earlierCreatedChild_5 = this.findChildById("5");
+        let earlierCreatedChild_5 = (this && this.findChildById) ? this.findChildById("5") : undefined;
         if (earlierCreatedChild_5 == undefined) {
             View.create(new LinkComponent_1.default("5", this, {
                 LinkComponent3Link1: this.__myState1,
@@ -271,7 +275,7 @@ class ImportTest extends View {
             });
             View.create(earlierCreatedChild_5);
         }
-        let earlierCreatedChild_6 = this.findChildById("6");
+        let earlierCreatedChild_6 = (this && this.findChildById) ? this.findChildById("6") : undefined;
         if (earlierCreatedChild_6 == undefined) {
             View.create(new AMDComponentDefault("6", this, {
                 AMDComponentLink1: this.__myState1,
@@ -289,7 +293,7 @@ class ImportTest extends View {
             });
             View.create(earlierCreatedChild_6);
         }
-        let earlierCreatedChild_7 = this.findChildById("7");
+        let earlierCreatedChild_7 = (this && this.findChildById) ? this.findChildById("7") : undefined;
         if (earlierCreatedChild_7 == undefined) {
             View.create(new LinkComponent_1.LinkComponent3("7", this, {
                 LinkComponent3Link1: this.__myState1,

compiler/test/ut/import/importExportEts.ts

@@ -58,6 +58,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+let __generate__Id = 0;
+function generateId() {
+    return "importExportEts_" + ++__generate__Id;
+}
 const ExportStarComponent_1 = require("./test/pages/ExportStarComponent");
 const TsModule_1 = __importDefault(require("./test/pages/TsModule"));
 class ImportTest extends View {
@@ -116,7 +120,7 @@ class ImportTest extends View {
     }
     render() {
         Column.create();
-        let earlierCreatedChild_2 = this.findChildById("2");
+        let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
         if (earlierCreatedChild_2 == undefined) {
             View.create(new ExportStarComponent_1.AllStarComponent.ExportComponent("2", this, {
                 ExportComponent1Link1: this.__myState1,
@@ -138,7 +142,7 @@ class ImportTest extends View {
             });
             View.create(earlierCreatedChild_2);
         }
-        let earlierCreatedChild_3 = this.findChildById("3");
+        let earlierCreatedChild_3 = (this && this.findChildById) ? this.findChildById("3") : undefined;
         if (earlierCreatedChild_3 == undefined) {
             View.create(new ExportStarComponent_1.AllStarComponent.default("3", this, {
                 ExportComponent4Link1: this.__myState1,

compiler/test/ut/import/importExportNest.ts

@@ -58,6 +58,10 @@ struct ImportTest {
 exports.expectResult =
 `"use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+let __generate__Id = 0;
+function generateId() {
+    return "importExportNest_" + ++__generate__Id;
+}
 const ImportNestAll_1 = require("./test/pages/ImportNestAll");
 class ImportTest extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
@@ -173,16 +177,16 @@ class ImportTest extends View {
         Text.create(this.testText1);
         Text.fontSize(50);
         Text.pop();
-        ImportNestAll_1.tExtend(20);
+        ImportNestAll_1.tExtend(20, this);
         Text.create(this.testText2);
         Text.pop();
-        ImportNestAll_1.tStyles();
+        ImportNestAll_1.tStyles(this);
         Button.createWithLabel(this.testText3);
         Button.pop();
         Text.create(this.testText4);
         Text.fontSize(50);
         Text.pop();
-        let earlierCreatedChild_2 = this.findChildById("2");
+        let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
         if (earlierCreatedChild_2 == undefined) {
             View.create(new ImportNestAll_1.Base("2", this, {
                 testStr: this.__testState1,
@@ -194,7 +198,7 @@ class ImportTest extends View {
             earlierCreatedChild_2.updateWithValueParams({});
             View.create(earlierCreatedChild_2);
         }
-        let earlierCreatedChild_3 = this.findChildById("3");
+        let earlierCreatedChild_3 = (this && this.findChildById) ? this.findChildById("3") : undefined;
         if (earlierCreatedChild_3 == undefined) {
             View.create(new ImportNestAll_1.DivideTest("3", this, {
                 testNum1: this.__testState4,

compiler/test/ut/import/importSystemApi.ts

@@ -36,7 +36,11 @@ import hello from 'libhello.so'
 import world = require('libworld.so')`
 
 exports.expectResult =
-`var { router1, router2 } = globalThis.requireNativeModule('system.router');
+`let __generate__Id = 0;
+function generateId() {
+    return "importSystemApi_" + ++__generate__Id;
+}
+var { router1, router2 } = globalThis.requireNativeModule('system.router');
 var { app } = globalThis.requireNativeModule('system.router');
 var { fetch } = isSystemplugin('fetch', 'system') ? globalThis.systemplugin.fetch : globalThis.requireNapi('fetch');
 var { router1, router2, router3 } = globalThis.requireNativeModule('system.router');

compiler/test/ut/import/importTs.ts

@@ -58,6 +58,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+let __generate__Id = 0;
+function generateId() {
+    return "importTs_" + ++__generate__Id;
+}
 const ExportStarComponent_1 = require("./test/pages/ExportStarComponent");
 const TsModule_1 = __importDefault(require("./test/pages/TsModule"));
 class ImportTest extends View {
@@ -116,7 +120,7 @@ class ImportTest extends View {
     }
     render() {
         Column.create();
-        let earlierCreatedChild_2 = this.findChildById("2");
+        let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
         if (earlierCreatedChild_2 == undefined) {
             View.create(new ExportStarComponent_1.AllStarComponent.ExportComponent("2", this, {
                 ExportComponent1Link1: this.__myState1,
@@ -138,7 +142,7 @@ class ImportTest extends View {
             });
             View.create(earlierCreatedChild_2);
         }
-        let earlierCreatedChild_3 = this.findChildById("3");
+        let earlierCreatedChild_3 = (this && this.findChildById) ? this.findChildById("3") : undefined;
         if (earlierCreatedChild_3 == undefined) {
             View.create(new ExportStarComponent_1.AllStarComponent.default("3", this, {
                 ExportComponent4Link1: this.__myState1,

compiler/test/ut/inner_commponent_transform/$$_component/$$_component.ts

@@ -74,7 +74,11 @@ struct HomeComponent {
 }`
 
 exports.expectResult =
-`const value5 = [true, false];
+`let __generate__Id = 0;
+function generateId() {
+    return "$$_component_" + ++__generate__Id;
+}
+const value5 = [true, false];
 let value6 = { item1: true };
 let isCountDown = false;
 class HomeComponent extends View {

compiler/test/ut/inner_commponent_transform/custom_component/custom_component.ts

@@ -46,7 +46,11 @@ struct Banner {
 }`
 
 exports.expectResult =
-`class MyComponent extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "custom_component_" + ++__generate__Id;
+}
+class MyComponent extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.updateWithValueParams(params);
@@ -58,7 +62,7 @@ exports.expectResult =
     }
     render() {
         Column.create();
-        let earlierCreatedChild_2 = this.findChildById("2");
+        let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
         if (earlierCreatedChild_2 == undefined) {
             View.create(new Banner("2", this, {}));
         }
@@ -71,7 +75,7 @@ exports.expectResult =
         }
         __Common__.create();
         __Common__.width(100);
-        let earlierCreatedChild_3 = this.findChildById("3");
+        let earlierCreatedChild_3 = (this && this.findChildById) ? this.findChildById("3") : undefined;
         if (earlierCreatedChild_3 == undefined) {
             View.create(new Banner("3", this, {}));
         }
@@ -86,7 +90,7 @@ exports.expectResult =
         __Common__.create();
         __Common__.width(100);
         __Common__.height(200);
-        let earlierCreatedChild_4 = this.findChildById("4");
+        let earlierCreatedChild_4 = (this && this.findChildById) ? this.findChildById("4") : undefined;
         if (earlierCreatedChild_4 == undefined) {
             View.create(new Banner("4", this, {}));
         }
@@ -98,7 +102,7 @@ exports.expectResult =
             View.create(earlierCreatedChild_4);
         }
         __Common__.pop();
-        let earlierCreatedChild_5 = this.findChildById("5");
+        let earlierCreatedChild_5 = (this && this.findChildById) ? this.findChildById("5") : undefined;
         if (earlierCreatedChild_5 == undefined) {
             View.create(new Banner("5", this, { value: "Hello" }));
         }
@@ -113,7 +117,7 @@ exports.expectResult =
         }
         __Common__.create();
         __Common__.width(100);
-        let earlierCreatedChild_6 = this.findChildById("6");
+        let earlierCreatedChild_6 = (this && this.findChildById) ? this.findChildById("6") : undefined;
         if (earlierCreatedChild_6 == undefined) {
             View.create(new Banner("6", this, { value: "Hello" }));
         }
@@ -130,7 +134,7 @@ exports.expectResult =
         __Common__.create();
         __Common__.width(100);
         __Common__.height(200);
-        let earlierCreatedChild_7 = this.findChildById("7");
+        let earlierCreatedChild_7 = (this && this.findChildById) ? this.findChildById("7") : undefined;
         if (earlierCreatedChild_7 == undefined) {
             View.create(new Banner("7", this, { value: "Hello" }));
         }

compiler/test/ut/inner_commponent_transform/gesture_component/longPressGesture.ts

@@ -37,7 +37,11 @@ struct LongPressGestureExample {
 }`
 
 exports.expectResult =
-`class LongPressGestureExample extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "longPressGesture_" + ++__generate__Id;
+}
+class LongPressGestureExample extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__count = new ObservedPropertySimple(0, this, "count");

compiler/test/ut/inner_commponent_transform/gesture_component/panGestrue.ts

@@ -45,7 +45,11 @@ struct PanGestureExample {
 `
 
 exports.expectResult =
-`class PanGestureExample extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "panGestrue_" + ++__generate__Id;
+}
+class PanGestureExample extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__offsetX = new ObservedPropertySimple(0, this, "offsetX");

compiler/test/ut/inner_commponent_transform/gesture_component/pinchGesture.ts

@@ -41,7 +41,11 @@ struct PinchGestureExample {
 }`
 
 exports.expectResult =
-`class PinchGestureExample extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "pinchGesture_" + ++__generate__Id;
+}
+class PinchGestureExample extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__scale = new ObservedPropertySimple(1, this, "scale");

compiler/test/ut/inner_commponent_transform/gesture_component/rotationGesture.ts

@@ -41,7 +41,11 @@ struct RotationGestureExample {
 }`
 
 exports.expectResult =
-`class RotationGestureExample extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "rotationGesture_" + ++__generate__Id;
+}
+class RotationGestureExample extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__angle = new ObservedPropertySimple(0, this, "angle");

compiler/test/ut/inner_commponent_transform/gesture_component/swipeGesture.ts

@@ -39,7 +39,11 @@ struct SwipeGestureExample {
 }`
 
 exports.expectResult =
-`class SwipeGestureExample extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "swipeGesture_" + ++__generate__Id;
+}
+class SwipeGestureExample extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__rotateAngle = new ObservedPropertySimple(0, this, "rotateAngle");

compiler/test/ut/inner_commponent_transform/gesture_component/tapGesture.ts

@@ -35,7 +35,11 @@ struct TapGestureExample {
 }`
 
 exports.expectResult =
-`class TapGestureExample extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "tapGesture_" + ++__generate__Id;
+}
+class TapGestureExample extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__value = new ObservedPropertySimple('', this, "value");

compiler/test/ut/inner_commponent_transform/render_component/forEach/forEach.ts

@@ -102,7 +102,11 @@ struct MyComponent {
 }`
 
 exports.expectResult =
-`class Month {
+`let __generate__Id = 0;
+function generateId() {
+    return "forEach_" + ++__generate__Id;
+}
+class Month {
     constructor(year, month, days) {
         this.year = year;
         this.month = month;

compiler/test/ut/inner_commponent_transform/render_component/if/if.ts

@@ -54,6 +54,10 @@ struct MyComponent {
 exports.expectResult =
 `"use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+let __generate__Id = 0;
+function generateId() {
+    return "if_" + ++__generate__Id;
+}
 const TestComponent_1 = require("./test/pages/TestComponent");
 const TsModule_1 = require("./test/pages/TsModule");
 class MyComponent extends View {
@@ -112,7 +116,7 @@ class MyComponent extends View {
         If.create();
         if (TsModule_1.Animal.Dog) {
             If.branchId(0);
-            let earlierCreatedChild_2 = this.findChildById("2");
+            let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
             if (earlierCreatedChild_2 == undefined) {
                 View.create(new TestComponent_1.TestComponent("2", this, { content: 'if (import enum)' }));
             }

compiler/test/ut/inner_commponent_transform/render_component/lazyForEach/lazyForEach.ts

@@ -107,7 +107,11 @@ struct MyComponent {
 }`
 
 exports.expectResult =
-`class BasicDataSource {
+`let __generate__Id = 0;
+function generateId() {
+    return "lazyForEach_" + ++__generate__Id;
+}
+class BasicDataSource {
     constructor() {
         this.listeners = [];
     }

compiler/test/ut/inner_commponent_transform/simple_component/button/button.ts

@@ -34,7 +34,11 @@ struct ButtonExample {
 }
 `
 exports.expectResult =
-`class ButtonExample extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "button_" + ++__generate__Id;
+}
+class ButtonExample extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.updateWithValueParams(params);

compiler/test/ut/inner_commponent_transform/transition_component/animateTo/animateTo.ts

@@ -58,7 +58,11 @@ struct TransitionExample {
 `
 
 exports.expectResult =
-`class TransitionExample extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "animateTo_" + ++__generate__Id;
+}
+class TransitionExample extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__btnW = new ObservedPropertySimple(50, this, "btnW");

compiler/test/ut/inner_commponent_transform/transition_component/pageTransition/pageTransition.ts

@@ -46,7 +46,11 @@ struct PageTransitionExample1 {
 `
 
 exports.expectResult =
-`class PageTransitionExample1 extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "pageTransition_" + ++__generate__Id;
+}
+class PageTransitionExample1 extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__scale = new ObservedPropertySimple(1, this, "scale");

compiler/test/ut/render_decorator/@builder/@builder.ts

@@ -142,13 +142,17 @@ struct MyComponent {
 }
 `
 exports.expectResult =
-`function noParam() {
+`let __generate__Id = 0;
+function generateId() {
+    return "@builder_" + ++__generate__Id;
+}
+function noParam(parent = undefined) {
     Row.create();
     Text.create('this is a no param builder');
     Text.pop();
     Row.pop();
 }
-function specificParam(label1, label2) {
+function specificParam(label1, label2, parent = undefined) {
     Column.create();
     Text.create(label1);
     Text.pop();
@@ -223,7 +227,7 @@ class MyComponent extends View {
             console.log('Text onDragStarts, ' + extraParams);
         });
         Text.pop();
-        specificParam('test1', 'test2');
+        specificParam('test1', 'test2', this);
         Row.pop();
         Row.create();
         Row.padding(10);

compiler/test/ut/render_decorator/@builder/@builderWithLinkData.ts

@@ -38,7 +38,11 @@ struct TestPage{
 }
 `
 exports.expectResult =
-`class TitleComp extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "@builderWithLinkData_" + ++__generate__Id;
+}
+class TitleComp extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__title = new SynchedPropertySimpleTwoWay(params.title, this, "title");
@@ -83,9 +87,9 @@ class TestPage extends View {
         this.__value.set(newValue);
     }
     TitleCompView(parent = undefined) {
-        let earlierCreatedChild_2 = (parent ? parent : this).findChildById("2");
+        let earlierCreatedChild_2 = ((parent ? parent : this) && (parent ? parent : this).findChildById) ? (parent ? parent : this).findChildById(generateId()) : undefined;
         if (earlierCreatedChild_2 == undefined) {
-            View.create(new TitleComp("2", parent ? parent : this, { title: this.__value }));
+            View.create(new TitleComp("@builderWithLinkData_" + __generate__Id, parent ? parent : this, { title: this.__value }));
         }
         else {
             earlierCreatedChild_2.updateWithValueParams({});

compiler/test/ut/render_decorator/@builderParam/@builderParam.ts

@@ -96,6 +96,10 @@ struct CustomContainerUser {
 exports.expectResult =
 `"use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+let __generate__Id = 0;
+function generateId() {
+    return "@builderParam_" + ++__generate__Id;
+}
 const TestComponent_1 = require("./test/pages/TestComponent");
 class CustomContainer extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
@@ -191,7 +195,7 @@ class CustomContainerUser extends View {
     }
     render() {
         Column.create();
-        let earlierCreatedChild_2 = this.findChildById("2");
+        let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
         if (earlierCreatedChild_2 == undefined) {
             View.create(new TestComponent_1.CustomContainerExport("2", this, {
                 header: this.text,
@@ -220,7 +224,7 @@ class CustomContainerUser extends View {
             View.create(earlierCreatedChild_2);
         }
         Row.create();
-        let earlierCreatedChild_3 = this.findChildById("3");
+        let earlierCreatedChild_3 = (this && this.findChildById) ? this.findChildById("3") : undefined;
         if (earlierCreatedChild_3 == undefined) {
             View.create(new CustomContainer("3", this, {
                 header: this.text,
@@ -240,7 +244,7 @@ class CustomContainerUser extends View {
         }
         Row.pop();
         Row.create();
-        let earlierCreatedChild_4 = this.findChildById("4");
+        let earlierCreatedChild_4 = (this && this.findChildById) ? this.findChildById("4") : undefined;
         if (earlierCreatedChild_4 == undefined) {
             View.create(new CustomContainer2("4", this, {
                 header: this.text,

compiler/test/ut/render_decorator/@customDialog/@customDialog.ts

@@ -99,7 +99,11 @@ struct CustomDialogUser {
 `
 
 exports.expectResult =
-`class DialogExample extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "@customDialog_" + ++__generate__Id;
+}
+class DialogExample extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__count = new SynchedPropertySimpleOneWay(params.count, this, "count");

compiler/test/ut/render_decorator/@extend/@extend.ts

@@ -54,7 +54,11 @@ struct FancyUse {
 }
 `
 exports.expectResult =
-`function __Text__fancy(color) {
+`let __generate__Id = 0;
+function generateId() {
+    return "@extend_" + ++__generate__Id;
+}
+function __Text__fancy(color) {
     Text.backgroundColor(color);
 }
 function __Text__superFancy(size) {

compiler/test/ut/render_decorator/@preview/@preview.ts

@@ -37,7 +37,11 @@ struct HomePreviewComponent_Preview {
 `
 
 exports.expectResult =
-`class HomePreviewComponent extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "@preview_" + ++__generate__Id;
+}
+class HomePreviewComponent extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.value = "hello world";
@@ -69,7 +73,7 @@ class HomePreviewComponent_Preview extends View {
     }
     render() {
         Column.create();
-        let earlierCreatedChild_2 = this.findChildById("2");
+        let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
         if (earlierCreatedChild_2 == undefined) {
             View.create(new HomePreviewComponent("2", this, {}));
         }

compiler/test/ut/render_decorator/@styles/@styles.ts

@@ -54,7 +54,11 @@ struct FancyUse {
 }`
 
 exports.expectResult =
-`class FancyUse extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "@styles_" + ++__generate__Id;
+}
+class FancyUse extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__enable = new ObservedPropertySimple(true, this, "enable");

compiler/test/ut/render_decorator/@styles/@stylesExport.ts

@@ -58,6 +58,10 @@ exports.expectResult =
 `"use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.FancyUseExp = void 0;
+let __generate__Id = 0;
+function generateId() {
+    return "@stylesExport_" + ++__generate__Id;
+}
 class FancyUseExp extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);

compiler/test/ut/ui_state_management/application_state_management/@storageLink/@storageLink.ts

@@ -48,7 +48,11 @@ struct MyComponent {
 }
 `
 exports.expectResult =
-`let varA = AppStorage.Link('varA');
+`let __generate__Id = 0;
+function generateId() {
+    return "@storageLink_" + ++__generate__Id;
+}
+let varA = AppStorage.Link('varA');
 let envLang = AppStorage.Prop('languageCode');
 class MyComponent extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {

compiler/test/ut/ui_state_management/application_state_management/@storageProp/@storageProp.ts

@@ -48,7 +48,11 @@ struct MyComponent {
 }
 `
 exports.expectResult =
-`let varA = AppStorage.Link('varA');
+`let __generate__Id = 0;
+function generateId() {
+    return "@storageProp_" + ++__generate__Id;
+}
+let varA = AppStorage.Link('varA');
 let envLang = AppStorage.Prop('languageCode');
 class MyComponent extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {

compiler/test/ut/ui_state_management/application_state_management/appStorage/appStorage.ts

@@ -48,7 +48,11 @@ struct MyComponent {
 }
 `
 exports.expectResult =
-`let varA = AppStorage.Link('varA');
+`let __generate__Id = 0;
+function generateId() {
+    return "appStorage_" + ++__generate__Id;
+}
+let varA = AppStorage.Link('varA');
 let envLang = AppStorage.Prop('languageCode');
 class MyComponent extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {

compiler/test/ut/ui_state_management/application_state_management/localStorage/localStorage.ts

@@ -43,7 +43,11 @@ struct LocalStorageComponent {
 }
 `
 exports.expectResult =
-`let storage = LocalStorage.GetShared();
+`let __generate__Id = 0;
+function generateId() {
+    return "localStorage_" + ++__generate__Id;
+}
+let storage = LocalStorage.GetShared();
 class ClassA {
     constructor(a) {
         this.id = 1;

compiler/test/ut/ui_state_management/inner_struct_state_management/@link/@link.ts

@@ -68,7 +68,11 @@ struct linkPage {
 }
 `
 exports.expectResult =
-`class linkComp extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "@link_" + ++__generate__Id;
+}
+class linkComp extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__buttonPlaying = new SynchedPropertySimpleTwoWay(params.buttonPlaying, this, "buttonPlaying");
@@ -184,7 +188,7 @@ class linkPage extends View {
     }
     render() {
         Column.create();
-        let earlierCreatedChild_2 = this.findChildById("2");
+        let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
         if (earlierCreatedChild_2 == undefined) {
             View.create(new linkComp("2", this, { buttonPlaying: this.__isPlaying, items: this.__itemsArr, obj: this.__peoples }));
         }

compiler/test/ut/ui_state_management/inner_struct_state_management/@prop/@prop.ts

@@ -64,7 +64,11 @@ struct PageComponent {
 }
 `
 exports.expectResult =
-`class ctComponent extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "@prop_" + ++__generate__Id;
+}
+class ctComponent extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__name = new SynchedPropertySimpleOneWay(params.name, this, "name");
@@ -178,7 +182,7 @@ class PageComponent extends View {
         Text.create('-1  - Nuggets in New Game');
         Text.pop();
         Button.pop();
-        let earlierCreatedChild_2 = this.findChildById("2");
+        let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
         if (earlierCreatedChild_2 == undefined) {
             View.create(new ctComponent("2", this, { name: 'xiaoming', canPlay: true, count: this.countDownStartValue, costOfOneAttempt: 2 }));
         }

compiler/test/ut/ui_state_management/inner_struct_state_management/@state/@state.ts

@@ -56,7 +56,11 @@ struct EntryComponent {
 }
 `
 exports.expectResult =
-`class Model {
+`let __generate__Id = 0;
+function generateId() {
+    return "@state_" + ++__generate__Id;
+}
+class Model {
     constructor(value) {
         this.value = value;
     }
@@ -134,7 +138,7 @@ class EntryComponent extends View {
     }
     render() {
         Column.create();
-        let earlierCreatedChild_2 = this.findChildById("2");
+        let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
         if (earlierCreatedChild_2 == undefined) {
             View.create(new MyComponent("2", this, { count: 1, increaseBy: 2 }));
         }
@@ -144,7 +148,7 @@ class EntryComponent extends View {
             });
             View.create(earlierCreatedChild_2);
         }
-        let earlierCreatedChild_3 = this.findChildById("3");
+        let earlierCreatedChild_3 = (this && this.findChildById) ? this.findChildById("3") : undefined;
         if (earlierCreatedChild_3 == undefined) {
             View.create(new MyComponent("3", this, { title: { value: 'Hello, World 2' }, count: 7 }));
         }

compiler/test/ut/ui_state_management/others/@consume_@provide/@consume_@provide.ts

@@ -59,7 +59,11 @@ struct CompC {
 }
 `
 exports.expectResult =
-`class CompA extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "@consume_@provide_" + ++__generate__Id;
+}
+class CompA extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__reviewVotes = new ObservedPropertySimple(0, this, "reviewVotes");
@@ -84,7 +88,7 @@ exports.expectResult =
     }
     render() {
         Column.create();
-        let earlierCreatedChild_2 = this.findChildById("2");
+        let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
         if (earlierCreatedChild_2 == undefined) {
             View.create(new CompB("2", this, {}));
         }
@@ -118,7 +122,7 @@ class CompB extends View {
     }
     render() {
         Column.create();
-        let earlierCreatedChild_3 = this.findChildById("3");
+        let earlierCreatedChild_3 = (this && this.findChildById) ? this.findChildById("3") : undefined;
         if (earlierCreatedChild_3 == undefined) {
             View.create(new CompC("3", this, {}));
         }

compiler/test/ut/ui_state_management/others/@observed_@objectLink/@observed_@objectLink.ts

@@ -63,6 +63,10 @@ exports.expectResult =
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+let __generate__Id = 0;
+function generateId() {
+    return "@observed_@objectLink_" + ++__generate__Id;
+}
 let NextID = 0;
 let ClassA = class ClassA {
     constructor(c) {
@@ -128,7 +132,7 @@ class ViewB extends View {
     render() {
         Column.create();
         Row.create();
-        let earlierCreatedChild_2 = this.findChildById("2");
+        let earlierCreatedChild_2 = (this && this.findChildById) ? this.findChildById("2") : undefined;
         if (earlierCreatedChild_2 == undefined) {
             View.create(new ViewA("2", this, { varA: this.varB.a }));
         }

compiler/test/ut/ui_state_management/others/@watch/@watch.ts

@@ -65,7 +65,11 @@ struct CompA {
 }
 `
 exports.expectResult =
-`class CompA extends View {
+`let __generate__Id = 0;
+function generateId() {
+    return "@watch_" + ++__generate__Id;
+}
+class CompA extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__shopBasket = new ObservedPropertyObject([7, 12, 47, 3], this, "shopBasket");