Skip to content

✨ add vue-router-app sample and E2E tests#4333

Draft
mormubis wants to merge 1 commit intoadlrb/vue-trackerfrom
adlrb/vue-sample
Draft

✨ add vue-router-app sample and E2E tests#4333
mormubis wants to merge 1 commit intoadlrb/vue-trackerfrom
adlrb/vue-sample

Conversation

@mormubis
Copy link
Contributor

Motivation

Fifth and final PR (#4325, #4327, #4328, #4330 are the first four). Adds a Vite sample app and E2E tests that verify all three features of the integration work end-to-end in a real browser.

Changes

`test/apps/vue-router-app` is a Vue 3 SPA wiring up `vuePlugin`, `addVueError`, `createRouter` from `vue-router-v4`, and `UNSTABLE_useVueComponentTracker` together.

The app reads RUM config from URL query params (`?rum-config=...`) so the E2E framework can inject it at test time — same pattern as `nextjs-app-router`.

`test/e2e/scenario/vuePlugin.scenario.ts` covers the three features:

  • view names are parameterized (`/user/:id` not `/user/42`)
  • errors are captured with `context.framework: "vue"`
  • component render vitals are emitted for tracked components

The E2E framework gets a `withVueApp()` helper (mirrors `withNextjsApp()`) and a Vite web server entry in `playwright.base.config.ts`.

Test instructions

```bash
yarn test:e2e:init
yarn test:e2e -g "vue plugin"
```

Checklist

  • Tested locally
  • Tested on staging
  • Added unit tests (sample app, no unit tests needed)
  • Added e2e/integration tests
  • Updated documentation

@cit-pr-commenter-54b7da
Copy link

cit-pr-commenter-54b7da bot commented Mar 13, 2026

Bundles Sizes Evolution

📦 Bundle Name Base Size Local Size 𝚫 𝚫% Status
Rum N/A 175.02 KiB N/A N/A N/A
Rum Profiler N/A 6.16 KiB N/A N/A N/A
Rum Recorder N/A 27.46 KiB N/A N/A N/A
Logs N/A 56.80 KiB N/A N/A N/A
Rum Slim N/A 130.66 KiB N/A N/A N/A
Worker N/A 23.63 KiB N/A N/A N/A
🚀 CPU Performance
Action Name Base CPU Time (ms) Local CPU Time (ms) 𝚫%
RUM - add global context 0.0042 0.0044 +4.76%
RUM - add action 0.0138 0.0147 +6.52%
RUM - add error 0.0136 0.015 +10.29%
RUM - add timing 0.0029 0.0031 +6.90%
RUM - start view 0.0128 0.0143 +11.72%
RUM - start/stop session replay recording 0.0008 0.0009 +12.50%
Logs - log message 0.0169 0.018 +6.51%
🧠 Memory Performance
Action Name Base Memory Consumption Local Memory Consumption 𝚫
RUM - add global context 26.71 KiB 26.54 KiB -173 B
RUM - add action 51.49 KiB 50.52 KiB -996 B
RUM - add timing 26.85 KiB 26.84 KiB -13 B
RUM - add error 54.98 KiB 54.69 KiB -299 B
RUM - start/stop session replay recording 26.03 KiB 25.22 KiB -833 B
RUM - start view 465.58 KiB 462.91 KiB -2.67 KiB
Logs - log message 44.51 KiB 46.24 KiB +1.73 KiB

🔗 RealWorld

@datadog-prod-us1-6
Copy link

datadog-prod-us1-6 bot commented Mar 13, 2026

⚠️ Tests

Fix all issues with BitsAI or with Cursor

⚠️ Warnings

🧪 2 Tests failed

UNSTABLE_useVueComponentTracker reports a vueComponentRender vital on mount from Chrome 63.0.3239.84 (Windows 10) (Datadog) (Fix with Cursor)
TypeError: Object.fromEntries is not a function
    at getComponentsFromStubs (webpack:///node_modules/@vue/test-utils/dist/vue-test-utils.esm-bundler.mjs:290:1 <- /tmp/_karma_webpack_494305/commons.js:140285:19)
    at createInstance (webpack:///node_modules/@vue/test-utils/dist/vue-test-utils.esm-bundler.mjs:8305:1 <- /tmp/_karma_webpack_494305/commons.js:148300:24)
    at mount (webpack:///node_modules/@vue/test-utils/dist/vue-test-utils.esm-bundler.mjs:8365:1 <- /tmp/_karma_webpack_494305/commons.js:148360:14)
    at UserContext.it (webpack:///packages/rum-vue/src/domain/performance/useVueComponentTracker.spec.ts:27:16 <- /tmp/_karma_webpack_494305/commons.js:113282:69)
    at <Jasmine>
UNSTABLE_useVueComponentTracker reports is_first_render: false on update from Chrome 63.0.3239.84 (Windows 10) (Datadog) (Fix with Cursor)
TypeError: Object.fromEntries is not a function
    at getComponentsFromStubs (webpack:///node_modules/@vue/test-utils/dist/vue-test-utils.esm-bundler.mjs:290:1 <- /tmp/_karma_webpack_494305/commons.js:140285:19)
    at createInstance (webpack:///node_modules/@vue/test-utils/dist/vue-test-utils.esm-bundler.mjs:8305:1 <- /tmp/_karma_webpack_494305/commons.js:148300:24)
    at mount (webpack:///node_modules/@vue/test-utils/dist/vue-test-utils.esm-bundler.mjs:8365:1 <- /tmp/_karma_webpack_494305/commons.js:148360:14)
    at UserContext.it (webpack:///packages/rum-vue/src/domain/performance/useVueComponentTracker.spec.ts:58:32 <- /tmp/_karma_webpack_494305/commons.js:113309:85)
    at <Jasmine>

ℹ️ Info

No other issues found (see more)

❄️ No new flaky tests detected

🎯 Code Coverage (details)
Patch Coverage: 100.00%
Overall Coverage: 77.32% (+0.01%)

This comment will be updated automatically if new data arrives.
🔗 Commit SHA: 18d8e7c | Docs | Datadog PR Page | Was this helpful? React with 👍/👎 or give us feedback!

@mormubis mormubis force-pushed the adlrb/vue-tracker branch from 290c50e to 339e6f1 Compare March 16, 2026 15:33
@mormubis mormubis force-pushed the adlrb/vue-sample branch 2 times, most recently from 028cefc to 4b7de9e Compare March 16, 2026 15:44
@mormubis mormubis force-pushed the adlrb/vue-tracker branch from 339e6f1 to 0a7ccdf Compare March 16, 2026 15:44
@mormubis mormubis force-pushed the adlrb/vue-tracker branch from 0a7ccdf to ca26d99 Compare March 16, 2026 15:51
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant