Merge pull request #2047 from didi/fix-render-code

fix: 修复render函数复杂computed取值有误的问题(#2037)

Author: hiyuki

packages/webpack-plugin/lib/template-compiler/bind-this.js

@@ -2,6 +2,7 @@ const babylon = require('@babel/parser')
 const traverse = require('@babel/traverse').default
 const t = require('@babel/types')
 const generate = require('@babel/generator').default
+const isValidIdentifierStr = require('../utils/is-valid-identifier-str')
 
 const names = 'Infinity,undefined,NaN,isFinite,isNaN,' +
   'parseFloat,parseInt,decodeURI,decodeURIComponent,encodeURI,encodeURIComponent,' +
@@ -41,7 +42,7 @@ function getCollectPath (path) {
     if (current.node.computed) {
       if (t.isLiteral(current.node.property)) {
         if (t.isStringLiteral(current.node.property)) {
-          if (dangerousKeyMap[current.node.property.value]) {
+          if (dangerousKeyMap[current.node.property.value] || !isValidIdentifierStr(current.node.property.value)) {
             break
           }
           keyPath += `.${current.node.property.value}`

packages/webpack-plugin/test/platform/common/bind-this.spec.js

@@ -114,8 +114,14 @@ global.currentInject.render = function (_i, _c, _r, _sc) {
         a[c];
         c.d;
         a.b[c.d];
-        e;
-        e[0].name
+
+        e1[0].name;
+        e2["a.b.c"]
+        f1["a.b.c"]["d"]
+        f2["a"]["b.c.d"]
+        g1.a["b.c"].d
+        g2.a["b"].c.d
+        g3.a["b"]["c.d"].e
       }`
     const res = bindThis(input, { needCollect: true, renderReduce: true }).code
     const output = `
@@ -125,7 +131,13 @@ global.currentInject.render = function (_i, _c, _r, _sc) {
   _sc("a")[_sc("c")];
   _c("a.b")[_c("c.d")];
 
-  _sc("e");
+  _c("e1[0].name");
+  _sc("e2")["a.b.c"];
+  _sc("f1")["a.b.c"]["d"];
+  _c("f2.a")["b.c.d"];
+  _c("g1.a")["b.c"].d;
+  _c("g2.a.b.c.d");
+  _c("g3.a.b")["c.d"].e;
 };`
     expect(trimBlankRow(res)).toBe(trimBlankRow(output))
   })