Allow this in property and call descendants in render assignments

src/rules/no-this-assign-in-render.ts

@@ -84,21 +84,39 @@ const rule: Rule.RuleModule = {
       inRender = false;
     }
 
+    /**
+     * Walk left side assignment members and return first non-member
+     *
+     * @param {ESTree.MemberExpression} member Member entered
+     * @return {ESTree.Node}
+     */
+    function walkMembers(member: ESTree.MemberExpression): ESTree.Node {
+      if (member.object.type === 'MemberExpression') {
+        return walkMembers(member.object);
+      } else {
+        return member.object;
+      }
+    }
+
     /**
      * Left side of an assignment expr found
      *
      * @param {Rule.Node} node Node entered
      * @return {void}
      */
     function assignmentFound(node: Rule.Node): void {
-      if (!inRender) {
+      if (!inRender || node.type !== 'MemberExpression') {
         return;
       }
 
-      context.report({
-        node: node.parent,
-        messageId: 'noThis'
-      });
+      const nonMember = walkMembers(node);
+
+      if (nonMember.type === 'ThisExpression') {
+          context.report({
+            node: node.parent,
+            messageId: 'noThis'
+          });
+      }
     }
 
     return {
@@ -111,6 +129,7 @@ const rule: Rule.RuleModule = {
       MethodDefinition: (node: ESTree.Node): void =>
         methodEnter(node as ESTree.MethodDefinition),
       'MethodDefinition:exit': methodExit,
+      // eslint-disable-next-line max-len
       'AssignmentExpression > .left:has(ThisExpression)': (
         node: Rule.Node
       ): void => assignmentFound(node)

src/test/rules/no-this-assign-in-render_test.ts

@@ -75,6 +75,18 @@ ruleTester.run('no-this-assign-in-render', rule, {
           let x;
           x = this.foo || 123;
         }
+      }`,
+    `class Foo extends LitElement {
+        render() {
+          const x = {};
+          x[this.prop] = 123;
+        }
+      }`,
+    `class Foo extends LitElement {
+        render() {
+          const x = () => ({});
+          x(this.prop).y = 123;
+        }
       }`
   ],