JS: whitelist decorator-bound methods in js/unbound-event-handler-receiver

Esben Sparre Andreasen · Esben Sparre Andreasen · commit eb10f603ab16 · 2018-09-13T08:41:41.000+02:00
diff --git a/javascript/ql/src/Expressions/UnboundEventHandlerReceiver.ql b/javascript/ql/src/Expressions/UnboundEventHandlerReceiver.ql
@@ -10,7 +10,7 @@
 import javascript
 
 /**
- * Holds if the receiver of `method` is bound in a method of its class.
+ * Holds if the receiver of `method` is bound.
  */
 private predicate isBoundInMethod(MethodDeclaration method) {
   exists (DataFlow::ThisNode thiz, MethodDeclaration bindingMethod, string name |
@@ -38,6 +38,15 @@ private predicate isBoundInMethod(MethodDeclaration method) {
       )
     )
   )
+  or
+  exists (Expr decoration, string name |
+    decoration = method.getADecorator().getExpression() and
+    name.regexpMatch("(?i).*(bind|bound).*") |
+    // @autobind
+    decoration.(Identifier).getName() = name or
+    // @action.bound
+    decoration.(PropAccess).getPropertyName() = name
+  )
 }
 
 /**
diff --git a/javascript/ql/test/query-tests/Expressions/UnboundEventHandlerReceiver/UnboundEventHandlerReceiver.expected b/javascript/ql/test/query-tests/Expressions/UnboundEventHandlerReceiver/UnboundEventHandlerReceiver.expected
@@ -1,3 +1,3 @@
-| tst.js:8:18:8:40 | onClick ... bound1} | The receiver of this event handler call is unbound, `$@` will be `undefined` in the call to $@ | tst.js:35:9:35:12 | this | this | tst.js:34:5:36:5 | unbound ... ;\\n    } | unbound1 |
-| tst.js:9:18:9:40 | onClick ... bound2} | The receiver of this event handler call is unbound, `$@` will be `undefined` in the call to $@ | tst.js:39:15:39:18 | this | this | tst.js:38:5:40:5 | unbound ... ;\\n    } | unbound2 |
-| tst.js:10:18:10:35 | onClick={unbound3} | The receiver of this event handler call is unbound, `$@` will be `undefined` in the call to $@ | tst.js:43:15:43:18 | this | this | tst.js:42:5:44:5 | unbound ... ;\\n    } | unbound3 |
+| tst.js:8:18:8:40 | onClick ... bound1} | The receiver of this event handler call is unbound, `$@` will be `undefined` in the call to $@ | tst.js:37:9:37:12 | this | this | tst.js:36:5:38:5 | unbound ... ;\\n    } | unbound1 |
+| tst.js:9:18:9:40 | onClick ... bound2} | The receiver of this event handler call is unbound, `$@` will be `undefined` in the call to $@ | tst.js:41:15:41:18 | this | this | tst.js:40:5:42:5 | unbound ... ;\\n    } | unbound2 |
+| tst.js:10:18:10:35 | onClick={unbound3} | The receiver of this event handler call is unbound, `$@` will be `undefined` in the call to $@ | tst.js:45:15:45:18 | this | this | tst.js:44:5:46:5 | unbound ... ;\\n    } | unbound3 |
diff --git a/javascript/ql/test/query-tests/Expressions/UnboundEventHandlerReceiver/tst.js b/javascript/ql/test/query-tests/Expressions/UnboundEventHandlerReceiver/tst.js
@@ -17,6 +17,8 @@ class Component extends React.Component {
             <div onClick={this.bound_throughNonSyntacticBindInConstructor}/> // OK
             <div onClick={this.bound_throughBindAllInConstructor1}/> // OK
             <div onClick={this.bound_throughBindAllInConstructor2}/> // OK
+            <div onClick={this.bound_throughDecorator_autobind}/> // OK
+            <div onClick={this.bound_throughDecorator_actionBound}/> // OK
             </div>
     }
 
@@ -87,6 +89,16 @@ class Component extends React.Component {
         this.setState({ });
     }
 
+    @autobind
+    bound_throughDecorator_autobind() {
+        this.setState({ });
+    }
+
+    @action.bound
+    bound_throughDecorator_actionBound() {
+        this.setState({ });
+    }
+
 }
 
 // semmle-extractor-options: --experimental

Original file line number	Diff line number	Diff line change
`@@ -10,7 +10,7 @@`
`10`	`10`	`import javascript`
`11`	`11`
`12`	`12`	`/**`
`13`		- * Holds if the receiver of `method` is bound in a method of its class.
	`13`	+ * Holds if the receiver of `method` is bound.
`14`	`14`	`*/`
`15`	`15`	`private predicate isBoundInMethod(MethodDeclaration method) {`
`16`	`16`	`exists (DataFlow::ThisNode thiz, MethodDeclaration bindingMethod, string name \|`
`@@ -38,6 +38,15 @@ private predicate isBoundInMethod(MethodDeclaration method) {`
`38`	`38`	`)`
`39`	`39`	`)`
`40`	`40`	`)`
	`41`	`+ or`
	`42`	`+ exists (Expr decoration, string name \|`
	`43`	`+ decoration = method.getADecorator().getExpression() and`
	`44`	`+ name.regexpMatch("(?i).(bind\|bound).") \|`
	`45`	`+ // @autobind`
	`46`	`+ decoration.(Identifier).getName() = name or`
	`47`	`+ // @action.bound`
	`48`	`+ decoration.(PropAccess).getPropertyName() = name`
	`49`	`+ )`
`41`	`50`	`}`
`42`	`51`
`43`	`52`	`/**`