Merge pull request #1 from adrienpessu/copilot/add-codeql-model-for-useroute-query

Model Vue Router useRoute query as a remote flow source

Author: adrienpessu

change-notes/1.26/analysis-javascript.md

@@ -42,6 +42,7 @@
   - [styled-components](https://www.npmjs.com/package/styled-components)
   - [throttle-debounce](https://www.npmjs.com/package/throttle-debounce)
   - [underscore](https://www.npmjs.com/package/underscore)
+  - [vue-router](https://www.npmjs.com/package/vue-router)
 
 * Analyzing files with the ".cjs" extension is now supported.
 * ES2021 features are now supported.

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

@@ -0,0 +1,4 @@
+---
+category: minorAnalysis
+---
+* The query parameter of Vue Router's `useRoute()` Composition API is now recognized as a client-side remote flow source.

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

@@ -0,0 +1,15 @@
+extensions:
+  - addsTo:
+      pack: codeql/javascript-all
+      extensible: summaryModel
+    data:
+      # ref(x).value === x
+      - ["vue", "Member[ref]", "Argument[0]", "ReturnValue.Member[value]", "value"]
+      # shallowRef(x).value === x
+      - ["vue", "Member[shallowRef]", "Argument[0]", "ReturnValue.Member[value]", "value"]
+      # customRef / toRef keep the wrapped value reachable via .value
+      - ["vue", "Member[toRef]", "Argument[0]", "ReturnValue.Member[value]", "taint"]
+      # reactive(x) returns a proxy that preserves the members of x
+      - ["vue", "Member[reactive]", "Argument[0]", "ReturnValue", "taint"]
+      # computed(() => expr).value === return value of the getter
+      - ["vue", "Member[computed]", "Argument[0].ReturnValue", "ReturnValue.Member[value]", "value"]

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

@@ -652,6 +652,8 @@ 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/router.js

@@ -1,4 +1,4 @@
-import Router from 'vue-router';
+import Router, { useRoute } from 'vue-router';
 
 export const router = new Router({
     routes: [
@@ -43,3 +43,5 @@ router.afterEach((to, from) => {
     to.query.x;
     from.query.x;
 });
+
+useRoute().query;

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

@@ -191,6 +191,7 @@ remoteFlowSource
 | router.js:39:5:39:14 | from.query |
 | router.js:43:5:43:12 | to.query |
 | router.js:44:5:44:14 | from.query |
+| router.js:47:1:47:16 | useRoute().query |
 parseErrors
 attribute
 | compont-with-route.vue:2:8:2:21 | v-html=dataA | v-html |
@@ -239,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 | 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 |
 | single-file-component-4.vue:21:14:21:23 | this.input | view-component-input |