Fix issue which formatted log will not display in Log tab. (issue Ten…

…cent#220)

CHANGELOG.md

@@ -1,5 +1,10 @@
 English | [简体中文](./CHANGELOG_CN.md)
 
+#### V3.3.0 (2019-xx-xx)
+
+- [FIX] Fix issue which formatted log (like `console.log('[foo]', 'bar')`) will not display in Log tab.
+
+
 #### V3.2.2 (2019-01-17)
 
 - [FEATURE] Add console command prompt. (by @65147400)

CHANGELOG_CN.md

@@ -1,5 +1,10 @@
 [English](./CHANGELOG.md) | 简体中文
 
+#### V3.3.0 (2019-xx-xx)
+
+- 【修复】修复格式化日志（如 `console.log('[foo]', 'bar')`）无法显示到 Log 面板的问题。
+
+
 #### V3.2.2 (2019-01-17)
 
 - 【特性】新增控制台输入提示。 (by @65147400)

doc/tutorial.md

@@ -87,6 +87,16 @@ console.error('bar'); // red word, pink background
 ```
 
 
+### Other methods
+
+Supported `console` methods:
+
+```javascript
+console.time('foo');    // start a timer named "foo"
+console.timeEnd('foo'); // stop "foo" timer and print the elapsed time
+```
+
+
 ### Formatted object / array
 
 Object or Array variable will be printed as formatted JSON:

doc/tutorial_CN.md

@@ -84,6 +84,16 @@ console.error('bar'); // 红底红字
 ```
 
 
+### 其他方法
+
+支持以下 `console` 方法：
+
+```javascript
+console.time('foo');    // 启动名为 foo 的计时器
+console.timeEnd('foo'); // 停止 foo 计时器并输出经过的时间
+```
+
+
 ### Object/Array 结构化展示
 
 支持打印 Object 或 Array 变量，会以结构化 JSON 形式输出（并折叠）：
@@ -118,6 +128,12 @@ console.log('[system]', 'foo'); // 'foo' 会输出到 System 面板
 console.log('[system] bar'); // 这行日志会输出到 Log 面板而非 System 面板
 ```
 
+若编写自定义 log 面板插件，亦可通过上述格式将 log 输出到自定义面板：
+
+```javascript
+console.log('[myplugin]', 'bar'); // 'myplugin' 为自定义面板插件的 id
+```
+
 
 ## 内置插件
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vconsole",
-  "version": "3.2.2",
+  "version": "3.3.0-dev",
   "description": "A lightweight, extendable front-end developer tool for mobile web page.",
   "homepage": "https://github.com/Tencent/vConsole",
   "main": "dist/vconsole.min.js",
@@ -20,22 +20,22 @@
   "dependencies": {},
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@babel/preset-env": "^7.2.3",
-    "@babel/plugin-proposal-class-properties": "^7.2.3",
+    "@babel/plugin-proposal-class-properties": "^7.3.0",
     "@babel/plugin-proposal-export-namespace-from": "^7.2.0",
-    "@babel/plugin-proposal-object-rest-spread": "^7.2.0",
+    "@babel/plugin-proposal-object-rest-spread": "^7.3.1",
+    "@babel/preset-env": "^7.3.1",
     "babel-loader": "^8.0.4",
     "babel-plugin-add-module-exports": "^1.0.0",
     "chai": "^4.2.0",
     "css-loader": "^2.1.0",
     "html-loader": "^0.5.5",
-    "jsdom": "^13.1.0",
+    "jsdom": "^13.2.0",
     "json-loader": "^0.5.7",
     "less": "^3.9.0",
     "less-loader": "^4.1.0",
     "mocha": "^5.2.0",
     "style-loader": "^0.23.1",
-    "webpack": "^4.28.4",
+    "webpack": "^4.29.0",
     "webpack-cli": "^3.2.1"
   },
   "author": "Tencent",

src/log/log.js

@@ -21,11 +21,14 @@ import tplFold from './item_fold.html';
 import tplFoldCode from './item_fold_code.html';
 
 const DEFAULT_MAX_LOG_NUMBER = 1000;
+const ADDED_LOG_TAB_ID = [];
 
 class VConsoleLogTab extends VConsolePlugin {
+  static AddedLogID = [];
 
   constructor(...args) {
     super(...args);
+    ADDED_LOG_TAB_ID.push(this.id);
 
     this.tplTabbox = ''; // MUST be overwrite in child class
     this.allowUnformattedLog = true; // `[xxx]` format log
@@ -161,6 +164,11 @@ class VConsoleLogTab extends VConsolePlugin {
     window.console.timeEnd = this.console.timeEnd;
     window.console.clear = this.console.clear;
     this.console = {};
+
+    const idx = ADDED_LOG_TAB_ID.indexOf(this.id);
+    if (idx > -1) {
+      ADDED_LOG_TAB_ID.splice(idx, 1);
+    }
   }
 
   onShow() {
@@ -321,17 +329,31 @@ class VConsoleLogTab extends VConsolePlugin {
     // check `[default]` format
     let shouldBeHere = true;
     let pattern = /^\[(\w+)\]$/i;
-    let targetTabName = '';
+    let targetTabID = '';
+    let isInAddedTab = false;
     if (tool.isString(logs[0])) {
       let match = logs[0].match(pattern);
       if (match !== null && match.length > 0) {
-        targetTabName = match[1].toLowerCase();
+        targetTabID = match[1].toLowerCase();
+        isInAddedTab = ADDED_LOG_TAB_ID.indexOf(targetTabID) > -1;
       }
     }
-    if (targetTabName) {
-      shouldBeHere = (targetTabName == this.id);
-    } else if (this.allowUnformattedLog == false) {
+
+    if (targetTabID === this.id) {
+      // target tab is current tab
+      shouldBeHere = true;
+    } else if (isInAddedTab === true) {
+      // target tab is not current tab, but in added tab list
+      // so throw this log to other tab
       shouldBeHere = false;
+    } else {
+      // target tab is not in added tab list
+      if (this.id === 'default') {
+        // show this log in default tab
+        shouldBeHere = true;
+      } else {
+        shouldBeHere = false;
+      }
     }
 
     if (!shouldBeHere) {
@@ -354,7 +376,7 @@ class VConsoleLogTab extends VConsolePlugin {
     }
 
     // remove `[xxx]` format
-    if (tool.isString(logs[0])) {
+    if (tool.isString(logs[0]) && isInAddedTab) {
       logs[0] = logs[0].replace(pattern, '');
       if (logs[0] === '') {
         logs.shift();

src/log/system.js

@@ -13,7 +13,6 @@ Unless required by applicable law or agreed to in writing, software distributed
  * vConsole System Tab
  */
 
-import * as tool from '../lib/tool.js';
 import VConsoleLogTab from './log.js';
 import tplTabbox from './tabbox_system.html';