From 768ccc6a540270b29e58292e82fb2bd5ea7958fa Mon Sep 17 00:00:00 2001
From: Asger F <asgerf@github.com>
Date: Mon, 23 Jun 2025 15:26:08 +0200
Subject: [PATCH 01/12] JS: Add test for react 'use' function

---
 .../ql/test/library-tests/TripleDot/react-use.js     | 12 ++++++++++++
 1 file changed, 12 insertions(+)
 create mode 100644 javascript/ql/test/library-tests/TripleDot/react-use.js

diff --git a/javascript/ql/test/library-tests/TripleDot/react-use.js b/javascript/ql/test/library-tests/TripleDot/react-use.js
new file mode 100644
index 000000000000..294a4f303eba
--- /dev/null
+++ b/javascript/ql/test/library-tests/TripleDot/react-use.js
@@ -0,0 +1,12 @@
+import { use } from "react";
+
+async function fetchData() {
+  return new Promise((resolve) => {
+    resolve(source("fetchedData"));
+  });
+}
+
+function Component() {
+  const data = use(fetchData());
+  sink(data); // $ MISSING: hasValueFlow=fetchedData
+}

From 980d0f46fa56761091e28d8e3edc91d7e2263386 Mon Sep 17 00:00:00 2001
From: Asger F <asgerf@github.com>
Date: Mon, 23 Jun 2025 15:27:21 +0200
Subject: [PATCH 02/12] JS: Add model for react 'use'

---
 javascript/ql/lib/ext/react.model.yml                   | 6 ++++++
 javascript/ql/test/library-tests/TripleDot/react-use.js | 2 +-
 2 files changed, 7 insertions(+), 1 deletion(-)
 create mode 100644 javascript/ql/lib/ext/react.model.yml

diff --git a/javascript/ql/lib/ext/react.model.yml b/javascript/ql/lib/ext/react.model.yml
new file mode 100644
index 000000000000..51b6aaefc46d
--- /dev/null
+++ b/javascript/ql/lib/ext/react.model.yml
@@ -0,0 +1,6 @@
+extensions:
+  - addsTo:
+      pack: codeql/javascript-all
+      extensible: summaryModel
+    data:
+      - ["react", "Member[use]", "Argument[0].Awaited", "ReturnValue", "value"]
diff --git a/javascript/ql/test/library-tests/TripleDot/react-use.js b/javascript/ql/test/library-tests/TripleDot/react-use.js
index 294a4f303eba..1691a7fbea46 100644
--- a/javascript/ql/test/library-tests/TripleDot/react-use.js
+++ b/javascript/ql/test/library-tests/TripleDot/react-use.js
@@ -8,5 +8,5 @@ async function fetchData() {
 
 function Component() {
   const data = use(fetchData());
-  sink(data); // $ MISSING: hasValueFlow=fetchedData
+  sink(data); // $ hasValueFlow=fetchedData
 }

From 8ff7182f3a3d433b63acb28cd599a12a45884d1c Mon Sep 17 00:00:00 2001
From: Asger F <asgerf@github.com>
Date: Mon, 23 Jun 2025 15:37:15 +0200
Subject: [PATCH 03/12] JS: Move React test predicates into one file

---
 .../frameworks/ReactJS/ReactComponent.qll     |  3 -
 ...ReactComponent_getACandidatePropsValue.qll |  5 --
 ...eactComponent_getACandidateStateSource.qll |  7 --
 .../ReactComponent_getADirectPropsSource.qll  |  5 --
 ...ReactComponent_getAPreviousStateSource.qll |  7 --
 .../ReactJS/ReactComponent_getAPropRead.qll   |  5 --
 .../ReactComponent_getInstanceMethod.qll      |  5 --
 .../frameworks/ReactJS/ReactComponent_ref.qll |  3 -
 .../frameworks/ReactJS/ReactName.qll          | 17 -----
 .../ReactJS/getADirectStateAccess.qll         |  5 --
 .../frameworks/ReactJS/react.qll              |  3 -
 .../library-tests/frameworks/ReactJS/tests.ql | 67 ++++++++++++++++---
 12 files changed, 56 insertions(+), 76 deletions(-)
 delete mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent.qll
 delete mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getACandidatePropsValue.qll
 delete mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getACandidateStateSource.qll
 delete mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getADirectPropsSource.qll
 delete mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getAPreviousStateSource.qll
 delete mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getAPropRead.qll
 delete mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getInstanceMethod.qll
 delete mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_ref.qll
 delete mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/ReactName.qll
 delete mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/getADirectStateAccess.qll
 delete mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/react.qll

diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent.qll b/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent.qll
deleted file mode 100644
index a48c6b8f1c94..000000000000
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent.qll
+++ /dev/null
@@ -1,3 +0,0 @@
-import semmle.javascript.frameworks.React
-
-query predicate test_ReactComponent(ReactComponent c) { any() }
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getACandidatePropsValue.qll b/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getACandidatePropsValue.qll
deleted file mode 100644
index a551aa457eca..000000000000
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getACandidatePropsValue.qll
+++ /dev/null
@@ -1,5 +0,0 @@
-import javascript
-
-query predicate test_ReactComponent_getACandidatePropsValue(DataFlow::Node res) {
-  exists(ReactComponent c | res = c.getACandidatePropsValue(_))
-}
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getACandidateStateSource.qll b/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getACandidateStateSource.qll
deleted file mode 100644
index af6597ab96cf..000000000000
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getACandidateStateSource.qll
+++ /dev/null
@@ -1,7 +0,0 @@
-import semmle.javascript.frameworks.React
-
-query predicate test_ReactComponent_getACandidateStateSource(
-  ReactComponent c, DataFlow::SourceNode res
-) {
-  res = c.getACandidateStateSource()
-}
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getADirectPropsSource.qll b/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getADirectPropsSource.qll
deleted file mode 100644
index 9f9ebd89f8de..000000000000
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getADirectPropsSource.qll
+++ /dev/null
@@ -1,5 +0,0 @@
-import semmle.javascript.frameworks.React
-
-query predicate test_ReactComponent_getADirectPropsSource(ReactComponent c, DataFlow::SourceNode res) {
-  res = c.getADirectPropsAccess()
-}
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getAPreviousStateSource.qll b/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getAPreviousStateSource.qll
deleted file mode 100644
index b1bfe312dae2..000000000000
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getAPreviousStateSource.qll
+++ /dev/null
@@ -1,7 +0,0 @@
-import semmle.javascript.frameworks.React
-
-query predicate test_ReactComponent_getAPreviousStateSource(
-  ReactComponent c, DataFlow::SourceNode res
-) {
-  res = c.getAPreviousStateSource()
-}
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getAPropRead.qll b/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getAPropRead.qll
deleted file mode 100644
index 0ff2a588a029..000000000000
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getAPropRead.qll
+++ /dev/null
@@ -1,5 +0,0 @@
-import semmle.javascript.frameworks.React
-
-query predicate test_ReactComponent_getAPropRead(ReactComponent c, string n, DataFlow::PropRead res) {
-  res = c.getAPropRead(n)
-}
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getInstanceMethod.qll b/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getInstanceMethod.qll
deleted file mode 100644
index b813e19539b5..000000000000
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_getInstanceMethod.qll
+++ /dev/null
@@ -1,5 +0,0 @@
-import semmle.javascript.frameworks.React
-
-query predicate test_ReactComponent_getInstanceMethod(ReactComponent c, string n, Function res) {
-  res = c.getInstanceMethod(n)
-}
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_ref.qll b/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_ref.qll
deleted file mode 100644
index a017a0715feb..000000000000
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactComponent_ref.qll
+++ /dev/null
@@ -1,3 +0,0 @@
-import semmle.javascript.frameworks.React
-
-query predicate test_ReactComponent_ref(ReactComponent c, DataFlow::Node res) { res = c.ref() }
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactName.qll b/javascript/ql/test/library-tests/frameworks/ReactJS/ReactName.qll
deleted file mode 100644
index 885f1f38a57f..000000000000
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/ReactName.qll
+++ /dev/null
@@ -1,17 +0,0 @@
-import semmle.javascript.frameworks.React
-
-query predicate test_JSXname(JsxElement element, JsxName jsxname, string name, string type) {
-  name = jsxname.getValue() and
-  (
-    jsxname instanceof Identifier and type = "Identifier"
-    or
-    jsxname instanceof ThisExpr and type = "thisExpr"
-    or
-    jsxname.(DotExpr).getBase() instanceof JsxName and type = "dot"
-    or
-    jsxname instanceof JsxQualifiedName and type = "qualifiedName"
-  ) and
-  element.getNameExpr() = jsxname
-}
-
-query ThisExpr test_JsxName_this(JsxElement element) { result.getParentExpr+() = element }
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/getADirectStateAccess.qll b/javascript/ql/test/library-tests/frameworks/ReactJS/getADirectStateAccess.qll
deleted file mode 100644
index b43f3e487d77..000000000000
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/getADirectStateAccess.qll
+++ /dev/null
@@ -1,5 +0,0 @@
-import semmle.javascript.frameworks.React
-
-query predicate test_getADirectStateAccess(ReactComponent c, DataFlow::SourceNode res) {
-  res = c.getADirectStateAccess()
-}
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/react.qll b/javascript/ql/test/library-tests/frameworks/ReactJS/react.qll
deleted file mode 100644
index a5f254b79707..000000000000
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/react.qll
+++ /dev/null
@@ -1,3 +0,0 @@
-import javascript
-
-query predicate test_react(DataFlow::ValueNode nd) { react().flowsTo(nd) }
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/tests.ql b/javascript/ql/test/library-tests/frameworks/ReactJS/tests.ql
index 4d20306d4ed4..653f2481d97b 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/tests.ql
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/tests.ql
@@ -1,14 +1,59 @@
-import getADirectStateAccess
-import ReactComponent_getInstanceMethod
-import react
-import ReactComponent_getAPreviousStateSource
-import ReactComponent_ref
-import ReactComponent_getACandidateStateSource
-import ReactComponent_getADirectPropsSource
-import ReactComponent_getACandidatePropsValue
-import ReactComponent
-import ReactComponent_getAPropRead
-import ReactName
+import javascript
+import semmle.javascript.frameworks.React
+
+query predicate test_getADirectStateAccess(ReactComponent c, DataFlow::SourceNode res) {
+  res = c.getADirectStateAccess()
+}
+
+query predicate test_ReactComponent_getInstanceMethod(ReactComponent c, string n, Function res) {
+  res = c.getInstanceMethod(n)
+}
+
+query predicate test_react(DataFlow::ValueNode nd) { react().flowsTo(nd) }
+
+query predicate test_ReactComponent_getAPreviousStateSource(
+  ReactComponent c, DataFlow::SourceNode res
+) {
+  res = c.getAPreviousStateSource()
+}
+
+query predicate test_ReactComponent_ref(ReactComponent c, DataFlow::Node res) { res = c.ref() }
+
+query predicate test_ReactComponent_getACandidateStateSource(
+  ReactComponent c, DataFlow::SourceNode res
+) {
+  res = c.getACandidateStateSource()
+}
+
+query predicate test_ReactComponent_getADirectPropsSource(ReactComponent c, DataFlow::SourceNode res) {
+  res = c.getADirectPropsAccess()
+}
+
+query predicate test_ReactComponent_getACandidatePropsValue(DataFlow::Node res) {
+  exists(ReactComponent c | res = c.getACandidatePropsValue(_))
+}
+
+query predicate test_ReactComponent(ReactComponent c) { any() }
+
+query predicate test_ReactComponent_getAPropRead(ReactComponent c, string n, DataFlow::PropRead res) {
+  res = c.getAPropRead(n)
+}
+
+query predicate test_JSXname(JsxElement element, JsxName jsxname, string name, string type) {
+  name = jsxname.getValue() and
+  (
+    jsxname instanceof Identifier and type = "Identifier"
+    or
+    jsxname instanceof ThisExpr and type = "thisExpr"
+    or
+    jsxname.(DotExpr).getBase() instanceof JsxName and type = "dot"
+    or
+    jsxname instanceof JsxQualifiedName and type = "qualifiedName"
+  ) and
+  element.getNameExpr() = jsxname
+}
+
+query ThisExpr test_JsxName_this(JsxElement element) { result.getParentExpr+() = element }
 
 query DataFlow::SourceNode locationSource() { result = DOM::locationSource() }
 

From 99fb6b62adefb86d9dada9e481309bb56262785b Mon Sep 17 00:00:00 2001
From: Asger F <asgerf@github.com>
Date: Mon, 23 Jun 2025 15:38:27 +0200
Subject: [PATCH 04/12] JS: Remove test_ prefix from query predicates

---
 .../library-tests/frameworks/ReactJS/tests.ql | 28 ++++++++-----------
 1 file changed, 12 insertions(+), 16 deletions(-)

diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/tests.ql b/javascript/ql/test/library-tests/frameworks/ReactJS/tests.ql
index 653f2481d97b..9124dbd7a720 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/tests.ql
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/tests.ql
@@ -1,45 +1,41 @@
 import javascript
 import semmle.javascript.frameworks.React
 
-query predicate test_getADirectStateAccess(ReactComponent c, DataFlow::SourceNode res) {
+query predicate getADirectStateAccess(ReactComponent c, DataFlow::SourceNode res) {
   res = c.getADirectStateAccess()
 }
 
-query predicate test_ReactComponent_getInstanceMethod(ReactComponent c, string n, Function res) {
+query predicate getInstanceMethod(ReactComponent c, string n, Function res) {
   res = c.getInstanceMethod(n)
 }
 
-query predicate test_react(DataFlow::ValueNode nd) { react().flowsTo(nd) }
+query predicate reactLibraryRef(DataFlow::ValueNode nd) { react().flowsTo(nd) }
 
-query predicate test_ReactComponent_getAPreviousStateSource(
-  ReactComponent c, DataFlow::SourceNode res
-) {
+query predicate getAPreviousStateSource(ReactComponent c, DataFlow::SourceNode res) {
   res = c.getAPreviousStateSource()
 }
 
-query predicate test_ReactComponent_ref(ReactComponent c, DataFlow::Node res) { res = c.ref() }
+query predicate reactComponentRef(ReactComponent c, DataFlow::Node res) { res = c.ref() }
 
-query predicate test_ReactComponent_getACandidateStateSource(
-  ReactComponent c, DataFlow::SourceNode res
-) {
+query predicate getACandidateStateSource(ReactComponent c, DataFlow::SourceNode res) {
   res = c.getACandidateStateSource()
 }
 
-query predicate test_ReactComponent_getADirectPropsSource(ReactComponent c, DataFlow::SourceNode res) {
+query predicate getADirectPropsSource(ReactComponent c, DataFlow::SourceNode res) {
   res = c.getADirectPropsAccess()
 }
 
-query predicate test_ReactComponent_getACandidatePropsValue(DataFlow::Node res) {
+query predicate getACandidatePropsValue(DataFlow::Node res) {
   exists(ReactComponent c | res = c.getACandidatePropsValue(_))
 }
 
-query predicate test_ReactComponent(ReactComponent c) { any() }
+query predicate reactComponent(ReactComponent c) { any() }
 
-query predicate test_ReactComponent_getAPropRead(ReactComponent c, string n, DataFlow::PropRead res) {
+query predicate getAPropRead(ReactComponent c, string n, DataFlow::PropRead res) {
   res = c.getAPropRead(n)
 }
 
-query predicate test_JSXname(JsxElement element, JsxName jsxname, string name, string type) {
+query predicate jsxName(JsxElement element, JsxName jsxname, string name, string type) {
   name = jsxname.getValue() and
   (
     jsxname instanceof Identifier and type = "Identifier"
@@ -53,7 +49,7 @@ query predicate test_JSXname(JsxElement element, JsxName jsxname, string name, s
   element.getNameExpr() = jsxname
 }
 
-query ThisExpr test_JsxName_this(JsxElement element) { result.getParentExpr+() = element }
+query ThisExpr jsxNameThis(JsxElement element) { result.getParentExpr+() = element }
 
 query DataFlow::SourceNode locationSource() { result = DOM::locationSource() }
 

From 1a18e683641240d3afe8a669c1e14b430bf45bdd Mon Sep 17 00:00:00 2001
From: Asger F <asgerf@github.com>
Date: Mon, 23 Jun 2025 15:44:08 +0200
Subject: [PATCH 05/12] JS: Remove reactLibraryRef

This is not testing anything interesting, and is noisy when adding inline expectations
---
 javascript/ql/test/library-tests/frameworks/ReactJS/tests.ql | 2 --
 1 file changed, 2 deletions(-)

diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/tests.ql b/javascript/ql/test/library-tests/frameworks/ReactJS/tests.ql
index 9124dbd7a720..6de8091b010b 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/tests.ql
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/tests.ql
@@ -9,8 +9,6 @@ query predicate getInstanceMethod(ReactComponent c, string n, Function res) {
   res = c.getInstanceMethod(n)
 }
 
-query predicate reactLibraryRef(DataFlow::ValueNode nd) { react().flowsTo(nd) }
-
 query predicate getAPreviousStateSource(ReactComponent c, DataFlow::SourceNode res) {
   res = c.getAPreviousStateSource()
 }

From 1787d4dce8f694a719fd7b1cc182ed699fb361d6 Mon Sep 17 00:00:00 2001
From: Asger F <asgerf@github.com>
Date: Mon, 23 Jun 2025 15:45:10 +0200
Subject: [PATCH 06/12] JS: Enable inline expectations in test

Will update files in next commit
---
 javascript/ql/test/library-tests/frameworks/ReactJS/tests.qlref | 2 ++
 1 file changed, 2 insertions(+)
 create mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/tests.qlref

diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/tests.qlref b/javascript/ql/test/library-tests/frameworks/ReactJS/tests.qlref
new file mode 100644
index 000000000000..8581a3f8b748
--- /dev/null
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/tests.qlref
@@ -0,0 +1,2 @@
+query: tests.ql
+postprocess: utils/test/InlineExpectationsTestQuery.ql

From 180b023c7c515ee62c057774e0f9124b7a0ce9a6 Mon Sep 17 00:00:00 2001
From: Asger F <asgerf@github.com>
Date: Mon, 23 Jun 2025 15:45:24 +0200
Subject: [PATCH 07/12] JS: Add inline expectations to React test

---
 .../library-tests/frameworks/ReactJS/es5.js   | 10 +++----
 .../library-tests/frameworks/ReactJS/es6.js   |  8 +++---
 .../frameworks/ReactJS/exportedComponent.jsx  |  4 +--
 .../frameworks/ReactJS/importedComponent.jsx  |  6 ++--
 .../frameworks/ReactJS/namedImport.js         |  4 +--
 .../frameworks/ReactJS/plainfn.js             | 16 +++++------
 .../frameworks/ReactJS/preact.js              | 10 +++----
 .../ReactJS/probably-a-component.js           |  6 ++--
 .../library-tests/frameworks/ReactJS/props.js | 28 +++++++++----------
 .../ReactJS/rare-lifecycle-methods.js         |  4 +--
 .../frameworks/ReactJS/statePropertyReads.js  |  2 +-
 .../frameworks/ReactJS/statePropertyWrites.js |  6 ++--
 .../frameworks/ReactJS/thisAccesses.js        | 16 +++++------
 .../ReactJS/thisAccesses_importedMappers.js   |  2 +-
 .../ReactJS/useHigherOrderComponent.jsx       |  6 ++--
 15 files changed, 64 insertions(+), 64 deletions(-)

diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/es5.js b/javascript/ql/test/library-tests/frameworks/ReactJS/es5.js
index abef8d7d8bbd..8d1eb47b55f6 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/es5.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/es5.js
@@ -1,14 +1,14 @@
 var Hello = React.createClass({
   displayName: 'Hello',
   render: function() {
-    return <div>Hello {this.props.name}</div>;
+    return <div>Hello {this.props.name}</div>; // $ threatModelSource=view-component-input
   },
   getDefaultProps: function() {
     return {
-      name: 'world'
+      name: 'world' // $ getACandidatePropsValue
     };
   }
-});
+}); // $ reactComponent
 
 Hello.info = function() {
   return "Nothing to see here.";
@@ -17,6 +17,6 @@ Hello.info = function() {
 var createReactClass = require('create-react-class');
 var Greeting = createReactClass({
   render: function() {
-    return <h1>Hello, {this.props.name}</h1>;
+    return <h1>Hello, {this.props.name}</h1>; // $ threatModelSource=view-component-input
   }
-});
+}); // $ reactComponent
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/es6.js b/javascript/ql/test/library-tests/frameworks/ReactJS/es6.js
index 2991888354c8..333ac1a943f5 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/es6.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/es6.js
@@ -1,11 +1,11 @@
-class Hello extends React.Component {
+class Hello extends React.Component { // $ threatModelSource=view-component-input
   render() {
-    return <div>Hello {this.props.name}</div>;
+    return <div>Hello {this.props.name}</div>; // $ threatModelSource=view-component-input
   }
   static info() {
     return "Nothing to see here.";
   }
-}
+} // $ reactComponent
 Hello.displayName = 'Hello';
 Hello.defaultProps = {
   name: 'world'
@@ -17,4 +17,4 @@ class Hello2 extends React.Component {
         this.state.bar.foo = 42;
         this.state = { baz: 42};
     }
-}
+} // $ reactComponent
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/exportedComponent.jsx b/javascript/ql/test/library-tests/frameworks/ReactJS/exportedComponent.jsx
index 4335b4bc3081..9e2d5580228f 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/exportedComponent.jsx
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/exportedComponent.jsx
@@ -1,3 +1,3 @@
-export function MyComponent(props) {
+export function MyComponent(props) { // $ threatModelSource=view-component-input
     return <div style={{color: props.color}}/>
-}
+} // $ reactComponent
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/importedComponent.jsx b/javascript/ql/test/library-tests/frameworks/ReactJS/importedComponent.jsx
index d94acf59abee..ed04d4bec889 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/importedComponent.jsx
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/importedComponent.jsx
@@ -1,5 +1,5 @@
 import { MyComponent } from "./exportedComponent";
 
-export function render({color, location}) {
-    return <MyComponent color={color}/>
-}
+export function render({color, location}) { // $ threatModelSource=view-component-input locationSource threatModelSource=remote
+    return <MyComponent color={color}/> // $ getACandidatePropsValue
+} // $ reactComponent
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/namedImport.js b/javascript/ql/test/library-tests/frameworks/ReactJS/namedImport.js
index 3c5a7182d65e..c29160c8ed5b 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/namedImport.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/namedImport.js
@@ -1,5 +1,5 @@
 import { Component } from "react";
 
-class C extends Component {}
+class C extends Component {} // $ threatModelSource=view-component-input reactComponent
 
-class D extends C {}
+class D extends C {} // $ threatModelSource=view-component-input reactComponent
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/plainfn.js b/javascript/ql/test/library-tests/frameworks/ReactJS/plainfn.js
index 7f5995b9fdb1..c5d029a44d13 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/plainfn.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/plainfn.js
@@ -1,15 +1,15 @@
-function Hello(props) {
+function Hello(props) { // $ threatModelSource=view-component-input
   return <div>Hello {props.name}</div>;
-}
+} // $ reactComponent
 
-function Hello2(props) {
+function Hello2(props) { // $ threatModelSource=view-component-input
     return React.createElement("div");
-}
+} // $ reactComponent
 
-function Hello3(props) {
+function Hello3(props) { // $ threatModelSource=view-component-input
     var x = React.createElement("div");
     return x;
-}
+} // $ reactComponent
 
 function NotAComponent(props) {
     if (y)
@@ -17,8 +17,8 @@ function NotAComponent(props) {
     return g();
 }
 
-function SpuriousComponent(props) {
+function SpuriousComponent(props) { // $ threatModelSource=view-component-input
     if (y)
         return React.createElement("div");
     return 42;
-}
+} // $ reactComponent
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/preact.js b/javascript/ql/test/library-tests/frameworks/ReactJS/preact.js
index 787064397f0d..ced8ae6be303 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/preact.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/preact.js
@@ -1,11 +1,11 @@
-class Hello extends Preact.Component {
-    render(props, state) {
+class Hello extends Preact.Component { // $ threatModelSource=view-component-input
+    render(props, state) { // $ threatModelSource=view-component-input
         props.name;
         state.name;
         return <div/>;
     }
-}
+} // $ reactComponent
 
-class Hello extends preact.Component {
+class Hello extends preact.Component { // $ threatModelSource=view-component-input
 
-}
+} // $ reactComponent
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/probably-a-component.js b/javascript/ql/test/library-tests/frameworks/ReactJS/probably-a-component.js
index a8205039b8e7..c82188beb02a 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/probably-a-component.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/probably-a-component.js
@@ -1,6 +1,6 @@
-class Hello extends Component {
+class Hello extends Component { // $ threatModelSource=view-component-input
     render() {
-        this.props.name;
+        this.props.name; // $ threatModelSource=view-component-input
         return <div/>;
     }
-}
+} // $ reactComponent
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/props.js b/javascript/ql/test/library-tests/frameworks/ReactJS/props.js
index c1cce38a040c..153ee1473428 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/props.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/props.js
@@ -1,36 +1,36 @@
 function ES2015() {
-    class C extends React.Component {
-    }
+    class C extends React.Component { // $ threatModelSource=view-component-input
+    } // $ reactComponent
 
-    C.defaultProps = { propFromDefaultProps: "propFromDefaultProps" };
+    C.defaultProps = { propFromDefaultProps: "propFromDefaultProps" }; // $ getACandidatePropsValue
 
-    (<C propFromJSX={"propFromJSX"}/>);
+    (<C propFromJSX={"propFromJSX"}/>); // $ getACandidatePropsValue
 
-    new C({propFromConstructor: "propFromConstructor"});
+    new C({propFromConstructor: "propFromConstructor"}); // $ getACandidatePropsValue
 }
 
 function ES5() {
     var C = React.createClass({
         getDefaultProps() {
-            return { propFromDefaultProps: "propFromDefaultProps" };
+            return { propFromDefaultProps: "propFromDefaultProps" }; // $ getACandidatePropsValue
         }
-    });
+    }); // $ reactComponent
 
-    (<C propFromJSX={"propFromJSX"}/>);
+    (<C propFromJSX={"propFromJSX"}/>); // $ getACandidatePropsValue
 
-    C({propFromConstructor: "propFromConstructor"});
+    C({propFromConstructor: "propFromConstructor"}); // $ getACandidatePropsValue
 
 }
 
 function Functional() {
-    function C(props) {
+    function C(props) { // $ threatModelSource=view-component-input
         return <div/>;
-    }
+    } // $ reactComponent
 
-    C.defaultProps = { propFromDefaultProps: "propFromDefaultProps" };
+    C.defaultProps = { propFromDefaultProps: "propFromDefaultProps" }; // $ getACandidatePropsValue
 
-    (<C propFromJSX={"propFromJSX"}/>);
+    (<C propFromJSX={"propFromJSX"}/>); // $ getACandidatePropsValue
 
-    new C({propFromConstructor: "propFromConstructor"});
+    new C({propFromConstructor: "propFromConstructor"}); // $ getACandidatePropsValue
 
 }
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/rare-lifecycle-methods.js b/javascript/ql/test/library-tests/frameworks/ReactJS/rare-lifecycle-methods.js
index c3f7c13b1623..b4943ea66c30 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/rare-lifecycle-methods.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/rare-lifecycle-methods.js
@@ -1,4 +1,4 @@
-class C extends React.Component {
+class C extends React.Component { // $ threatModelSource=view-component-input
     static getDerivedStateFromProps(props, state) {
         return {};
     }
@@ -8,4 +8,4 @@ class C extends React.Component {
     getSnapshotBeforeUpdate(prevProps, prevState) {
         return {};
     }
-}
+} // $ reactComponent
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/statePropertyReads.js b/javascript/ql/test/library-tests/frameworks/ReactJS/statePropertyReads.js
index 697bc35c1505..93a120937d76 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/statePropertyReads.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/statePropertyReads.js
@@ -10,4 +10,4 @@ class Reads extends React.Component {
     componentDidUpdate(prevProps, prevState) {
         prevState.p4;
     }
-}
+} // $ reactComponent
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/statePropertyWrites.js b/javascript/ql/test/library-tests/frameworks/ReactJS/statePropertyWrites.js
index 692400c7381a..27e02bc6f665 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/statePropertyWrites.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/statePropertyWrites.js
@@ -31,15 +31,15 @@ class Writes extends React.Component {
     state = {
         p7: 42
     };
-}
+} // $ reactComponent
 
 React.createClass({
   render: function() {
-    return <div>Hello {this.props.name}</div>;
+    return <div>Hello {this.props.name}</div>; // $ threatModelSource=view-component-input
   },
   getInitialState: function() {
     return {
       p8: 42
     };
   }
-});
+}); // $ reactComponent
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/thisAccesses.js b/javascript/ql/test/library-tests/frameworks/ReactJS/thisAccesses.js
index b662b7ca53bf..c30509974d4e 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/thisAccesses.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/thisAccesses.js
@@ -13,7 +13,7 @@ class C extends React.Component {
     someInstanceMethod() {
         this;
     }
-}
+} // $ reactComponent
 
 React.createClass({
     render: function() {
@@ -26,14 +26,14 @@ React.createClass({
     someInstanceMethod: function() {
         this;
     }
-});
+}); // $ reactComponent
 
-(function (props) {
+(function (props) { // $ threatModelSource=view-component-input
     (function () {
         this; props;
     }).bind(this);
     return <div/>;
-})
+}) // $ reactComponent
 
 React.createClass({
     render: function() {
@@ -42,14 +42,14 @@ React.createClass({
         }, this)
         return <div/>;
     },
-});
+}); // $ reactComponent
 
 class C2 extends React.Component {
-    constructor (y) {
+    constructor (y) { // $ threatModelSource=view-component-input
         this.state = x;
         this.state = y;
     }
-}
+} // $ reactComponent
 
 class C3 extends React.Component {
     constructor() {
@@ -60,4 +60,4 @@ class C3 extends React.Component {
         var foo = <this.name></this.name>;
         var bar = <this.this></this.this>;
     }
-}
+} // $ reactComponent
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/thisAccesses_importedMappers.js b/javascript/ql/test/library-tests/frameworks/ReactJS/thisAccesses_importedMappers.js
index 06e5e1149fda..abbbdd844ed0 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/thisAccesses_importedMappers.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/thisAccesses_importedMappers.js
@@ -12,4 +12,4 @@ React.createClass({
 
         return <div/>;
     },
-});
+}); // $ reactComponent
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/useHigherOrderComponent.jsx b/javascript/ql/test/library-tests/frameworks/ReactJS/useHigherOrderComponent.jsx
index a57c5aa70bab..dba28fd1c6c5 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/useHigherOrderComponent.jsx
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/useHigherOrderComponent.jsx
@@ -2,17 +2,17 @@ import SomeComponent from './higherOrderComponent';
 import { lazy } from 'react';
 
 function foo() {
-    return <SomeComponent color="red"/>
+    return <SomeComponent color="red"/> // $ getACandidatePropsValue
 }
 
 const LazyLoadedComponent = lazy(() => import('./higherOrderComponent'));
 
 function bar() {
-    return <LazyLoadedComponent color="lazy"/>
+    return <LazyLoadedComponent color="lazy"/> // $ getACandidatePropsValue
 }
 
 const LazyLoadedComponent2 = lazy(() => import('./exportedComponent').then(m => m.MyComponent));
 
 function barz() {
-    return <LazyLoadedComponent2 color="lazy2"/>
+    return <LazyLoadedComponent2 color="lazy2"/> // $ getACandidatePropsValue
 }

From 7dd7246cd453a4191d146a2e3f5e719727fe3d6c Mon Sep 17 00:00:00 2001
From: Asger F <asgerf@github.com>
Date: Mon, 23 Jun 2025 15:45:44 +0200
Subject: [PATCH 08/12] JS: Update tests.expected

Mostly noise due to renamed predicates and reordered result sets
---
 .../frameworks/ReactJS/tests.expected         | 304 ++++++++----------
 1 file changed, 133 insertions(+), 171 deletions(-)

diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/tests.expected b/javascript/ql/test/library-tests/frameworks/ReactJS/tests.expected
index 9a5c38ddbf90..1e1607801cfc 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/tests.expected
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/tests.expected
@@ -1,42 +1,112 @@
-test_react
-| es5.js:1:13:1:17 | React |
-| es6.js:1:21:1:25 | React |
-| es6.js:14:22:14:26 | React |
-| globalReactRefs.js:1:1:1:5 | React |
-| globalReactRefs.js:4:5:4:9 | React |
-| globalReactRefs.js:7:1:7:5 | React |
-| importedReactRefs.js:1:8:1:12 | React |
-| importedReactRefs.js:3:1:3:5 | React |
-| importedReactRefs.js:6:5:6:9 | React |
-| importedReactRefs.js:9:1:9:5 | React |
-| plainfn.js:6:12:6:16 | React |
-| plainfn.js:10:13:10:17 | React |
-| plainfn.js:16:16:16:20 | React |
-| plainfn.js:22:16:22:20 | React |
-| props.js:2:21:2:25 | React |
-| props.js:13:13:13:17 | React |
-| rare-lifecycle-methods.js:1:17:1:21 | React |
-| requiredReactRefs.js:1:13:1:28 | require("react") |
-| requiredReactRefs.js:3:1:3:5 | React |
-| requiredReactRefs.js:6:5:6:9 | React |
-| requiredReactRefs.js:9:1:9:5 | React |
-| requiredReactRefs.js:12:17:12:32 | require("react") |
-| requiredReactRefs.js:14:5:14:9 | React |
-| requiredReactRefs.js:17:9:17:13 | React |
-| requiredReactRefs.js:20:5:20:9 | React |
-| statePropertyReads.js:1:21:1:25 | React |
-| statePropertyWrites.js:1:22:1:26 | React |
-| statePropertyWrites.js:36:1:36:5 | React |
-| thisAccesses.js:1:17:1:21 | React |
-| thisAccesses.js:18:1:18:5 | React |
-| thisAccesses.js:38:1:38:5 | React |
-| thisAccesses.js:40:9:40:13 | React |
-| thisAccesses.js:47:18:47:22 | React |
-| thisAccesses.js:54:18:54:22 | React |
-| thisAccesses_importedMappers.js:1:8:1:12 | React |
-| thisAccesses_importedMappers.js:4:1:4:5 | React |
-| thisAccesses_importedMappers.js:6:9:6:13 | React |
-test_JSXname
+getACandidatePropsValue
+| es5.js:8:13:8:19 | 'world' |
+| importedComponent.jsx:4:32:4:36 | color |
+| props.js:5:46:5:67 | "propFr ... tProps" |
+| props.js:7:22:7:34 | "propFromJSX" |
+| props.js:9:33:9:53 | "propFr ... ructor" |
+| props.js:15:44:15:65 | "propFr ... tProps" |
+| props.js:19:22:19:34 | "propFromJSX" |
+| props.js:21:29:21:49 | "propFr ... ructor" |
+| props.js:30:46:30:67 | "propFr ... tProps" |
+| props.js:32:22:32:34 | "propFromJSX" |
+| props.js:34:33:34:53 | "propFr ... ructor" |
+| useHigherOrderComponent.jsx:5:33:5:37 | "red" |
+| useHigherOrderComponent.jsx:11:39:11:44 | "lazy" |
+| useHigherOrderComponent.jsx:17:40:17:46 | "lazy2" |
+getACandidateStateSource
+| es6.js:14:1:20:1 | class H ...     }\\n} | es6.js:18:22:18:31 | { baz: 42} |
+| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | rare-lifecycle-methods.js:3:16:3:17 | {} |
+| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | rare-lifecycle-methods.js:5:38:5:46 | nextState |
+| statePropertyReads.js:1:1:13:1 | class R ...     }\\n} | statePropertyReads.js:7:45:7:56 | prevState.p3 |
+| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:8:18:8:19 | {} |
+| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:12:18:12:19 | {} |
+| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:16:18:16:19 | {} |
+| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:20:18:20:19 | {} |
+| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:31:13:33:5 | {\\n      ... 2\\n    } |
+| statePropertyWrites.js:36:19:45:1 | {\\n  ren ... ;\\n  }\\n} | statePropertyWrites.js:41:12:43:5 | {\\n      p8: 42\\n    } |
+| thisAccesses.js:47:1:52:1 | class C ...     }\\n} | thisAccesses.js:48:18:48:18 | y |
+| thisAccesses.js:47:1:52:1 | class C ...     }\\n} | thisAccesses.js:49:22:49:22 | x |
+getADirectPropsSource
+| es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} | es5.js:4:24:4:33 | this.props |
+| es5.js:18:33:22:1 | {\\n  ren ... t\\n  }\\n} | es5.js:20:24:20:33 | this.props |
+| es6.js:1:1:8:1 | class H ... ;\\n  }\\n} | es6.js:1:37:1:36 | args |
+| es6.js:1:1:8:1 | class H ... ;\\n  }\\n} | es6.js:3:24:3:33 | this.props |
+| exportedComponent.jsx:1:8:3:1 | functio ... r}}/>\\n} | exportedComponent.jsx:1:29:1:33 | props |
+| importedComponent.jsx:3:8:5:1 | functio ... Value\\n} | importedComponent.jsx:3:24:3:40 | {color, location} |
+| namedImport.js:3:1:3:28 | class C ... nent {} | namedImport.js:3:27:3:26 | args |
+| namedImport.js:5:1:5:20 | class D extends C {} | namedImport.js:5:19:5:18 | args |
+| plainfn.js:1:1:3:1 | functio ... div>;\\n} | plainfn.js:1:16:1:20 | props |
+| plainfn.js:5:1:7:1 | functio ... iv");\\n} | plainfn.js:5:17:5:21 | props |
+| plainfn.js:9:1:12:1 | functio ... rn x;\\n} | plainfn.js:9:17:9:21 | props |
+| plainfn.js:20:1:24:1 | functio ... n 42;\\n} | plainfn.js:20:28:20:32 | props |
+| preact.js:1:1:7:1 | class H ...     }\\n} | preact.js:1:38:1:37 | args |
+| preact.js:1:1:7:1 | class H ...     }\\n} | preact.js:2:12:2:16 | props |
+| preact.js:9:1:11:1 | class H ... nput\\n\\n} | preact.js:9:38:9:37 | args |
+| probably-a-component.js:1:1:6:1 | class H ...     }\\n} | probably-a-component.js:1:31:1:30 | args |
+| probably-a-component.js:1:1:6:1 | class H ...     }\\n} | probably-a-component.js:3:9:3:18 | this.props |
+| props.js:2:5:3:5 | class C ... t\\n    } | props.js:2:37:2:36 | args |
+| props.js:26:5:28:5 | functio ... ;\\n    } | props.js:26:16:26:20 | props |
+| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | rare-lifecycle-methods.js:1:33:1:32 | args |
+| statePropertyWrites.js:36:19:45:1 | {\\n  ren ... ;\\n  }\\n} | statePropertyWrites.js:38:24:38:33 | this.props |
+| thisAccesses.js:31:2:36:1 | functio ... iv/>;\\n} | thisAccesses.js:31:12:31:16 | props |
+| thisAccesses.js:47:1:52:1 | class C ...     }\\n} | thisAccesses.js:48:18:48:18 | y |
+getADirectStateAccess
+| es6.js:14:1:20:1 | class H ...     }\\n} | es6.js:16:9:16:18 | this.state |
+| es6.js:14:1:20:1 | class H ...     }\\n} | es6.js:17:9:17:18 | this.state |
+| es6.js:14:1:20:1 | class H ...     }\\n} | es6.js:18:9:18:18 | this.state |
+| preact.js:1:1:7:1 | class H ...     }\\n} | preact.js:2:19:2:23 | state |
+| statePropertyReads.js:1:1:13:1 | class R ...     }\\n} | statePropertyReads.js:3:9:3:18 | this.state |
+| statePropertyReads.js:1:1:13:1 | class R ...     }\\n} | statePropertyReads.js:5:9:5:18 | this.state |
+| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:4:9:4:17 | cmp.state |
+| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:6:9:6:17 | cmp.state |
+| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:10:9:10:17 | cmp.state |
+| thisAccesses.js:47:1:52:1 | class C ...     }\\n} | thisAccesses.js:49:9:49:18 | this.state |
+| thisAccesses.js:47:1:52:1 | class C ...     }\\n} | thisAccesses.js:50:9:50:18 | this.state |
+getAPreviousStateSource
+| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | rare-lifecycle-methods.js:2:44:2:48 | state |
+| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | rare-lifecycle-methods.js:8:40:8:48 | prevState |
+| statePropertyReads.js:1:1:13:1 | class R ...     }\\n} | statePropertyReads.js:7:24:7:32 | prevState |
+| statePropertyReads.js:1:1:13:1 | class R ...     }\\n} | statePropertyReads.js:10:35:10:43 | prevState |
+getAPropRead
+| es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} | name | es5.js:4:24:4:38 | this.props.name |
+| es5.js:18:33:22:1 | {\\n  ren ... t\\n  }\\n} | name | es5.js:20:24:20:38 | this.props.name |
+| es6.js:1:1:8:1 | class H ... ;\\n  }\\n} | name | es6.js:3:24:3:38 | this.props.name |
+| exportedComponent.jsx:1:8:3:1 | functio ... r}}/>\\n} | color | exportedComponent.jsx:2:32:2:42 | props.color |
+| importedComponent.jsx:3:8:5:1 | functio ... Value\\n} | color | importedComponent.jsx:3:25:3:29 | color |
+| importedComponent.jsx:3:8:5:1 | functio ... Value\\n} | location | importedComponent.jsx:3:32:3:39 | location |
+| plainfn.js:1:1:3:1 | functio ... div>;\\n} | name | plainfn.js:2:22:2:31 | props.name |
+| preact.js:1:1:7:1 | class H ...     }\\n} | name | preact.js:3:9:3:18 | props.name |
+| probably-a-component.js:1:1:6:1 | class H ...     }\\n} | name | probably-a-component.js:3:9:3:23 | this.props.name |
+| statePropertyWrites.js:36:19:45:1 | {\\n  ren ... ;\\n  }\\n} | name | statePropertyWrites.js:38:24:38:38 | this.props.name |
+getInstanceMethod
+| es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} | getDefaultProps | es5.js:6:20:10:3 | functio ...  };\\n  } |
+| es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} | render | es5.js:3:11:5:3 | functio ... put\\n  } |
+| es5.js:18:33:22:1 | {\\n  ren ... t\\n  }\\n} | render | es5.js:19:11:21:3 | functio ... put\\n  } |
+| es6.js:1:1:8:1 | class H ... ;\\n  }\\n} | render | es6.js:2:9:4:3 | () {\\n   ... put\\n  } |
+| exportedComponent.jsx:1:8:3:1 | functio ... r}}/>\\n} | render | exportedComponent.jsx:1:8:3:1 | functio ... r}}/>\\n} |
+| importedComponent.jsx:3:8:5:1 | functio ... Value\\n} | render | importedComponent.jsx:3:8:5:1 | functio ... Value\\n} |
+| plainfn.js:1:1:3:1 | functio ... div>;\\n} | render | plainfn.js:1:1:3:1 | functio ... div>;\\n} |
+| plainfn.js:5:1:7:1 | functio ... iv");\\n} | render | plainfn.js:5:1:7:1 | functio ... iv");\\n} |
+| plainfn.js:9:1:12:1 | functio ... rn x;\\n} | render | plainfn.js:9:1:12:1 | functio ... rn x;\\n} |
+| plainfn.js:20:1:24:1 | functio ... n 42;\\n} | render | plainfn.js:20:1:24:1 | functio ... n 42;\\n} |
+| preact.js:1:1:7:1 | class H ...     }\\n} | render | preact.js:2:11:6:5 | (props, ... ;\\n    } |
+| probably-a-component.js:1:1:6:1 | class H ...     }\\n} | render | probably-a-component.js:2:11:5:5 | () {\\n   ... ;\\n    } |
+| props.js:13:31:17:5 | {\\n      ... }\\n    } | getDefaultProps | props.js:14:24:16:9 | () {\\n   ...       } |
+| props.js:26:5:28:5 | functio ... ;\\n    } | render | props.js:26:5:28:5 | functio ... ;\\n    } |
+| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | getSnapshotBeforeUpdate | rare-lifecycle-methods.js:8:28:10:5 | (prevPr ... ;\\n    } |
+| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | shouldComponentUpdate | rare-lifecycle-methods.js:5:26:7:5 | (nextPr ... ;\\n    } |
+| statePropertyReads.js:1:1:13:1 | class R ...     }\\n} | componentDidUpdate | statePropertyReads.js:10:23:12:5 | (prevPr ... ;\\n    } |
+| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | getInitialState | statePropertyWrites.js:25:20:29:5 | () { // ... ;\\n    } |
+| statePropertyWrites.js:36:19:45:1 | {\\n  ren ... ;\\n  }\\n} | getInitialState | statePropertyWrites.js:40:20:44:3 | functio ...  };\\n  } |
+| statePropertyWrites.js:36:19:45:1 | {\\n  ren ... ;\\n  }\\n} | render | statePropertyWrites.js:37:11:39:3 | functio ... put\\n  } |
+| thisAccesses.js:1:1:16:1 | class C ...     }\\n} | someInstanceMethod | thisAccesses.js:13:23:15:5 | () {\\n   ... ;\\n    } |
+| thisAccesses.js:18:19:29:1 | {\\n    r ...     }\\n} | render | thisAccesses.js:19:13:24:5 | functio ... ;\\n    } |
+| thisAccesses.js:18:19:29:1 | {\\n    r ...     }\\n} | someInstanceMethod | thisAccesses.js:26:25:28:5 | functio ... ;\\n    } |
+| thisAccesses.js:31:2:36:1 | functio ... iv/>;\\n} | render | thisAccesses.js:31:2:36:1 | functio ... iv/>;\\n} |
+| thisAccesses.js:38:19:45:1 | {\\n    r ...    },\\n} | render | thisAccesses.js:39:13:44:5 | functio ... ;\\n    } |
+| thisAccesses.js:54:1:63:1 | class C ...     }\\n} | render | thisAccesses.js:59:11:62:5 | () {\\n   ... ;\\n    } |
+| thisAccesses_importedMappers.js:4:19:15:1 | {\\n    r ...    },\\n} | render | thisAccesses_importedMappers.js:5:13:14:5 | functio ... ;\\n    } |
+jsxName
 | es5.js:4:12:4:45 | <div>He ... }</div> | es5.js:4:13:4:15 | div | div | Identifier |
 | es5.js:20:12:20:44 | <h1>Hel ... e}</h1> | es5.js:20:13:20:14 | h1 | h1 | Identifier |
 | es6.js:3:12:3:45 | <div>He ... }</div> | es6.js:3:13:3:15 | div | div | Identifier |
@@ -62,13 +132,22 @@ test_JSXname
 | useHigherOrderComponent.jsx:5:12:5:39 | <SomeCo ... "red"/> | useHigherOrderComponent.jsx:5:13:5:25 | SomeComponent | SomeComponent | Identifier |
 | useHigherOrderComponent.jsx:11:12:11:46 | <LazyLo ... lazy"/> | useHigherOrderComponent.jsx:11:13:11:31 | LazyLoadedComponent | LazyLoadedComponent | Identifier |
 | useHigherOrderComponent.jsx:17:12:17:48 | <LazyLo ... azy2"/> | useHigherOrderComponent.jsx:17:13:17:32 | LazyLoadedComponent2 | LazyLoadedComponent2 | Identifier |
-test_ReactComponent
+jsxNameThis
+| es5.js:4:12:4:45 | <div>He ... }</div> | es5.js:4:24:4:27 | this |
+| es5.js:20:12:20:44 | <h1>Hel ... e}</h1> | es5.js:20:24:20:27 | this |
+| es6.js:3:12:3:45 | <div>He ... }</div> | es6.js:3:24:3:27 | this |
+| statePropertyWrites.js:38:12:38:45 | <div>He ... }</div> | statePropertyWrites.js:38:24:38:27 | this |
+| thisAccesses.js:60:19:60:41 | <this.n ... s.name> | thisAccesses.js:60:20:60:23 | this |
+| thisAccesses.js:61:19:61:41 | <this.t ... s.this> | thisAccesses.js:61:20:61:23 | this |
+locationSource
+| importedComponent.jsx:3:32:3:39 | location |
+reactComponent
 | es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} |
-| es5.js:18:33:22:1 | {\\n  ren ... ;\\n  }\\n} |
+| es5.js:18:33:22:1 | {\\n  ren ... t\\n  }\\n} |
 | es6.js:1:1:8:1 | class H ... ;\\n  }\\n} |
 | es6.js:14:1:20:1 | class H ...     }\\n} |
 | exportedComponent.jsx:1:8:3:1 | functio ... r}}/>\\n} |
-| importedComponent.jsx:3:8:5:1 | functio ... or}/>\\n} |
+| importedComponent.jsx:3:8:5:1 | functio ... Value\\n} |
 | namedImport.js:3:1:3:28 | class C ... nent {} |
 | namedImport.js:5:1:5:20 | class D extends C {} |
 | plainfn.js:1:1:3:1 | functio ... div>;\\n} |
@@ -76,9 +155,9 @@ test_ReactComponent
 | plainfn.js:9:1:12:1 | functio ... rn x;\\n} |
 | plainfn.js:20:1:24:1 | functio ... n 42;\\n} |
 | preact.js:1:1:7:1 | class H ...     }\\n} |
-| preact.js:9:1:11:1 | class H ... nt {\\n\\n} |
+| preact.js:9:1:11:1 | class H ... nput\\n\\n} |
 | probably-a-component.js:1:1:6:1 | class H ...     }\\n} |
-| props.js:2:5:3:5 | class C ... {\\n    } |
+| props.js:2:5:3:5 | class C ... t\\n    } |
 | props.js:13:31:17:5 | {\\n      ... }\\n    } |
 | props.js:26:5:28:5 | functio ... ;\\n    } |
 | rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} |
@@ -92,14 +171,14 @@ test_ReactComponent
 | thisAccesses.js:47:1:52:1 | class C ...     }\\n} |
 | thisAccesses.js:54:1:63:1 | class C ...     }\\n} |
 | thisAccesses_importedMappers.js:4:19:15:1 | {\\n    r ...    },\\n} |
-test_ReactComponent_ref
+reactComponentRef
 | es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} | es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} |
 | es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} | es5.js:3:11:3:10 | this |
 | es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} | es5.js:4:24:4:27 | this |
 | es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} | es5.js:6:20:6:19 | this |
-| es5.js:18:33:22:1 | {\\n  ren ... ;\\n  }\\n} | es5.js:18:33:22:1 | {\\n  ren ... ;\\n  }\\n} |
-| es5.js:18:33:22:1 | {\\n  ren ... ;\\n  }\\n} | es5.js:19:11:19:10 | this |
-| es5.js:18:33:22:1 | {\\n  ren ... ;\\n  }\\n} | es5.js:20:24:20:27 | this |
+| es5.js:18:33:22:1 | {\\n  ren ... t\\n  }\\n} | es5.js:18:33:22:1 | {\\n  ren ... t\\n  }\\n} |
+| es5.js:18:33:22:1 | {\\n  ren ... t\\n  }\\n} | es5.js:19:11:19:10 | this |
+| es5.js:18:33:22:1 | {\\n  ren ... t\\n  }\\n} | es5.js:20:24:20:27 | this |
 | es6.js:1:1:8:1 | class H ... ;\\n  }\\n} | es6.js:1:37:1:36 | implicit 'this' |
 | es6.js:1:1:8:1 | class H ... ;\\n  }\\n} | es6.js:1:37:1:36 | this |
 | es6.js:1:1:8:1 | class H ... ;\\n  }\\n} | es6.js:2:9:2:8 | this |
@@ -110,7 +189,7 @@ test_ReactComponent_ref
 | es6.js:14:1:20:1 | class H ...     }\\n} | es6.js:17:9:17:12 | this |
 | es6.js:14:1:20:1 | class H ...     }\\n} | es6.js:18:9:18:12 | this |
 | exportedComponent.jsx:1:8:3:1 | functio ... r}}/>\\n} | exportedComponent.jsx:1:8:1:7 | this |
-| importedComponent.jsx:3:8:5:1 | functio ... or}/>\\n} | importedComponent.jsx:3:8:3:7 | this |
+| importedComponent.jsx:3:8:5:1 | functio ... Value\\n} | importedComponent.jsx:3:8:3:7 | this |
 | namedImport.js:3:1:3:28 | class C ... nent {} | namedImport.js:3:27:3:26 | implicit 'this' |
 | namedImport.js:3:1:3:28 | class C ... nent {} | namedImport.js:3:27:3:26 | this |
 | namedImport.js:5:1:5:20 | class D extends C {} | namedImport.js:5:19:5:18 | implicit 'this' |
@@ -122,15 +201,15 @@ test_ReactComponent_ref
 | preact.js:1:1:7:1 | class H ...     }\\n} | preact.js:1:38:1:37 | implicit 'this' |
 | preact.js:1:1:7:1 | class H ...     }\\n} | preact.js:1:38:1:37 | this |
 | preact.js:1:1:7:1 | class H ...     }\\n} | preact.js:2:11:2:10 | this |
-| preact.js:9:1:11:1 | class H ... nt {\\n\\n} | preact.js:9:38:9:37 | implicit 'this' |
-| preact.js:9:1:11:1 | class H ... nt {\\n\\n} | preact.js:9:38:9:37 | this |
+| preact.js:9:1:11:1 | class H ... nput\\n\\n} | preact.js:9:38:9:37 | implicit 'this' |
+| preact.js:9:1:11:1 | class H ... nput\\n\\n} | preact.js:9:38:9:37 | this |
 | probably-a-component.js:1:1:6:1 | class H ...     }\\n} | probably-a-component.js:1:31:1:30 | implicit 'this' |
 | probably-a-component.js:1:1:6:1 | class H ...     }\\n} | probably-a-component.js:1:31:1:30 | this |
 | probably-a-component.js:1:1:6:1 | class H ...     }\\n} | probably-a-component.js:2:11:2:10 | this |
 | probably-a-component.js:1:1:6:1 | class H ...     }\\n} | probably-a-component.js:3:9:3:12 | this |
-| props.js:2:5:3:5 | class C ... {\\n    } | props.js:2:37:2:36 | implicit 'this' |
-| props.js:2:5:3:5 | class C ... {\\n    } | props.js:2:37:2:36 | this |
-| props.js:2:5:3:5 | class C ... {\\n    } | props.js:9:5:9:55 | new C({ ... ctor"}) |
+| props.js:2:5:3:5 | class C ... t\\n    } | props.js:2:37:2:36 | implicit 'this' |
+| props.js:2:5:3:5 | class C ... t\\n    } | props.js:2:37:2:36 | this |
+| props.js:2:5:3:5 | class C ... t\\n    } | props.js:9:5:9:55 | new C({ ... ctor"}) |
 | props.js:13:31:17:5 | {\\n      ... }\\n    } | props.js:13:31:17:5 | {\\n      ... }\\n    } |
 | props.js:13:31:17:5 | {\\n      ... }\\n    } | props.js:14:24:14:23 | this |
 | props.js:26:5:28:5 | functio ... ;\\n    } | props.js:26:5:26:4 | this |
@@ -201,123 +280,6 @@ test_ReactComponent_ref
 | thisAccesses_importedMappers.js:4:19:15:1 | {\\n    r ...    },\\n} | thisAccesses_importedMappers.js:9:25:9:24 | this |
 | thisAccesses_importedMappers.js:4:19:15:1 | {\\n    r ...    },\\n} | thisAccesses_importedMappers.js:10:13:10:16 | this |
 | thisAccesses_importedMappers.js:4:19:15:1 | {\\n    r ...    },\\n} | thisAccesses_importedMappers.js:11:12:11:15 | this |
-test_getADirectStateAccess
-| es6.js:14:1:20:1 | class H ...     }\\n} | es6.js:16:9:16:18 | this.state |
-| es6.js:14:1:20:1 | class H ...     }\\n} | es6.js:17:9:17:18 | this.state |
-| es6.js:14:1:20:1 | class H ...     }\\n} | es6.js:18:9:18:18 | this.state |
-| preact.js:1:1:7:1 | class H ...     }\\n} | preact.js:2:19:2:23 | state |
-| statePropertyReads.js:1:1:13:1 | class R ...     }\\n} | statePropertyReads.js:3:9:3:18 | this.state |
-| statePropertyReads.js:1:1:13:1 | class R ...     }\\n} | statePropertyReads.js:5:9:5:18 | this.state |
-| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:4:9:4:17 | cmp.state |
-| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:6:9:6:17 | cmp.state |
-| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:10:9:10:17 | cmp.state |
-| thisAccesses.js:47:1:52:1 | class C ...     }\\n} | thisAccesses.js:49:9:49:18 | this.state |
-| thisAccesses.js:47:1:52:1 | class C ...     }\\n} | thisAccesses.js:50:9:50:18 | this.state |
-test_ReactComponent_getAPropRead
-| es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} | name | es5.js:4:24:4:38 | this.props.name |
-| es5.js:18:33:22:1 | {\\n  ren ... ;\\n  }\\n} | name | es5.js:20:24:20:38 | this.props.name |
-| es6.js:1:1:8:1 | class H ... ;\\n  }\\n} | name | es6.js:3:24:3:38 | this.props.name |
-| exportedComponent.jsx:1:8:3:1 | functio ... r}}/>\\n} | color | exportedComponent.jsx:2:32:2:42 | props.color |
-| importedComponent.jsx:3:8:5:1 | functio ... or}/>\\n} | color | importedComponent.jsx:3:25:3:29 | color |
-| importedComponent.jsx:3:8:5:1 | functio ... or}/>\\n} | location | importedComponent.jsx:3:32:3:39 | location |
-| plainfn.js:1:1:3:1 | functio ... div>;\\n} | name | plainfn.js:2:22:2:31 | props.name |
-| preact.js:1:1:7:1 | class H ...     }\\n} | name | preact.js:3:9:3:18 | props.name |
-| probably-a-component.js:1:1:6:1 | class H ...     }\\n} | name | probably-a-component.js:3:9:3:23 | this.props.name |
-| statePropertyWrites.js:36:19:45:1 | {\\n  ren ... ;\\n  }\\n} | name | statePropertyWrites.js:38:24:38:38 | this.props.name |
-test_ReactComponent_getInstanceMethod
-| es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} | getDefaultProps | es5.js:6:20:10:3 | functio ...  };\\n  } |
-| es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} | render | es5.js:3:11:5:3 | functio ... v>;\\n  } |
-| es5.js:18:33:22:1 | {\\n  ren ... ;\\n  }\\n} | render | es5.js:19:11:21:3 | functio ... 1>;\\n  } |
-| es6.js:1:1:8:1 | class H ... ;\\n  }\\n} | render | es6.js:2:9:4:3 | () {\\n   ... v>;\\n  } |
-| exportedComponent.jsx:1:8:3:1 | functio ... r}}/>\\n} | render | exportedComponent.jsx:1:8:3:1 | functio ... r}}/>\\n} |
-| importedComponent.jsx:3:8:5:1 | functio ... or}/>\\n} | render | importedComponent.jsx:3:8:5:1 | functio ... or}/>\\n} |
-| plainfn.js:1:1:3:1 | functio ... div>;\\n} | render | plainfn.js:1:1:3:1 | functio ... div>;\\n} |
-| plainfn.js:5:1:7:1 | functio ... iv");\\n} | render | plainfn.js:5:1:7:1 | functio ... iv");\\n} |
-| plainfn.js:9:1:12:1 | functio ... rn x;\\n} | render | plainfn.js:9:1:12:1 | functio ... rn x;\\n} |
-| plainfn.js:20:1:24:1 | functio ... n 42;\\n} | render | plainfn.js:20:1:24:1 | functio ... n 42;\\n} |
-| preact.js:1:1:7:1 | class H ...     }\\n} | render | preact.js:2:11:6:5 | (props, ... ;\\n    } |
-| probably-a-component.js:1:1:6:1 | class H ...     }\\n} | render | probably-a-component.js:2:11:5:5 | () {\\n   ... ;\\n    } |
-| props.js:13:31:17:5 | {\\n      ... }\\n    } | getDefaultProps | props.js:14:24:16:9 | () {\\n   ...       } |
-| props.js:26:5:28:5 | functio ... ;\\n    } | render | props.js:26:5:28:5 | functio ... ;\\n    } |
-| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | getSnapshotBeforeUpdate | rare-lifecycle-methods.js:8:28:10:5 | (prevPr ... ;\\n    } |
-| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | shouldComponentUpdate | rare-lifecycle-methods.js:5:26:7:5 | (nextPr ... ;\\n    } |
-| statePropertyReads.js:1:1:13:1 | class R ...     }\\n} | componentDidUpdate | statePropertyReads.js:10:23:12:5 | (prevPr ... ;\\n    } |
-| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | getInitialState | statePropertyWrites.js:25:20:29:5 | () { // ... ;\\n    } |
-| statePropertyWrites.js:36:19:45:1 | {\\n  ren ... ;\\n  }\\n} | getInitialState | statePropertyWrites.js:40:20:44:3 | functio ...  };\\n  } |
-| statePropertyWrites.js:36:19:45:1 | {\\n  ren ... ;\\n  }\\n} | render | statePropertyWrites.js:37:11:39:3 | functio ... v>;\\n  } |
-| thisAccesses.js:1:1:16:1 | class C ...     }\\n} | someInstanceMethod | thisAccesses.js:13:23:15:5 | () {\\n   ... ;\\n    } |
-| thisAccesses.js:18:19:29:1 | {\\n    r ...     }\\n} | render | thisAccesses.js:19:13:24:5 | functio ... ;\\n    } |
-| thisAccesses.js:18:19:29:1 | {\\n    r ...     }\\n} | someInstanceMethod | thisAccesses.js:26:25:28:5 | functio ... ;\\n    } |
-| thisAccesses.js:31:2:36:1 | functio ... iv/>;\\n} | render | thisAccesses.js:31:2:36:1 | functio ... iv/>;\\n} |
-| thisAccesses.js:38:19:45:1 | {\\n    r ...    },\\n} | render | thisAccesses.js:39:13:44:5 | functio ... ;\\n    } |
-| thisAccesses.js:54:1:63:1 | class C ...     }\\n} | render | thisAccesses.js:59:11:62:5 | () {\\n   ... ;\\n    } |
-| thisAccesses_importedMappers.js:4:19:15:1 | {\\n    r ...    },\\n} | render | thisAccesses_importedMappers.js:5:13:14:5 | functio ... ;\\n    } |
-test_ReactComponent_getADirectPropsSource
-| es5.js:1:31:11:1 | {\\n  dis ... ;\\n  }\\n} | es5.js:4:24:4:33 | this.props |
-| es5.js:18:33:22:1 | {\\n  ren ... ;\\n  }\\n} | es5.js:20:24:20:33 | this.props |
-| es6.js:1:1:8:1 | class H ... ;\\n  }\\n} | es6.js:1:37:1:36 | args |
-| es6.js:1:1:8:1 | class H ... ;\\n  }\\n} | es6.js:3:24:3:33 | this.props |
-| exportedComponent.jsx:1:8:3:1 | functio ... r}}/>\\n} | exportedComponent.jsx:1:29:1:33 | props |
-| importedComponent.jsx:3:8:5:1 | functio ... or}/>\\n} | importedComponent.jsx:3:24:3:40 | {color, location} |
-| namedImport.js:3:1:3:28 | class C ... nent {} | namedImport.js:3:27:3:26 | args |
-| namedImport.js:5:1:5:20 | class D extends C {} | namedImport.js:5:19:5:18 | args |
-| plainfn.js:1:1:3:1 | functio ... div>;\\n} | plainfn.js:1:16:1:20 | props |
-| plainfn.js:5:1:7:1 | functio ... iv");\\n} | plainfn.js:5:17:5:21 | props |
-| plainfn.js:9:1:12:1 | functio ... rn x;\\n} | plainfn.js:9:17:9:21 | props |
-| plainfn.js:20:1:24:1 | functio ... n 42;\\n} | plainfn.js:20:28:20:32 | props |
-| preact.js:1:1:7:1 | class H ...     }\\n} | preact.js:1:38:1:37 | args |
-| preact.js:1:1:7:1 | class H ...     }\\n} | preact.js:2:12:2:16 | props |
-| preact.js:9:1:11:1 | class H ... nt {\\n\\n} | preact.js:9:38:9:37 | args |
-| probably-a-component.js:1:1:6:1 | class H ...     }\\n} | probably-a-component.js:1:31:1:30 | args |
-| probably-a-component.js:1:1:6:1 | class H ...     }\\n} | probably-a-component.js:3:9:3:18 | this.props |
-| props.js:2:5:3:5 | class C ... {\\n    } | props.js:2:37:2:36 | args |
-| props.js:26:5:28:5 | functio ... ;\\n    } | props.js:26:16:26:20 | props |
-| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | rare-lifecycle-methods.js:1:33:1:32 | args |
-| statePropertyWrites.js:36:19:45:1 | {\\n  ren ... ;\\n  }\\n} | statePropertyWrites.js:38:24:38:33 | this.props |
-| thisAccesses.js:31:2:36:1 | functio ... iv/>;\\n} | thisAccesses.js:31:12:31:16 | props |
-| thisAccesses.js:47:1:52:1 | class C ...     }\\n} | thisAccesses.js:48:18:48:18 | y |
-test_ReactComponent_getACandidatePropsValue
-| es5.js:8:13:8:19 | 'world' |
-| importedComponent.jsx:4:32:4:36 | color |
-| props.js:5:46:5:67 | "propFr ... tProps" |
-| props.js:7:22:7:34 | "propFromJSX" |
-| props.js:9:33:9:53 | "propFr ... ructor" |
-| props.js:15:44:15:65 | "propFr ... tProps" |
-| props.js:19:22:19:34 | "propFromJSX" |
-| props.js:21:29:21:49 | "propFr ... ructor" |
-| props.js:30:46:30:67 | "propFr ... tProps" |
-| props.js:32:22:32:34 | "propFromJSX" |
-| props.js:34:33:34:53 | "propFr ... ructor" |
-| useHigherOrderComponent.jsx:5:33:5:37 | "red" |
-| useHigherOrderComponent.jsx:11:39:11:44 | "lazy" |
-| useHigherOrderComponent.jsx:17:40:17:46 | "lazy2" |
-test_ReactComponent_getAPreviousStateSource
-| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | rare-lifecycle-methods.js:2:44:2:48 | state |
-| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | rare-lifecycle-methods.js:8:40:8:48 | prevState |
-| statePropertyReads.js:1:1:13:1 | class R ...     }\\n} | statePropertyReads.js:7:24:7:32 | prevState |
-| statePropertyReads.js:1:1:13:1 | class R ...     }\\n} | statePropertyReads.js:10:35:10:43 | prevState |
-test_ReactComponent_getACandidateStateSource
-| es6.js:14:1:20:1 | class H ...     }\\n} | es6.js:18:22:18:31 | { baz: 42} |
-| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | rare-lifecycle-methods.js:3:16:3:17 | {} |
-| rare-lifecycle-methods.js:1:1:11:1 | class C ...     }\\n} | rare-lifecycle-methods.js:5:38:5:46 | nextState |
-| statePropertyReads.js:1:1:13:1 | class R ...     }\\n} | statePropertyReads.js:7:45:7:56 | prevState.p3 |
-| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:8:18:8:19 | {} |
-| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:12:18:12:19 | {} |
-| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:16:18:16:19 | {} |
-| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:20:18:20:19 | {} |
-| statePropertyWrites.js:1:1:34:1 | class W ...    };\\n} | statePropertyWrites.js:31:13:33:5 | {\\n      ... 2\\n    } |
-| statePropertyWrites.js:36:19:45:1 | {\\n  ren ... ;\\n  }\\n} | statePropertyWrites.js:41:12:43:5 | {\\n      p8: 42\\n    } |
-| thisAccesses.js:47:1:52:1 | class C ...     }\\n} | thisAccesses.js:48:18:48:18 | y |
-| thisAccesses.js:47:1:52:1 | class C ...     }\\n} | thisAccesses.js:49:22:49:22 | x |
-test_JsxName_this
-| es5.js:4:12:4:45 | <div>He ... }</div> | es5.js:4:24:4:27 | this |
-| es5.js:20:12:20:44 | <h1>Hel ... e}</h1> | es5.js:20:24:20:27 | this |
-| es6.js:3:12:3:45 | <div>He ... }</div> | es6.js:3:24:3:27 | this |
-| statePropertyWrites.js:38:12:38:45 | <div>He ... }</div> | statePropertyWrites.js:38:24:38:27 | this |
-| thisAccesses.js:60:19:60:41 | <this.n ... s.name> | thisAccesses.js:60:20:60:23 | this |
-| thisAccesses.js:61:19:61:41 | <this.t ... s.this> | thisAccesses.js:61:20:61:23 | this |
-locationSource
-| importedComponent.jsx:3:32:3:39 | location |
 threatModelSource
 | es5.js:4:24:4:33 | this.props | view-component-input |
 | es5.js:20:24:20:33 | this.props | view-component-input |

From d9f4e4a90d9b14e2ff31d328bc47be1264a611d8 Mon Sep 17 00:00:00 2001
From: Asger F <asgerf@github.com>
Date: Mon, 23 Jun 2025 15:48:44 +0200
Subject: [PATCH 09/12] JS: Add tests for functions with "use server" directive

---
 .../library-tests/frameworks/ReactJS/use-server1.js   | 10 ++++++++++
 .../library-tests/frameworks/ReactJS/use-server2.js   | 11 +++++++++++
 2 files changed, 21 insertions(+)
 create mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/use-server1.js
 create mode 100644 javascript/ql/test/library-tests/frameworks/ReactJS/use-server2.js

diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/use-server1.js b/javascript/ql/test/library-tests/frameworks/ReactJS/use-server1.js
new file mode 100644
index 000000000000..3773edf957ad
--- /dev/null
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/use-server1.js
@@ -0,0 +1,10 @@
+async function getData(
+    x, // $ MISSING: threatModelSource=remote
+    y) { // $ MISSING: threatModelSource=remote
+  "use server";
+}
+
+async function getData2(
+    x, // should not be remote flow sources (because the function does not have "use server")
+    y) {
+}
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/use-server2.js b/javascript/ql/test/library-tests/frameworks/ReactJS/use-server2.js
new file mode 100644
index 000000000000..e91b59b50d30
--- /dev/null
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/use-server2.js
@@ -0,0 +1,11 @@
+"use server";
+
+export async function getData(
+    x, // $ MISSING: threatModelSource=remote
+    y) { // $ MISSING: threatModelSource=remote
+}
+
+async function getData2(
+    x, // should not be remote flow sources (because the function is not exported)
+    y) {
+}

From cc1a28ac7e86aa00b8e6b4f6c7dce2553a2e0b0b Mon Sep 17 00:00:00 2001
From: Asger F <asgerf@github.com>
Date: Mon, 23 Jun 2025 15:57:11 +0200
Subject: [PATCH 10/12] JS: Add parameters of server functions as remote flow
 sources

---
 .../semmle/javascript/frameworks/React.qll    | 19 +++++++++++++++++++
 .../frameworks/ReactJS/tests.expected         |  4 ++++
 .../frameworks/ReactJS/use-server1.js         |  4 ++--
 .../frameworks/ReactJS/use-server2.js         |  4 ++--
 4 files changed, 27 insertions(+), 4 deletions(-)

diff --git a/javascript/ql/lib/semmle/javascript/frameworks/React.qll b/javascript/ql/lib/semmle/javascript/frameworks/React.qll
index 4d126b888290..3a361e705940 100644
--- a/javascript/ql/lib/semmle/javascript/frameworks/React.qll
+++ b/javascript/ql/lib/semmle/javascript/frameworks/React.qll
@@ -875,3 +875,22 @@ private class ReactPropAsViewComponentInput extends ViewComponentInput {
 
   override string getSourceType() { result = "React props" }
 }
+
+private predicate isServerFunction(DataFlow::FunctionNode func) {
+  exists(Directive::UseServerDirective useServer |
+    useServer.getContainer() = func.getFunction()
+    or
+    useServer.getContainer().(Module).getAnExportedValue(_).getAFunctionValue() = func
+  )
+}
+
+private class ServerFunctionRemoteFlowSource extends RemoteFlowSource {
+  ServerFunctionRemoteFlowSource() {
+    exists(DataFlow::FunctionNode func |
+      isServerFunction(func) and
+      this = func.getAParameter()
+    )
+  }
+
+  override string getSourceType() { result = "React server function parameter" }
+}
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/tests.expected b/javascript/ql/test/library-tests/frameworks/ReactJS/tests.expected
index 1e1607801cfc..9b453989bb80 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/tests.expected
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/tests.expected
@@ -305,3 +305,7 @@ threatModelSource
 | statePropertyWrites.js:38:24:38:33 | this.props | view-component-input |
 | thisAccesses.js:31:12:31:16 | props | view-component-input |
 | thisAccesses.js:48:18:48:18 | y | view-component-input |
+| use-server1.js:2:5:2:5 | x | remote |
+| use-server1.js:3:5:3:5 | y | remote |
+| use-server2.js:4:5:4:5 | x | remote |
+| use-server2.js:5:5:5:5 | y | remote |
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/use-server1.js b/javascript/ql/test/library-tests/frameworks/ReactJS/use-server1.js
index 3773edf957ad..1625ff23d1c0 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/use-server1.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/use-server1.js
@@ -1,6 +1,6 @@
 async function getData(
-    x, // $ MISSING: threatModelSource=remote
-    y) { // $ MISSING: threatModelSource=remote
+    x, // $ threatModelSource=remote
+    y) { // $ threatModelSource=remote
   "use server";
 }
 
diff --git a/javascript/ql/test/library-tests/frameworks/ReactJS/use-server2.js b/javascript/ql/test/library-tests/frameworks/ReactJS/use-server2.js
index e91b59b50d30..fa0bbab05527 100644
--- a/javascript/ql/test/library-tests/frameworks/ReactJS/use-server2.js
+++ b/javascript/ql/test/library-tests/frameworks/ReactJS/use-server2.js
@@ -1,8 +1,8 @@
 "use server";
 
 export async function getData(
-    x, // $ MISSING: threatModelSource=remote
-    y) { // $ MISSING: threatModelSource=remote
+    x, // $ threatModelSource=remote
+    y) { // $ threatModelSource=remote
 }
 
 async function getData2(

From 61887beae01101c54f34d892deece617d4101ebd Mon Sep 17 00:00:00 2001
From: Asger F <asgerf@github.com>
Date: Mon, 23 Jun 2025 16:02:45 +0200
Subject: [PATCH 11/12] JS: Add test case for false positive

---
 .../CodeInjection/CodeInjection.expected       | 18 ++++++++++++++++--
 .../HeuristicSourceCodeInjection.expected      | 15 ++++++++++++++-
 .../CodeInjection/react-server-function.js     |  5 +++++
 .../Security/CWE-094/CodeInjection/react.js    | 15 ++++++++++++---
 4 files changed, 47 insertions(+), 6 deletions(-)
 create mode 100644 javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/react-server-function.js

diff --git a/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/CodeInjection.expected b/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/CodeInjection.expected
index 4d54adb27249..412f0a5c5fa5 100644
--- a/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/CodeInjection.expected
+++ b/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/CodeInjection.expected
@@ -65,7 +65,8 @@
 | module.js:11:17:11:30 | req.query.code | module.js:11:17:11:30 | req.query.code | module.js:11:17:11:30 | req.query.code | This code execution depends on a $@. | module.js:11:17:11:30 | req.query.code | user-provided value |
 | react-native.js:8:32:8:38 | tainted | react-native.js:7:17:7:33 | req.param("code") | react-native.js:8:32:8:38 | tainted | This code execution depends on a $@. | react-native.js:7:17:7:33 | req.param("code") | user-provided value |
 | react-native.js:10:23:10:29 | tainted | react-native.js:7:17:7:33 | req.param("code") | react-native.js:10:23:10:29 | tainted | This code execution depends on a $@. | react-native.js:7:17:7:33 | req.param("code") | user-provided value |
-| react.js:10:56:10:77 | documen ... on.hash | react.js:10:56:10:77 | documen ... on.hash | react.js:10:56:10:77 | documen ... on.hash | This code execution depends on a $@. | react.js:10:56:10:77 | documen ... on.hash | user-provided value |
+| react.js:11:56:11:77 | documen ... on.hash | react.js:11:56:11:77 | documen ... on.hash | react.js:11:56:11:77 | documen ... on.hash | This code execution depends on a $@. | react.js:11:56:11:77 | documen ... on.hash | user-provided value |
+| react.js:25:8:25:11 | data | react-server-function.js:3:35:3:35 | x | react.js:25:8:25:11 | data | This code execution depends on a $@. | react-server-function.js:3:35:3:35 | x | user-provided value |
 | template-sinks.js:20:17:20:23 | tainted | template-sinks.js:18:19:18:31 | req.query.foo | template-sinks.js:20:17:20:23 | tainted | Template, which may contain code, depends on a $@. | template-sinks.js:18:19:18:31 | req.query.foo | user-provided value |
 | template-sinks.js:21:16:21:22 | tainted | template-sinks.js:18:19:18:31 | req.query.foo | template-sinks.js:21:16:21:22 | tainted | Template, which may contain code, depends on a $@. | template-sinks.js:18:19:18:31 | req.query.foo | user-provided value |
 | template-sinks.js:22:18:22:24 | tainted | template-sinks.js:18:19:18:31 | req.query.foo | template-sinks.js:22:18:22:24 | tainted | Template, which may contain code, depends on a $@. | template-sinks.js:18:19:18:31 | req.query.foo | user-provided value |
@@ -156,6 +157,12 @@ edges
 | react-native.js:7:7:7:33 | tainted | react-native.js:8:32:8:38 | tainted | provenance |  |
 | react-native.js:7:7:7:33 | tainted | react-native.js:10:23:10:29 | tainted | provenance |  |
 | react-native.js:7:17:7:33 | req.param("code") | react-native.js:7:7:7:33 | tainted | provenance |  |
+| react-server-function.js:3:35:3:35 | x | react-server-function.js:4:12:4:12 | x | provenance |  |
+| react-server-function.js:4:12:4:12 | x | react-server-function.js:4:12:4:29 | x + " from server" | provenance |  |
+| react-server-function.js:4:12:4:29 | x + " from server" | react.js:24:20:24:44 | echoSer ... value") [PromiseValue] | provenance |  |
+| react.js:24:9:24:45 | data | react.js:25:8:25:11 | data | provenance |  |
+| react.js:24:16:24:45 | use(ech ... alue")) | react.js:24:9:24:45 | data | provenance |  |
+| react.js:24:20:24:44 | echoSer ... value") [PromiseValue] | react.js:24:16:24:45 | use(ech ... alue")) | provenance |  |
 | template-sinks.js:18:9:18:31 | tainted | template-sinks.js:20:17:20:23 | tainted | provenance |  |
 | template-sinks.js:18:9:18:31 | tainted | template-sinks.js:21:16:21:22 | tainted | provenance |  |
 | template-sinks.js:18:9:18:31 | tainted | template-sinks.js:22:18:22:24 | tainted | provenance |  |
@@ -287,7 +294,14 @@ nodes
 | react-native.js:7:17:7:33 | req.param("code") | semmle.label | req.param("code") |
 | react-native.js:8:32:8:38 | tainted | semmle.label | tainted |
 | react-native.js:10:23:10:29 | tainted | semmle.label | tainted |
-| react.js:10:56:10:77 | documen ... on.hash | semmle.label | documen ... on.hash |
+| react-server-function.js:3:35:3:35 | x | semmle.label | x |
+| react-server-function.js:4:12:4:12 | x | semmle.label | x |
+| react-server-function.js:4:12:4:29 | x + " from server" | semmle.label | x + " from server" |
+| react.js:11:56:11:77 | documen ... on.hash | semmle.label | documen ... on.hash |
+| react.js:24:9:24:45 | data | semmle.label | data |
+| react.js:24:16:24:45 | use(ech ... alue")) | semmle.label | use(ech ... alue")) |
+| react.js:24:20:24:44 | echoSer ... value") [PromiseValue] | semmle.label | echoSer ... value") [PromiseValue] |
+| react.js:25:8:25:11 | data | semmle.label | data |
 | template-sinks.js:18:9:18:31 | tainted | semmle.label | tainted |
 | template-sinks.js:18:19:18:31 | req.query.foo | semmle.label | req.query.foo |
 | template-sinks.js:20:17:20:23 | tainted | semmle.label | tainted |
diff --git a/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/HeuristicSourceCodeInjection.expected b/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/HeuristicSourceCodeInjection.expected
index a1c8354ecf71..5a249b086b97 100644
--- a/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/HeuristicSourceCodeInjection.expected
+++ b/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/HeuristicSourceCodeInjection.expected
@@ -58,6 +58,12 @@ edges
 | react-native.js:7:7:7:33 | tainted | react-native.js:8:32:8:38 | tainted | provenance |  |
 | react-native.js:7:7:7:33 | tainted | react-native.js:10:23:10:29 | tainted | provenance |  |
 | react-native.js:7:17:7:33 | req.param("code") | react-native.js:7:7:7:33 | tainted | provenance |  |
+| react-server-function.js:3:35:3:35 | x | react-server-function.js:4:12:4:12 | x | provenance |  |
+| react-server-function.js:4:12:4:12 | x | react-server-function.js:4:12:4:29 | x + " from server" | provenance |  |
+| react-server-function.js:4:12:4:29 | x + " from server" | react.js:24:20:24:44 | echoSer ... value") [PromiseValue] | provenance |  |
+| react.js:24:9:24:45 | data | react.js:25:8:25:11 | data | provenance |  |
+| react.js:24:16:24:45 | use(ech ... alue")) | react.js:24:9:24:45 | data | provenance |  |
+| react.js:24:20:24:44 | echoSer ... value") [PromiseValue] | react.js:24:16:24:45 | use(ech ... alue")) | provenance |  |
 | template-sinks.js:18:9:18:31 | tainted | template-sinks.js:20:17:20:23 | tainted | provenance |  |
 | template-sinks.js:18:9:18:31 | tainted | template-sinks.js:21:16:21:22 | tainted | provenance |  |
 | template-sinks.js:18:9:18:31 | tainted | template-sinks.js:22:18:22:24 | tainted | provenance |  |
@@ -191,7 +197,14 @@ nodes
 | react-native.js:7:17:7:33 | req.param("code") | semmle.label | req.param("code") |
 | react-native.js:8:32:8:38 | tainted | semmle.label | tainted |
 | react-native.js:10:23:10:29 | tainted | semmle.label | tainted |
-| react.js:10:56:10:77 | documen ... on.hash | semmle.label | documen ... on.hash |
+| react-server-function.js:3:35:3:35 | x | semmle.label | x |
+| react-server-function.js:4:12:4:12 | x | semmle.label | x |
+| react-server-function.js:4:12:4:29 | x + " from server" | semmle.label | x + " from server" |
+| react.js:11:56:11:77 | documen ... on.hash | semmle.label | documen ... on.hash |
+| react.js:24:9:24:45 | data | semmle.label | data |
+| react.js:24:16:24:45 | use(ech ... alue")) | semmle.label | use(ech ... alue")) |
+| react.js:24:20:24:44 | echoSer ... value") [PromiseValue] | semmle.label | echoSer ... value") [PromiseValue] |
+| react.js:25:8:25:11 | data | semmle.label | data |
 | template-sinks.js:18:9:18:31 | tainted | semmle.label | tainted |
 | template-sinks.js:18:19:18:31 | req.query.foo | semmle.label | req.query.foo |
 | template-sinks.js:20:17:20:23 | tainted | semmle.label | tainted |
diff --git a/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/react-server-function.js b/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/react-server-function.js
new file mode 100644
index 000000000000..9c6bf514201a
--- /dev/null
+++ b/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/react-server-function.js
@@ -0,0 +1,5 @@
+"use server";
+
+export async function echoService(x) { // $ Source[js/code-injection]
+    return x + " from server";
+}
diff --git a/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/react.js b/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/react.js
index 32db7a3f621a..ab6ff096af43 100644
--- a/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/react.js
+++ b/javascript/ql/test/query-tests/Security/CWE-094/CodeInjection/react.js
@@ -1,6 +1,7 @@
-import React from "react";
+import React, { use } from "react";
 import {Helmet} from "react-helmet";
- 
+import { echoService } from "./react-server-function";
+
 class Application extends React.Component {
   render () {
     return (
@@ -14,4 +15,12 @@ class Application extends React.Component {
   }
 };
 
-export default Application
\ No newline at end of file
+export default Application
+
+export function Component() {
+  // We currently get false-positive flow through server functions in cases where a safe value
+  // is passed as the argument, which flows to the return value. In this case, the tainted parameter
+  // flows out of the return value regardless.
+  const data = use(echoService("safe value"));
+  eval(data); // $ SPURIOUS: Alert[js/code-injection]
+}

From 4fc5738deddbfba85fab2e79cd2fde7cb95498a3 Mon Sep 17 00:00:00 2001
From: Asger F <asgerf@github.com>
Date: Mon, 23 Jun 2025 16:08:21 +0200
Subject: [PATCH 12/12] JS: Change note

---
 .../ql/src/change-notes/2025-06-23-react-use-server.md       | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 javascript/ql/src/change-notes/2025-06-23-react-use-server.md

diff --git a/javascript/ql/src/change-notes/2025-06-23-react-use-server.md b/javascript/ql/src/change-notes/2025-06-23-react-use-server.md
new file mode 100644
index 000000000000..b3d3088b640e
--- /dev/null
+++ b/javascript/ql/src/change-notes/2025-06-23-react-use-server.md
@@ -0,0 +1,5 @@
+---
+category: majorAnalysis
+---
+* Taint is now tracked through the React `use` function.
+* Parameters of React server functions, marked with the `"use server"` directive, are now seen as taint sources.