no message

CocosCreatorInspector/src/content/index.js

@@ -28,8 +28,8 @@ conn.onMessage.addListener(function (data) {
 window.addEventListener('message', function (event) {
   let data = event.data;
   if (data.data.log) {
-    console.log(`%c[content] ${JSON.stringify(data)}`, "color:#BD4E19");
   }
+  console.log(`%c[content] ${JSON.stringify(data)}`, "color:#BD4E19");
   chrome.runtime.sendMessage(data);
 }, false);
 

CocosCreatorInspector/src/content/inject.js

@@ -16,12 +16,15 @@ let cc_inspector = {
   },
   init() {
     setInterval(function () {
-      // this.checkIsGamePage(false);
+      this.checkIsGamePage(true);
       // if (this.stop) {
       // } else {
       // }
     }.bind(this), 1000);
+    // 注册cc_after_render事件
 
+  },
+  updateTreeInfo() {
     let isCocosCreatorGame = this.checkIsGamePage(true);
     if (isCocosCreatorGame) {
       let scene = cc.director.getScene();
@@ -39,33 +42,29 @@ let cc_inspector = {
           this.getNodeChildren(node, this.postData.scene.children);
         }
         // console.log(postData);
-        this.sendMsgToDevTools(PluginMsg.Msg.ListInfo, {data: this.postData});
+        this.sendMsgToDevTools(PluginMsg.Msg.ListInfo, this.postData);
       } else {
         this.postData.scene = null;
         this.sendMsgToDevTools(PluginMsg.Msg.Support, {support: false, msg: "未发现游戏场景,不支持调试游戏!"});
       }
-    } else {
-      console.log("未发现cocos creator game");
     }
   },
   checkIsGamePage(isLog) {
-    debugger
     // 检测是否包含cc变量
     let isCocosCreatorGame = true;
+    let msg = "支持调试游戏!";
     try {
       cc
     } catch (e) {
       isCocosCreatorGame = false;
-      this.sendMsgToDevTools(PluginMsg.Msg.Support, {support: false, msg: "不支持调试游戏!",log:isLog});
+      msg = "不支持调试游戏!";
     }
+    this.sendMsgToDevTools(PluginMsg.Msg.Support, {support: isCocosCreatorGame, msg: msg, log: isLog});
     return isCocosCreatorGame;
   },
   testEval() {
     console.log("hello devtools eval")
   },
-  testMsg1() {
-    window.postMessage("testMsg1")
-  },
   testMsg2() {
     debugger
     chrome.runtime.connect({name: "inject"});
@@ -80,7 +79,7 @@ let cc_inspector = {
     let nodeComp = node._components;
     for (let i = 0; i < nodeComp.length; i++) {
       let itemComp = nodeComp[i];
-      window.inspectorGameMemoryStorage[itemComp.uuid] = itemComp;
+      this.inspectorGameMemoryStorage[itemComp.uuid] = itemComp;
       ret.push({
         uuid: itemComp.uuid,
         type: itemComp.constructor.name,
@@ -129,9 +128,9 @@ let cc_inspector = {
   },
   // 获取节点信息
   getNodeInfo(uuid) {
-    let node = window.inspectorGameMemoryStorage[uuid];
+    let node = this.inspectorGameMemoryStorage[uuid];
     if (node) {
-      let nodeComp = getNodeComponentsInfo(node);
+      let nodeComp = this.getNodeComponentsInfo(node);
       let nodeData = {
         type: node.constructor.name,
         uuid: node.uuid,
@@ -162,7 +161,7 @@ let cc_inspector = {
       } else {
         nodeData.active = node.active;
       }
-      window.sendMsgToDevTools(msgType.nodeInfo, nodeData);
+      this.sendMsgToDevTools(PluginMsg.Msg.NodeInfo, nodeData);
     } else {
       // 未获取到节点数据
       console.log("未获取到节点数据");
@@ -177,12 +176,12 @@ let cc_inspector = {
       name: node.name,
       children: [],
     };
-    window.inspectorGameMemoryStorage[node.uuid] = node;
+    this.inspectorGameMemoryStorage[node.uuid] = node;
     let nodeChildren = node.getChildren();
     for (let i = 0; i < nodeChildren.length; i++) {
       let childItem = nodeChildren[i];
       // console.log("childName: " + childItem.name);
-      getNodeChildren(childItem, nodeData.children);
+      this.getNodeChildren(childItem, nodeData.children);
     }
     data.push(nodeData);
   },

CocosCreatorInspector/src/devtools/panel/index.vue

@@ -1,14 +1,17 @@
 <template>
   <div style="display: flex;width: 100%; height: 100%;flex-direction: column">
-    <div v-show="isShowDebug">
+    <div v-show="isShowDebug" style="display: flex;flex: 1; flex-direction: column;">
       <div>
-        <el-button type="success" class="el-icon-refresh" size="mini" @click="onBtnClickUpdatePage">刷新</el-button>
         <el-button type="success" size="mini" @click="onBtnClickTest1">Test1</el-button>
         <el-button type="success" size="mini" @click="onBtnClickTest2">Test2</el-button>
         <el-button type="success" size="mini" @click="onBtnClickTest3">Test3</el-button>
       </div>
-      <el-row>
+      <el-row style="display:flex; flex: 1;">
         <el-col :span="8">
+          <div>
+            <el-switch active-text="实时监控" v-model="watchEveryTime"></el-switch>
+            <el-button type="success" class="el-icon-refresh" size="mini" @click="onBtnClickUpdateTree">刷新</el-button>
+          </div>
           <div class="grid-content treeList">
             <el-tree :data="treeData"
                      :props="defaultProps"
@@ -48,7 +51,11 @@
         treeDataMap: {},
         bgConn: null,// 与background.js的链接
 
-        defaultProps: null,
+        defaultProps: {
+          children: 'children',
+          label: 'label'
+        },
+        watchEveryTime: false,// 实时监控节点树
       }
     },
     created() {
@@ -121,8 +128,7 @@
         // console.log(data);
         let uuid = data.uuid;
         if (uuid !== undefined) {
-          let code = "window.getNodeInfo('" + uuid + "')";
+          this.evalInspectorFunction("getNodeInfo", `"${uuid}"`);
-          chrome.devtools.inspectedWindow.eval(code);
         }
       },
       _updateView(data) {
@@ -194,13 +200,24 @@
             }else{
               console.log("可能脚本没有注入");
             }`;
-          chrome.devtools.inspectedWindow.eval(injectCode);
+          console.log(injectCode);
+          let ret = chrome.devtools.inspectedWindow.eval(injectCode, function (result, info) {
+            if (info.isException) {
+              debugger
+              console.log(info.value)
+            }
+
+          });
+          console.log(`ret:${ret}`);
         } else {
           console.log("执行失败!");
         }
       },
+      onBtnClickUpdateTree() {
+        this.evalInspectorFunction("updateTreeInfo");
+
+      },
       onBtnClickUpdatePage() {
-        debugger
         this.evalInspectorFunction("checkIsGamePage", "true");
         // let code = this._getInjectScriptString();
         // chrome.devtools.inspectedWindow.eval(code, function () {