Merge pull request #5 from adrienpessu/adrienpessu-solid-eureka

JS: Model Vue Composition API and vue-router useRoute sources via data extensions

Author: adrienpessu

javascript/ql/lib/change-notes/2026-07-16-vue-router-useRoute-query.md

@@ -1,5 +1,5 @@
 ---
 category: minorAnalysis
 ---
-* The query parameter of Vue Router's `useRoute()` Composition API is now recognized as a client-side remote flow source.
+* The route object returned by Vue Router's `useRoute()` Composition API is now recognized as a client-side remote flow source, covering its `query`, `params`, `path`, `fullPath`, and `hash` members. These members are additionally reported under the corresponding `browser-url-query`, `browser-url-path`, and `browser-url-fragment` threat models.
 * Added flow models for Vue's `ref`, `shallowRef`, `toRef`, `reactive`, and `computed` Composition API helpers.

javascript/ql/lib/ext/vue.model.yml

@@ -1,8 +1,21 @@
 extensions:
+  - addsTo:
+      pack: codeql/javascript-all
+      extensible: sourceModel
+    data:
+      # `useRoute()` — Vue Router's Composition API returns a route object whose URL-derived
+      # members are client-side remote flow sources.
+      - ["vue-router", "Member[useRoute].ReturnValue.Member[params,path,fullPath]", "browser-url-path"]
+      - ["vue-router", "Member[useRoute].ReturnValue.Member[query]", "browser-url-query"]
+      - ["vue-router", "Member[useRoute].ReturnValue.Member[hash]", "browser-url-fragment"]
   - addsTo:
       pack: codeql/javascript-all
       extensible: summaryModel
     data:
+      # `ref`, `shallowRef`, `toRef` — the wrapped argument flows to `.value`.
+      - ["vue", "Member[ref,shallowRef,toRef]", "Argument[0]", "ReturnValue.Member[value]", "value"]
+      # `reactive` — the wrapped argument taints the returned reactive object.
+      - ["vue", "Member[reactive]", "Argument[0]", "ReturnValue", "taint"]
       # `computed(() => ...)` — function overload: the getter's return value flows to `.value`.
       - ["vue", "Member[computed]", "Argument[0].ReturnValue", "ReturnValue.Member[value]", "value"]
       # `computed({ get() { ... } })` — object overload: the `get` getter's return value flows to `.value`.

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

@@ -35,40 +35,6 @@ module Vue {
     result = any(GlobalVueEntryPoint e).getANode()
   }
 
-  /**
-   * Models data flow through Vue Composition API helpers.
-   *
-   * Note that `computed` is not modeled here but in the `vue.model.yml` data
-   * extension, because its object overload (`computed({ get() { ... } })`)
-   * requires callback flow synthesis that data extensions support but a
-   * hand-written `SummarizedCallable` does not.
-   */
-  overlay[local?]
-  private class VueCompositionApiSummary extends DataFlow::SummarizedCallable::Range {
-    string name;
-
-    VueCompositionApiSummary() {
-      name = ["ref", "shallowRef", "toRef", "reactive"] and
-      this = "vue." + name
-    }
-
-    override predicate propagatesFlow(string input, string output, boolean preservesValue) {
-      name = ["ref", "shallowRef", "toRef"] and
-      input = "Argument[0]" and
-      output = "ReturnValue.Member[value]" and
-      preservesValue = true
-      or
-      name = "reactive" and
-      input = "Argument[0]" and
-      output = "ReturnValue" and
-      preservesValue = false
-    }
-
-    override DataFlow::InvokeNode getACall() {
-      result = API::moduleImport("vue").getMember(name).getACall()
-    }
-  }
-
   /**
    * Gets a reference to the 'Vue' object.
    */
@@ -686,8 +652,6 @@ module Vue {
     t.start() and
     (
       exists(API::Node router | router = API::moduleImport("vue-router") |
-        result = router.getMember("useRoute").getACall()
-        or
         result = router.getInstance().getMember("currentRoute").asSource()
         or
         result =

javascript/ql/test/library-tests/frameworks/Vue/tests.expected

@@ -240,6 +240,7 @@ threatModelSource
 | router.js:39:5:39:14 | from.query | remote |
 | router.js:43:5:43:12 | to.query | remote |
 | router.js:44:5:44:14 | from.query | remote |
+| router.js:47:1:47:16 | useRoute().query | browser-url-query |
 | router.js:47:1:47:16 | useRoute().query | remote |
 | single-component-file-1.vue:7:45:7:54 | this.input | view-component-input |
 | single-file-component-3-script.js:5:42:5:51 | this.input | view-component-input |