diff --git a/framework/tools/hcs-view/hcsWebView/src/MainEditor.js b/framework/tools/hcs-view/hcsWebView/src/MainEditor.js
index 60a9770d0836c367364161abf17868361efee975..eb57237678ae6d67bad9e319ffee161e7dae6daf 100644
--- a/framework/tools/hcs-view/hcsWebView/src/MainEditor.js
+++ b/framework/tools/hcs-view/hcsWebView/src/MainEditor.js
@@ -47,6 +47,43 @@ const BGPIC_WIDTH = 156;
 const BGPIC_HEIGHT = 112;
 const DRAWTEXT_OFFSETX = -3;
 const DRAWTEXT_OFFSETY = -3;
+const CONSTRUCTOR_OFFX = 100;
+const CONSTRUCTOR_OFFY = 100;
+
+const MAKECUT_X = 124;
+const MAKECUT_WIDTH = 8;
+const MAKECUT_HEIGHT = 32;
+const MAKECUT_DEFAULT_WIDTH = 132;
+const MAKECUT_DEFAULT_HEIGHT = 32;
+const MAKECUT_CENTERSEARCHATTRCUT_X = 8;
+const MAKECUT_CENTERSEARCHATTRCUT_WIDTH = 116;
+const MAKECUT_CLOSE_SEARCH_CUT_WIDTH = 16;
+const MAKECUT_CLOSE_SEARCH_CUT_HEIGHT = 16;
+const MAKECUT_CLOSE_SEARCH_CUT_DEFAULT_WIDTH = 16;
+const MAKECUT_CLOSE_SEARCH_CUT_DEFAULT_HEIGHT = 16;
+const MAKECUT_CENTERSEARCHCUT_X = 8;
+const MAKECUT_CENTERSEARCHCUT_WIDTH = 116;
+const MAKECUT_POPITEMFOCUSCUT_WIDTH = 148;
+const MAKECUT_POPITEMFOCUSCUT_DEFAULT_WIDTH = 148;
+const MAKECUT_SEARCHBGCUT_WIDTH = 494;
+const MAKECUT_SEARCHBGCUT_HEIGHT = 56;
+const MAKECUT_SEARCHBGCUT_DEFAULT_WIDTH = 494;
+const MAKECUT_SEARCHBGCUT_DEFAULT_HEIGHT = 56;
+const MAKECUT_CENTERRECTCUT_X = 8;
+const MAKECUT_CENTERRECTCUT_WIDTH = 116;
+const MAKECUT_CENTERFOCUSCUT_X = 8;
+const MAKECUT_CENTERFOCUSCUT_WIDTH = 116;
+const MAKECUT_ROOTICONCUT_WIDTH = 132;
+const MAKECUT_ROOTICONFOCUSCUT_WIDTH = 132;
+const MAKECUT_RECTANGLEFOCUSCUT_WIDTH = 132;
+const MAKECUT_NODE_ATTR_ICONCUT_HEIGHT = 8;
+const MAKECUT_NODE_ATTR_ICONCUT_DEFAULT_WIDTH = 8;
+const MAKECUT_NODE_ATTR_ICONCUT_DEFAULT_HEIGHT = 8;
+const MAKECUT_WHITECUT_WIDTH = 132;
+const MAKECUT_CIRCLECUT_CIRCLEOPENCUT_WIDTH = 20;
+const MAKECUT_CIRCLECUT_CIRCLEOPENCUT_HEIGHT = 20;
+const MAKECUT_CIRCLECUT_CIRCLEOPENCUT_DEFAULT_WIDTH = 20;
+const MAKECUT_CIRCLECUT_CIRCLEOPENCUT_DEFAULT_HEIGHT = 20;
 
 const MouseType = {
   DOWN: 1, // 按下
@@ -95,194 +132,208 @@ function getVsCodeTheme() {
 
 class MainEditor {
   constructor() {
-    this.files_ = {};
-    this.nodeCount_ = {};
-    this.filePoint_ = null;
-    this.rootPoint_ = null;
-    this.nodePoint_ = null;
-    this.offX_ = 100;
-    this.offY_ = 100;
-    this.searchKey = null;
-    this.touchQueue_ = [];
-    this.keyQueue_ = [];
-    this.dropAll_ = {
-      locked: false,
-      oldx: INIT_VALUE,
-      oldy: INIT_VALUE,
-    };
-    getVsCodeTheme();
-    this.nodeBtns = [];
-    this.nodeMoreBtns = [];
-    this.nodeBtnPoint_ = 0;
-    this.nodeMoreBtnPoint_ = 0;
-    XMessage.gi().registRecvCallback(this.onReceive);
-    XMessage.gi().send('inited', '');
-    AttrEditor.gi().freshEditor();
+    this.constructorParam();
 
-    this.sltInclude = new XSelect(['a', 'b', 'c'], 'b');
-    this.sltInclude.registCallback(this.onSelectInclude);
-    NapiLog.registError(this.onError);
-    this.errorMsg_ = [];
-    this.cutImgDict_ = {};
-    this.initMainEditorWithInitValue();
-    this.selectNode_ = {
-      type: null,
-      pnode: null,
-    };
-    this.btnCancelSelect_ = new XButton();
+    this.constructorMakeCutOne();
 
-    AttrEditor.gi().registCallback(this.onAttributeChange);
+    this.constructorMakeCutTwo();
 
-    this.mousePos_ = {
-      x: 0,
-      y: 0,
-    };
+    this.constructorMakeCutThree();
+    this.constructorMakeCutFour();
+    this.constructorMakeCutFive();
+    this.upCut_ = XTexture.gi().makeCut(this.upImg_, 0, 0, 16, 16, 16, 16);
+    this.cutImgDict_.upCut = 'chevron-up.png';
 
-    this.whiteImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/rectangle.png'
+    this.downImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/chevron-down.png'
     );
-    this.whiteCut_ = XTexture.gi().makeCut(
-      this.whiteImg_,
-      0,
+    this.downCut_ = XTexture.gi().makeCut(this.downImg_, 0, 0, 16, 16, 16, 16);
+    this.cutImgDict_.downCut = 'chevron-down.png';
+
+    this.constructorMakeCutSix();
+    this.constructorMakeCutSev();
+
+    XMessage.gi().send('cutImgDict', {
+      data: this.cutImgDict_,
+    });
+    this.modifyPos_ = null;
+    this.isFirstDraw = true;
+    this.lenHierarchy = 0;
+
+    this.searchInput = null;
+    this.historyZ = [];
+    this.historyBase = {};
+    this.historyPushed = false;
+  }
+
+  constructorMakeCutSev() {
+    this.rightSearchFocusCicleCut_ = XTexture.gi().makeCut(
+      this.searchRectFocusCicleImg_,
+      MAKECUT_X,
       0,
-      132,
-      32,
-      132,
-      32
+      MAKECUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
-    this.cutImgDict_.whiteCut = 'rectangle.png';
+    this.cutImgDict_.searchNoodRectImg = 'search_nood_rect.png';
 
-    this.cicleImg_ = XTexture.gi().loadTextureFromImage('../images/circle.png');
-    this.circleCut_ = XTexture.gi().makeCut(
-      this.cicleImg_,
+    this.searchAttrCicleImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/search_attr_rect.png'
+    );
+    this.leftSearchAttrCicleCut_ = XTexture.gi().makeCut(
+      this.searchAttrCicleImg_,
       0,
       0,
-      20,
-      20,
-      20,
-      20
+      MAKECUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
-    this.cutImgDict_.circleCut = 'circle.png';
-
-    this.cicleOpenImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/circle_open.png'
-    );
-    this.circleOpenCut_ = XTexture.gi().makeCut(
-      this.cicleOpenImg_,
+    this.centerSearchAttrCut_ = XTexture.gi().makeCut(
+      this.searchAttrCicleImg_,
+      MAKECUT_CENTERSEARCHATTRCUT_X,
       0,
+      MAKECUT_CENTERSEARCHATTRCUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
+    );
+    this.rightSearchAttrCicleCut_ = XTexture.gi().makeCut(
+      this.searchAttrCicleImg_,
+      MAKECUT_X,
       0,
-      20,
-      20,
-      20,
-      20
+      MAKECUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
-    this.cutImgDict_.circleOpenCut = 'circle_open.png';
+    this.cutImgDict_.searchAttrRectImg = 'search_attr_rect.png';
+  }
 
-    this.rectangleFocusImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/rectangle_focus.png'
-    );
-    this.rectangleFocusCut_ = XTexture.gi().makeCut(
-      this.rectangleFocusImg_,
+  constructorMakeCutSix() {
+    this.closeImg_ = XTexture.gi().loadTextureFromImage('../images/close.png');
+    this.closeCut_ = XTexture.gi().makeCut(
+      this.closeImg_,
       0,
       0,
-      132,
-      32,
-      132,
-      32
+      MAKECUT_CLOSE_SEARCH_CUT_WIDTH,
+      MAKECUT_CLOSE_SEARCH_CUT_HEIGHT,
+      MAKECUT_CLOSE_SEARCH_CUT_DEFAULT_WIDTH,
+      MAKECUT_CLOSE_SEARCH_CUT_DEFAULT_HEIGHT
     );
-    this.cutImgDict_['rectangleFocusCut'] = 'rectangle_focus.png';
+    this.cutImgDict_.closeCut = 'close.png';
 
-    this.nodeIconImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/node_icon.png'
+    this.searchImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/search.png'
     );
-    this.nodeIconCut_ = XTexture.gi().makeCut(
-      this.nodeIconImg_,
+    this.searchCut_ = XTexture.gi().makeCut(
+      this.searchImg_,
       0,
       0,
-      8,
-      8,
-      8,
-      8
+      MAKECUT_CLOSE_SEARCH_CUT_WIDTH,
+      MAKECUT_CLOSE_SEARCH_CUT_HEIGHT,
+      MAKECUT_CLOSE_SEARCH_CUT_DEFAULT_WIDTH,
+      MAKECUT_CLOSE_SEARCH_CUT_DEFAULT_HEIGHT
     );
-    this.cutImgDict_['nodeIconCut'] = 'node_icon.png';
+    this.cutImgDict_.searchCut = 'search.png';
 
-    this.attrIconImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/attribute_icon.png'
+    this.searchRectFocusCicleImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/search_nood_rect.png'
     );
-    this.attrIconCut_ = XTexture.gi().makeCut(
-      this.attrIconImg_,
+    this.leftSearchFocusCicleCut_ = XTexture.gi().makeCut(
+      this.searchRectFocusCicleImg_,
       0,
       0,
-      8,
-      8,
-      8,
-      8
+      MAKECUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
-    this.cutImgDict_['attrIconCut'] = 'attribute_icon.png';
+    this.centerSearchCut_ = XTexture.gi().makeCut(
+      this.searchRectFocusCicleImg_,
+      MAKECUT_CENTERSEARCHCUT_X,
+      0,
+      MAKECUT_CENTERSEARCHCUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
+    );
+  }
 
-    this.rootIconImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/root_btn.png'
+  constructorMakeCutFive() {
+    this.rightRectFocusCicleImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/rectangle_focus.png'
     );
-    this.rootIconCut_ = XTexture.gi().makeCut(
-      this.rootIconImg_,
-      0,
+    this.rightRectFocusCicleCut_ = XTexture.gi().makeCut(
+      this.rightRectFocusCicleImg_,
+      MAKECUT_X,
       0,
-      132,
-      32,
-      132,
-      32
+      MAKECUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
-    this.cutImgDict_['rootIconCut'] = 'root_btn.png';
 
-    this.rootIconFocusImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/root_btn_focus.png'
+    this.reloadBgPic();
+
+    RightMenu.popItemFocusImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/pop_item_focus.png'
     );
-    this.rootIconFocusCut_ = XTexture.gi().makeCut(
-      this.rootIconFocusImg_,
+    RightMenu.popItemFocusCut_ = XTexture.gi().makeCut(
+      RightMenu.popItemFocusImg_,
       0,
       0,
-      132,
-      32,
-      132,
-      32
+      MAKECUT_POPITEMFOCUSCUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_POPITEMFOCUSCUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
-    this.cutImgDict_['rootIconFocusCut'] = 'root_btn_focus.png';
+    this.cutImgDict_.popItemFocusCut = 'pop_item_focus.png';
 
-    this.leftRectCicleImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/rectangle.png'
+    this.searchBgImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/search_bg.png'
     );
-    this.leftRectCicleCut_ = XTexture.gi().makeCut(
-      this.leftRectCicleImg_,
+    this.searchBgCut_ = XTexture.gi().makeCut(
+      this.searchBgImg_,
       0,
       0,
-      8,
-      32,
-      132,
-      32
+      MAKECUT_SEARCHBGCUT_WIDTH,
+      MAKECUT_SEARCHBGCUT_HEIGHT,
+      MAKECUT_SEARCHBGCUT_DEFAULT_WIDTH,
+      MAKECUT_SEARCHBGCUT_DEFAULT_HEIGHT
+    );
+    this.cutImgDict_.searchBgCut = 'search_bg.png';
+
+    this.upImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/chevron-up.png'
     );
+  }
+
+  constructorMakeCutFour() {
     this.centerRectImg_ = XTexture.gi().loadTextureFromImage(
       '../images/rectangle.png'
     );
     this.centerRectCut_ = XTexture.gi().makeCut(
       this.centerRectImg_,
-      8,
+      MAKECUT_CENTERRECTCUT_X,
       0,
-      116,
-      32,
-      132,
-      32
+      MAKECUT_CENTERRECTCUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
     this.rightRectCicleImg_ = XTexture.gi().loadTextureFromImage(
       '../images/rectangle.png'
     );
     this.rightRectCicleCut_ = XTexture.gi().makeCut(
       this.rightRectCicleImg_,
-      124,
+      MAKECUT_X,
       0,
-      8,
-      32,
-      132,
-      32
+      MAKECUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
 
     this.leftRectFocusCicleImg_ = XTexture.gi().loadTextureFromImage(
@@ -292,179 +343,197 @@ class MainEditor {
       this.leftRectFocusCicleImg_,
       0,
       0,
-      8,
-      32,
-      132,
-      32
+      MAKECUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
     this.centerFocusImg_ = XTexture.gi().loadTextureFromImage(
       '../images/rectangle_focus.png'
     );
     this.centerFocusCut_ = XTexture.gi().makeCut(
       this.centerFocusImg_,
-      8,
+      MAKECUT_CENTERFOCUSCUT_X,
       0,
-      116,
-      32,
-      132,
-      32
+      MAKECUT_CENTERFOCUSCUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
-    this.rightRectFocusCicleImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/rectangle_focus.png'
+  }
+
+  constructorMakeCutThree() {
+    this.rootIconImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/root_btn.png'
     );
-    this.rightRectFocusCicleCut_ = XTexture.gi().makeCut(
-      this.rightRectFocusCicleImg_,
-      124,
+    this.rootIconCut_ = XTexture.gi().makeCut(
+      this.rootIconImg_,
+      0,
       0,
-      8,
-      32,
-      132,
-      32
+      MAKECUT_ROOTICONCUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
+    this.cutImgDict_.rootIconCut = 'root_btn.png';
 
-    this.reloadBgPic();
-
-    RightMenu.popItemFocusImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/pop_item_focus.png'
+    this.rootIconFocusImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/root_btn_focus.png'
     );
-    RightMenu.popItemFocusCut_ = XTexture.gi().makeCut(
-      RightMenu.popItemFocusImg_,
+    this.rootIconFocusCut_ = XTexture.gi().makeCut(
+      this.rootIconFocusImg_,
       0,
       0,
-      148,
-      32,
-      148,
-      32
+      MAKECUT_ROOTICONFOCUSCUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
-    this.cutImgDict_['popItemFocusCut'] = 'pop_item_focus.png';
+    this.cutImgDict_.rootIconFocusCut = 'root_btn_focus.png';
 
-    this.searchBgImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/search_bg.png'
+    this.leftRectCicleImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/rectangle.png'
     );
-    this.searchBgCut_ = XTexture.gi().makeCut(
-      this.searchBgImg_,
+    this.leftRectCicleCut_ = XTexture.gi().makeCut(
+      this.leftRectCicleImg_,
       0,
       0,
-      494,
-      56,
-      494,
-      56
-    );
-    this.cutImgDict_['searchBgCut'] = 'search_bg.png';
-
-    this.upImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/chevron-up.png'
+      MAKECUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
-    this.upCut_ = XTexture.gi().makeCut(this.upImg_, 0, 0, 16, 16, 16, 16);
-    this.cutImgDict_['upCut'] = 'chevron-up.png';
+  }
 
-    this.downImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/chevron-down.png'
+  constructorMakeCutTwo() {
+    this.rectangleFocusImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/rectangle_focus.png'
     );
-    this.downCut_ = XTexture.gi().makeCut(this.downImg_, 0, 0, 16, 16, 16, 16);
-    this.cutImgDict_['downCut'] = 'chevron-down.png';
-
-    this.closeImg_ = XTexture.gi().loadTextureFromImage('../images/close.png');
-    this.closeCut_ = XTexture.gi().makeCut(
-      this.closeImg_,
+    this.rectangleFocusCut_ = XTexture.gi().makeCut(
+      this.rectangleFocusImg_,
       0,
       0,
-      16,
-      16,
-      16,
-      16
+      MAKECUT_RECTANGLEFOCUSCUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
-    this.cutImgDict_['closeCut'] = 'close.png';
+    this.cutImgDict_.rectangleFocusCut = 'rectangle_focus.png';
 
-    this.searchImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/search.png'
+    this.nodeIconImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/node_icon.png'
     );
-    this.searchCut_ = XTexture.gi().makeCut(
-      this.searchImg_,
+    this.nodeIconCut_ = XTexture.gi().makeCut(
+      this.nodeIconImg_,
       0,
       0,
-      16,
-      16,
-      16,
-      16
+      MAKECUT_WIDTH,
+      MAKECUT_NODE_ATTR_ICONCUT_HEIGHT,
+      MAKECUT_NODE_ATTR_ICONCUT_DEFAULT_WIDTH,
+      MAKECUT_NODE_ATTR_ICONCUT_DEFAULT_HEIGHT
     );
-    this.cutImgDict_['searchCut'] = 'search.png';
+    this.cutImgDict_.nodeIconCut = 'node_icon.png';
 
-    this.searchRectFocusCicleImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/search_nood_rect.png'
+    this.attrIconImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/attribute_icon.png'
     );
-    this.leftSearchFocusCicleCut_ = XTexture.gi().makeCut(
-      this.searchRectFocusCicleImg_,
+    this.attrIconCut_ = XTexture.gi().makeCut(
+      this.attrIconImg_,
       0,
       0,
-      8,
-      32,
-      132,
-      32
+      MAKECUT_WIDTH,
+      MAKECUT_NODE_ATTR_ICONCUT_HEIGHT,
+      MAKECUT_NODE_ATTR_ICONCUT_DEFAULT_WIDTH,
+      MAKECUT_NODE_ATTR_ICONCUT_DEFAULT_HEIGHT
     );
-    this.centerSearchCut_ = XTexture.gi().makeCut(
-      this.searchRectFocusCicleImg_,
-      8,
-      0,
-      116,
-      32,
-      132,
-      32
+    this.cutImgDict_.attrIconCut = 'attribute_icon.png';
+  }
+
+  constructorMakeCutOne() {
+    this.whiteImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/rectangle.png'
     );
-    this.rightSearchFocusCicleCut_ = XTexture.gi().makeCut(
-      this.searchRectFocusCicleImg_,
-      124,
+    this.whiteCut_ = XTexture.gi().makeCut(
+      this.whiteImg_,
       0,
-      8,
-      32,
-      132,
-      32
+      0,
+      MAKECUT_WHITECUT_WIDTH,
+      MAKECUT_HEIGHT,
+      MAKECUT_DEFAULT_WIDTH,
+      MAKECUT_DEFAULT_HEIGHT
     );
-    this.cutImgDict_['searchNoodRectImg'] = 'search_nood_rect.png';
+    this.cutImgDict_.whiteCut = 'rectangle.png';
 
-    this.searchAttrCicleImg_ = XTexture.gi().loadTextureFromImage(
-      '../images/search_attr_rect.png'
-    );
-    this.leftSearchAttrCicleCut_ = XTexture.gi().makeCut(
-      this.searchAttrCicleImg_,
+    this.cicleImg_ = XTexture.gi().loadTextureFromImage('../images/circle.png');
+    this.circleCut_ = XTexture.gi().makeCut(
+      this.cicleImg_,
       0,
       0,
-      8,
-      32,
-      132,
-      32
+      MAKECUT_CIRCLECUT_CIRCLEOPENCUT_WIDTH,
+      MAKECUT_CIRCLECUT_CIRCLEOPENCUT_HEIGHT,
+      MAKECUT_CIRCLECUT_CIRCLEOPENCUT_DEFAULT_WIDTH,
+      MAKECUT_CIRCLECUT_CIRCLEOPENCUT_DEFAULT_HEIGHT
     );
-    this.centerSearchAttrCut_ = XTexture.gi().makeCut(
-      this.searchAttrCicleImg_,
-      8,
-      0,
-      116,
-      32,
-      132,
-      32
+    this.cutImgDict_.circleCut = 'circle.png';
+
+    this.cicleOpenImg_ = XTexture.gi().loadTextureFromImage(
+      '../images/circle_open.png'
     );
-    this.rightSearchAttrCicleCut_ = XTexture.gi().makeCut(
-      this.searchAttrCicleImg_,
-      124,
+    this.circleOpenCut_ = XTexture.gi().makeCut(
+      this.cicleOpenImg_,
+      0,
       0,
-      8,
-      32,
-      132,
-      32
+      MAKECUT_CIRCLECUT_CIRCLEOPENCUT_WIDTH,
+      MAKECUT_CIRCLECUT_CIRCLEOPENCUT_HEIGHT,
+      MAKECUT_CIRCLECUT_CIRCLEOPENCUT_DEFAULT_WIDTH,
+      MAKECUT_CIRCLECUT_CIRCLEOPENCUT_DEFAULT_HEIGHT
     );
-    this.cutImgDict_['searchAttrRectImg'] = 'search_attr_rect.png';
+    this.cutImgDict_.circleOpenCut = 'circle_open.png';
+  }
 
-    XMessage.gi().send('cutImgDict', {
-      data: this.cutImgDict_,
-    });
-    this.modifyPos_ = null;
-    this.isFirstDraw = true;
-    this.lenHierarchy = 0;
+  constructorParam() {
+    this.files_ = {};
+    this.nodeCount_ = {};
+    this.filePoint_ = null;
+    this.rootPoint_ = null;
+    this.nodePoint_ = null;
+    this.offX_ = CONSTRUCTOR_OFFX;
+    this.offY_ = CONSTRUCTOR_OFFY;
+    this.searchKey = null;
+    this.touchQueue_ = [];
+    this.keyQueue_ = [];
+    this.dropAll_ = {
+      locked: false,
+      oldx: INIT_VALUE,
+      oldy: INIT_VALUE,
+    };
+    getVsCodeTheme();
+    this.nodeBtns = [];
+    this.nodeMoreBtns = [];
+    this.nodeBtnPoint_ = 0;
+    this.nodeMoreBtnPoint_ = 0;
+    XMessage.gi().registRecvCallback(this.onReceive);
+    XMessage.gi().send('inited', '');
+    AttrEditor.gi().freshEditor();
 
-    this.searchInput = null;
-    this.historyZ = [];
-    this.historyBase = {};
-    this.historyPushed = false;
+    this.sltInclude = new XSelect(['a', 'b', 'c'], 'b');
+    this.sltInclude.registCallback(this.onSelectInclude);
+    NapiLog.registError(this.onError);
+    this.errorMsg_ = [];
+    this.cutImgDict_ = {};
+    this.initMainEditorWithInitValue();
+    this.selectNode_ = {
+      type: null,
+      pnode: null,
+    };
+    this.btnCancelSelect_ = new XButton();
+
+    AttrEditor.gi().registCallback(this.onAttributeChange);
+
+    this.mousePos_ = {
+      x: 0,
+      y: 0,
+    };
   }
 
   initMainEditorWithInitValue() {
@@ -1450,24 +1519,7 @@ class MainEditor {
     const DELETE = 7;
     if (this.searchInput) {
       if (XTools.InRect(x, y, ...this.searchInput.pos)) {
-        if (this.searchInput.btnUp.procTouch(msg, x, y)) {
-          if (this.searchInput.btnUp.isClicked()) {
-            this.searchInput.point -= 1;
-            if (this.searchInput.point < 0) {
-              this.searchInput.point = this.searchInput.result.length - 1;
-            }
-            this.locateNode(this.searchInput.result[this.searchInput.point]);
-          }
-        }
-        if (this.searchInput.btnDown.procTouch(msg, x, y)) {
-          if (this.searchInput.btnDown.isClicked()) {
-            this.searchInput.point += 1;
-            if (this.searchInput.point >= this.searchInput.result.length) {
-              this.searchInput.point = 0;
-            }
-            this.locateNode(this.searchInput.result[this.searchInput.point]);
-          }
-        }
+        this.procTouchInRect(msg, x, y);
         return true;
       } else {
         if (msg === MouseType.DOWN) {
@@ -1503,47 +1555,7 @@ class MainEditor {
 
     for (let i = 0; i < this.nodeBtns.length; i++) {
       if (this.nodeBtns[i].procTouch(msg, x, y)) {
-        let nodeBtns = this.nodeBtns[i];
-        if (nodeBtns.isClicked()) {
-          this.buttonClickedProc(nodeBtns);
-        } else if (nodeBtns.isRightClicked()) {
-          this.onAttributeChange('change_current_select', nodeBtns.node_);
-          switch (nodeBtns.node_.type_) {
-            case ADD:
-              RightMenu.Reset(
-                [
-                  RightMenu.Button(null, 'Add Child Node', null, () => {
-                    this.procAddNodeAction();
-                    this.onAttributeChange('writefile');
-                  }),
-                  RightMenu.Button(null, 'Add Sub Property', null, () => {
-                    this.procAddAttAction();
-                    this.onAttributeChange('writefile');
-                  }),
-                  RightMenu.Button(null, 'Delete', null, () => {
-                    this.procDeleteAction();
-                    this.onAttributeChange('writefile');
-                  }),
-                ],
-                nodeBtns.posX_,
-                nodeBtns.posY_ + MainEditor.NODE_RECT_HEIGHT
-              );
-              break;
-            case DELETE:
-              RightMenu.Reset(
-                [
-                  RightMenu.Button(null, 'Delete', null, () => {
-                    this.procDeleteAction();
-                    this.onAttributeChange('writefile');
-                  }),
-                ],
-                nodeBtns.posX_,
-                nodeBtns.posY_ + MainEditor.NODE_RECT_HEIGHT
-              );
-              break;
-          }
-        }
-
+        this.procTouchForNodeBtns(i, ADD, DELETE);
         return true;
       }   
   }
@@ -1573,6 +1585,70 @@ class MainEditor {
     return false;
   }
 
+  procTouchForNodeBtns(i, ADD, DELETE) {
+    let nodeBtns = this.nodeBtns[i];
+    if (nodeBtns.isClicked()) {
+      this.buttonClickedProc(nodeBtns);
+    } else if (nodeBtns.isRightClicked()) {
+      this.onAttributeChange('change_current_select', nodeBtns.node_);
+      switch (nodeBtns.node_.type_) {
+        case ADD:
+          RightMenu.Reset(
+            [
+              RightMenu.Button(null, 'Add Child Node', null, () => {
+                this.procAddNodeAction();
+                this.onAttributeChange('writefile');
+              }),
+              RightMenu.Button(null, 'Add Sub Property', null, () => {
+                this.procAddAttAction();
+                this.onAttributeChange('writefile');
+              }),
+              RightMenu.Button(null, 'Delete', null, () => {
+                this.procDeleteAction();
+                this.onAttributeChange('writefile');
+              }),
+            ],
+            nodeBtns.posX_,
+            nodeBtns.posY_ + MainEditor.NODE_RECT_HEIGHT
+          );
+          break;
+        case DELETE:
+          RightMenu.Reset(
+            [
+              RightMenu.Button(null, 'Delete', null, () => {
+                this.procDeleteAction();
+                this.onAttributeChange('writefile');
+              }),
+            ],
+            nodeBtns.posX_,
+            nodeBtns.posY_ + MainEditor.NODE_RECT_HEIGHT
+          );
+          break;
+      }
+    }
+  }
+
+  procTouchInRect(msg, x, y) {
+    if (this.searchInput.btnUp.procTouch(msg, x, y)) {
+      if (this.searchInput.btnUp.isClicked()) {
+        this.searchInput.point -= 1;
+        if (this.searchInput.point < 0) {
+          this.searchInput.point = this.searchInput.result.length - 1;
+        }
+        this.locateNode(this.searchInput.result[this.searchInput.point]);
+      }
+    }
+    if (this.searchInput.btnDown.procTouch(msg, x, y)) {
+      if (this.searchInput.btnDown.isClicked()) {
+        this.searchInput.point += 1;
+        if (this.searchInput.point >= this.searchInput.result.length) {
+          this.searchInput.point = 0;
+        }
+        this.locateNode(this.searchInput.result[this.searchInput.point]);
+      }
+    }
+  }
+
   procAddNodeAction() {
     let pattr = AttrEditor.gi();
     pattr.changeDataNodeNotInherit('add_child_node', 'button', '');
@@ -1882,100 +1958,167 @@ class MainEditor {
       Lexer.FILE_AND_DATA[data.fn] = data.data;
       me.parse(data.fn);
     } else if (type === 'freshfiledata') {
-      me.saveHistory(data.fn, data.data, null, 3);
-      Lexer.FILE_AND_DATA[data.fn] = data.data;
+      this.onReceiveFresh(me, data);
     } else if (type === 'whiteCutImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initCutData(wurl);
+      this.onReceiveWhiteCut(data, me);
     } else if (type === 'circleImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initCicleImgData(wurl);
+      this.onReceiveCircle(data, me);
     } else if (type === 'cicleOpenImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initcicleOpenImgData(wurl);
+      this.onReceiveCicleOpen(data, me);
     } else if (type === 'rectangleFocusImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initRectangleFocusImgData(wurl);
+      this.onReceiveRectangleFocus(data, me);
     } else if (type === 'nodeIconImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initNodeIconImgData(wurl);
+      this.onReceiveNodeIcon(data, me);
     } else if (type === 'attrIconImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initAttrIconImgData(wurl);
+      this.onReceiveAttrIcon(data, me);
     } else if (type === 'rootIconImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initRootIconImgData(wurl);
+      this.onReceiveRootIcon(data, me);
     } else if (type === 'rootIconFocusImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initRootIconFocusImgData(wurl);
+      this.onReceiveRootIconFocus(data, me);
     } else if (type === 'backgroundImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initBackgroundImgData(wurl);
+      this.onReceiveBackground(data, me);
     } else if (type === 'popItemFocusImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initPopItemFocusImgData(wurl);
+      this.onReceivePopItemFocus(data, me);
     } else if (type === 'colorThemeChanged') {
       me.reloadMenuBgPic();
     } else if (type === 'searchBgImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initSearchBgImgData(wurl);
+      this.onReceiveSearchBg(data, me);
     } else if (type === 'upCutImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initUpImgData(wurl);
+      this.onReceiveUpCut(data, me);
     } else if (type === 'downCut') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initDownImgData(wurl);
+      this.onReceiveDownCut(data, me);
     } else if (type === 'closeCutImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initCloseImgData(wurl);
+      this.onReceiveCloseCut(data, me);
     } else if (type === 'searchCutImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
-      me.initSearchImgData(wurl);
-    } else if (type === 'searchNoodRectImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
+      this.onReceiveSearchCut(data, me);
+    } else if (type === 'searchNoodRectImg' || type === 'searchAttrRectImg') {
+      this.onReceiveSearchRect(data, type, me);
+    } else {
+      NapiLog.logError('onReceive is not need');
+    }
+  }
+
+  onReceiveSearchRect(data, type, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    if (type === 'searchNoodRectImg') {
       me.initSearchNoodRectImgData(wurl);
     } else if (type === 'searchAttrRectImg') {
-      let u8arr = new Uint8Array(data.data);
-      let imgobj = new Blob([u8arr], { type: 'image/png' });
-      let wurl = window.URL.createObjectURL(imgobj);
       me.initSearchAttrRectImgData(wurl);
-    } else {
-      NapiLog.logError('onReceive is not need');
     }
   }
 
+  onReceiveFresh(me, data) {
+    me.saveHistory(data.fn, data.data, null, 3);
+    Lexer.FILE_AND_DATA[data.fn] = data.data;
+  }
+
+  onReceivePopItemFocus(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initPopItemFocusImgData(wurl);
+  }
+
+  onReceiveSearchCut(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initSearchImgData(wurl);
+  }
+
+  onReceiveCloseCut(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initCloseImgData(wurl);
+  }
+
+  onReceiveDownCut(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initDownImgData(wurl);
+  }
+
+  onReceiveUpCut(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initUpImgData(wurl);
+  }
+
+  onReceiveSearchBg(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initSearchBgImgData(wurl);
+  }
+
+  onReceiveBackground(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initBackgroundImgData(wurl);
+  }
+
+  onReceiveRootIconFocus(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initRootIconFocusImgData(wurl);
+  }
+
+  onReceiveRootIcon(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initRootIconImgData(wurl);
+  }
+
+  onReceiveAttrIcon(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initAttrIconImgData(wurl);
+  }
+
+  onReceiveNodeIcon(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initNodeIconImgData(wurl);
+  }
+
+  onReceiveRectangleFocus(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initRectangleFocusImgData(wurl);
+  }
+
+  onReceiveCicleOpen(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initcicleOpenImgData(wurl);
+  }
+
+  onReceiveCircle(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initCicleImgData(wurl);
+  }
+
+  onReceiveWhiteCut(data, me) {
+    let u8arr = new Uint8Array(data.data);
+    let imgobj = new Blob([u8arr], { type: 'image/png' });
+    let wurl = window.URL.createObjectURL(imgobj);
+    me.initCutData(wurl);
+  }
+
   initSearchAttrRectImgData(wurl) {
     const HEIGHT = 32;
     const NEW_WIDTH = 132;
diff --git a/framework/tools/hcs-view/hcsWebView/src/engine/control/XSelect.js b/framework/tools/hcs-view/hcsWebView/src/engine/control/XSelect.js
index 2a56656209413fbd2c170385038eb8dadcdb0bf4..e1d17a841fbf1cecec2ab65401c1178c9f33f914 100644
--- a/framework/tools/hcs-view/hcsWebView/src/engine/control/XSelect.js
+++ b/framework/tools/hcs-view/hcsWebView/src/engine/control/XSelect.js
@@ -15,6 +15,7 @@
 
 const { X2DFast } = require('../graphics/X2DFast');
 const HEIGHT = 20;
+const INVALID = -1;
 
 class XSelect {
   constructor(list, default_) {
@@ -49,22 +50,7 @@ class XSelect {
     let model = 3;
 
     this.pm2f_.fillRect(x, y, w, h, this.backgroundColor_);
-    let name = '...';
-    if (this.default_.indexOf('\\') !== -1) {
-      let list = this.default_.split('\\');
-      if (list.length > model) {
-        for (let i = list.length - model; i < list.length; i++) {
-          name += list[i];
-          if (i !== list.length - 1) {
-            name += '\\';
-          }
-        }
-      } else {
-        name = this.default_;
-      }
-    } else {
-      name = this.default_;
-    }
+    let name = this.drawFunc(model);
     this.pm2f_.drawText(name, 16, x, y, 1, 1, 0, -1, -1, this.nameColor_);
     if (this.open_) {
       this.pm2f_.fillRect(x, y + h, w, HEIGHT * this.list_.length, this.backgroundColor_);
@@ -106,6 +92,26 @@ class XSelect {
       }
     }
   }
+  drawFunc(model) {
+    let name = '...';
+    if (this.default_.indexOf('\\') !== INVALID) {
+      let list = this.default_.split('\\');
+      if (list.length > model) {
+        for (let i = list.length - model; i < list.length; i++) {
+          name += list[i];
+          if (i !== list.length - 1) {
+            name += '\\';
+          }
+        }
+      } else {
+        name = this.default_;
+      }
+    } else {
+      name = this.default_;
+    }
+    return name;
+  }
+
   isTouchIn(x, y) {
     if (x < this.posX_) {
       return false;
diff --git a/framework/tools/hcs-view/hcsWebView/src/hcs/Generator.js b/framework/tools/hcs-view/hcsWebView/src/hcs/Generator.js
index 6827272cb65b68ff9310eff457edd79575a30504..b49dd5e62d81bbb1f4e952c39ba3f196b24050b9 100644
--- a/framework/tools/hcs-view/hcsWebView/src/hcs/Generator.js
+++ b/framework/tools/hcs-view/hcsWebView/src/hcs/Generator.js
@@ -89,14 +89,7 @@ class Generator {
         ret.value_ = this.astToObj(node.child_, ret);
         break;
       case DataType.ARRAY:
-        ret.value_ = [];
-        child = node.child_;
-        while (child !== undefined) {
-          ret.value_.push(this.astToObj(child, ret));
-          child = child.next_;
-        }
-        ret.arraySize_ = node.arraySize_;
-        ret.arrayType_ = node.arrayType_;
+        child = this.astToObjTypeArr(ret, child, node);
         break;
       case DataType.REFERENCE:
         ret.value_ = node.stringValue_;
@@ -105,12 +98,7 @@ class Generator {
         ret.value_ = null;
         break;
       case DataType.BOOL:
-        if (node.integerValue_ === 0) {
-          ret.value_ = false;
-        }
-        else {
-          ret.value_ = true;
-        }
+        this.astToObjTypeBool(node, ret);
         break;
       default:
         NapiLog.logError('unknow type');
@@ -119,6 +107,27 @@ class Generator {
     return ret;
   }
 
+  astToObjTypeBool(node, ret) {
+    if (node.integerValue_ === 0) {
+      ret.value_ = false;
+    }
+    else {
+      ret.value_ = true;
+    }
+  }
+
+  astToObjTypeArr(ret, child, node) {
+    ret.value_ = [];
+    child = node.child_;
+    while (child !== undefined) {
+      ret.value_.push(this.astToObj(child, ret));
+      child = child.next_;
+    }
+    ret.arraySize_ = node.arraySize_;
+    ret.arrayType_ = node.arrayType_;
+    return child;
+  }
+
   mergeObj(files) {
     let objList = [];
     for (let i in files) {
diff --git a/framework/tools/hcs-view/hcsWebView/src/hcs/NodeTools.js b/framework/tools/hcs-view/hcsWebView/src/hcs/NodeTools.js
index 1cacbd0eef3cc0806ab2a4dd1a37619454f1783d..cb0c2cc3c10d0fbc8c56dbf72d7811d74df1d0fc 100644
--- a/framework/tools/hcs-view/hcsWebView/src/hcs/NodeTools.js
+++ b/framework/tools/hcs-view/hcsWebView/src/hcs/NodeTools.js
@@ -21,6 +21,7 @@ const MAX_BINARY = 2;
 const MAX_OCTAL = 8;
 const MAX_HEXADECIMAL = 16;
 const STAT_SIZE = 100;
+const INVALID = -1;
 
 const DataType = {
   INT8: 1,
@@ -229,14 +230,7 @@ NodeTools.copyNode = function (node, parent) {
       ret.value_ = node.value_;
       break;
     case DataType.NODE:
-      ret.nodeType_ = node.nodeType_;
-      if ([NodeType.INHERIT, NodeType.COPY, NodeType.REFERENCE].indexOf(node.nodeType_) > -1) {
-        ret.ref_ = node.ref_;
-      } else if (!([NodeType.DATA, NodeType.TEMPLETE, NodeType.DELETE].indexOf(node.nodeType_) > -1)) {
-        NapiLog.logError('unknow node type:' + ret.lineno_);
-      }
-      ret.value_ = [];
-      for (let i in node.value_) { ret.value_.push(NodeTools.copyNode(node.value_[i], ret)); }
+      copyNodeTypeNode(ret, node);
       break;
     case DataType.ATTR:
       ret.value_ = NodeTools.copyNode(node.value_, ret);
@@ -261,6 +255,17 @@ NodeTools.copyNode = function (node, parent) {
   return ret;
 };
 
+function copyNodeTypeNode(ret, node) {
+  ret.nodeType_ = node.nodeType_;
+  if ([NodeType.INHERIT, NodeType.COPY, NodeType.REFERENCE].indexOf(node.nodeType_) > INVALID) {
+    ret.ref_ = node.ref_;
+  } else if (!([NodeType.DATA, NodeType.TEMPLETE, NodeType.DELETE].indexOf(node.nodeType_) > INVALID)) {
+    NapiLog.logError('unknow node type:' + ret.lineno_);
+  }
+  ret.value_ = [];
+  for (let i in node.value_) { ret.value_.push(NodeTools.copyNode(node.value_[i], ret)); }
+}
+
 function makeError(node, errStr) {
   if (node.raw_ !== undefined) {
     node.raw_.errMsg_ = errStr;
@@ -283,14 +288,7 @@ NodeTools.nodeNestCheck = function (node) {
 NodeTools.recursionCopyAndReferenceNodes = function (pn) {
   let ref = NodeTools.lookup(pn);
   if (ref === null) {
-    NapiLog.logError(
-      'reference not exist' + NodeTools.getPathByNode(pn) + ':' + pn.ref_
-    );
-    if (pn.nodeType_ === NodeType.COPY) {
-      makeError(pn, pn.name_ + ' 复制目标没找到!');
-    } else {
-      makeError(pn, pn.name_ + ' 引用目标没找到!');
-    }
+    recursionRefNull(pn);
     return false;
   } else if (ref.nodeType_ === NodeType.TEMPLETE) {
     if (pn.nodeType_ === NodeType.COPY) {
@@ -307,14 +305,7 @@ NodeTools.recursionCopyAndReferenceNodes = function (pn) {
     }
     return false;
   } else if (NodeTools.isElders(pn, ref)) {
-    NapiLog.logError(
-      'circular reference' + NodeTools.getPathByNode(pn) + ':' + pn.ref_
-    );
-    if (pn.nodeType_ === NodeType.COPY) {
-      makeError(pn, pn.name_ + ' 循环复制!');
-    } else {
-      makeError(pn, pn.name_ + ' 循环引用!');
-    }
+    recursionIsElders(pn);
     return false;
   } else if (pn.nodeType_ === NodeType.COPY) {
     if (ref.nodeType_ === NodeType.COPY) {
@@ -617,6 +608,28 @@ NodeTools.stringToArray = function (s) {
   return ret;
 };
 
+function recursionIsElders(pn) {
+  NapiLog.logError(
+    'circular reference' + NodeTools.getPathByNode(pn) + ':' + pn.ref_
+  );
+  if (pn.nodeType_ === NodeType.COPY) {
+    makeError(pn, pn.name_ + ' 循环复制!');
+  } else {
+    makeError(pn, pn.name_ + ' 循环引用!');
+  }
+}
+
+function recursionRefNull(pn) {
+  NapiLog.logError(
+    'reference not exist' + NodeTools.getPathByNode(pn) + ':' + pn.ref_
+  );
+  if (pn.nodeType_ === NodeType.COPY) {
+    makeError(pn, pn.name_ + ' 复制目标没找到!');
+  } else {
+    makeError(pn, pn.name_ + ' 引用目标没找到!');
+  }
+}
+
 function stringToArrayWithQuote(ret, type, arr) {
   for (let i in arr) {
     let num = NodeTools.jinZhiXTo10(arr[i]);
diff --git a/framework/tools/hcs-view/hcsWebView/test/public_moudle/base.py b/framework/tools/hcs-view/hcsWebView/test/public_moudle/base.py
index 86364203b5ad6e4d6938f571eb6f685d2246a399..c9c5a3b23fec1f39d19ea6097ba4c5bdef8c7053 100644
--- a/framework/tools/hcs-view/hcsWebView/test/public_moudle/base.py
+++ b/framework/tools/hcs-view/hcsWebView/test/public_moudle/base.py
@@ -30,6 +30,7 @@ class Base:
     def find_element(self, locator):
         if not isinstance(locator, tuple):
             print('The type of the locator parameter is tuple')
+            return None
         else:
             ele = WebDriverWait(self.driver, self.timeout, self.t).until(
                 EC.presence_of_element_located(locator))