Updated tanstack to use API graph.

Author: Napalys

javascript/ql/lib/semmle/javascript/frameworks/Tanstack.qll

@@ -10,24 +10,17 @@ private import javascript
  */
 class TanstackStep extends DataFlow::AdditionalFlowStep {
   override predicate step(DataFlow::Node node1, DataFlow::Node node2) {
-    exists(DataFlow::CallNode useQuery |
+    exists(API::CallNode useQuery |
       useQuery = useQueryCall() and
-      node1 =
-        useQuery
-            .getArgument(0)
-            .getALocalSource()
-            .getAPropertyWrite("queryFn")
-            .getRhs()
-            .getAFunctionValue()
-            .getAReturn() and
-      node2 = useQuery.getAPropertyRead("data")
+      node1 = useQuery.getParameter(0).getMember("queryFn").getReturn().getPromised().asSink() and
+      node2 = useQuery.getReturn().getMember("data").asSource()
     )
   }
 }
 
 /**
  * Retrieves a call node representing a useQuery invocation from the '@tanstack/react-query' module.
  */
-DataFlow::CallNode useQueryCall() {
-  result = DataFlow::moduleImport("@tanstack/react-query").getAPropertyRead("useQuery").getACall()
+API::CallNode useQueryCall() {
+  result = API::moduleImport("@tanstack/react-query").getMember("useQuery").getACall()
 }

javascript/ql/test/query-tests/Security/CWE-079/DomBasedXssWithResponseThreat/Xss.expected

@@ -1,5 +1,5 @@
 #select
-| test.jsx:25:29:25:32 | data | test.jsx:5:28:5:63 | fetch(" ... ntent") | test.jsx:25:29:25:32 | data | Cross-site scripting vulnerability due to $@. | test.jsx:5:28:5:63 | fetch(" ... ntent") | user-provided value |
+| test.jsx:27:29:27:32 | data | test.jsx:5:28:5:63 | fetch(" ... ntent") | test.jsx:27:29:27:32 | data | Cross-site scripting vulnerability due to $@. | test.jsx:5:28:5:63 | fetch(" ... ntent") | user-provided value |
 edges
 | test.jsx:5:11:5:63 | response | test.jsx:6:24:6:31 | response | provenance |  |
 | test.jsx:5:22:5:63 | await f ... ntent") | test.jsx:5:11:5:63 | response | provenance |  |
@@ -8,8 +8,8 @@ edges
 | test.jsx:6:18:6:38 | await r ... .json() | test.jsx:6:11:6:38 | data | provenance |  |
 | test.jsx:6:24:6:31 | response | test.jsx:6:24:6:38 | response.json() | provenance |  |
 | test.jsx:6:24:6:38 | response.json() | test.jsx:6:18:6:38 | await r ... .json() | provenance |  |
-| test.jsx:7:12:7:15 | data | test.jsx:11:11:15:5 | data | provenance |  |
-| test.jsx:11:11:15:5 | data | test.jsx:25:29:25:32 | data | provenance |  |
+| test.jsx:7:12:7:15 | data | test.jsx:15:11:17:5 | data | provenance |  |
+| test.jsx:15:11:17:5 | data | test.jsx:27:29:27:32 | data | provenance |  |
 nodes
 | test.jsx:5:11:5:63 | response | semmle.label | response |
 | test.jsx:5:22:5:63 | await f ... ntent") | semmle.label | await f ... ntent") |
@@ -19,6 +19,6 @@ nodes
 | test.jsx:6:24:6:31 | response | semmle.label | response |
 | test.jsx:6:24:6:38 | response.json() | semmle.label | response.json() |
 | test.jsx:7:12:7:15 | data | semmle.label | data |
-| test.jsx:11:11:15:5 | data | semmle.label | data |
-| test.jsx:25:29:25:32 | data | semmle.label | data |
+| test.jsx:15:11:17:5 | data | semmle.label | data |
+| test.jsx:27:29:27:32 | data | semmle.label | data |
 subpaths

javascript/ql/test/query-tests/Security/CWE-079/DomBasedXssWithResponseThreat/test.jsx

@@ -1,17 +1,19 @@
 import React from "react";
-import { useQuery } from "@tanstack/react-query";
+import { useQuery } from "./wrapper";
 
 const fetchContent = async () => {
     const response = await fetch("https://example.com/content"); // $ Source[js/xss]
     const data = await response.json();
     return data;
 };
 
+const getQueryOptions = () => {
+    return {queryFn: fetchContent};
+}
+
 const ContentWithDangerousHtml = () => {
     const { data, error, isLoading } = useQuery(
-        {
-            queryFn: fetchContent
-        }   
+        getQueryOptions()
     );
 
     if (isLoading) return <div>Loading...</div>;

javascript/ql/test/query-tests/Security/CWE-079/DomBasedXssWithResponseThreat/wrapper.js

@@ -0,0 +1,2 @@
+import { useQuery } from "@tanstack/react-query";
+export { useQuery}