fix(devtools): rework timeline function wrapping to run after key injection

[cernymatej]

🔗 Linked issue

fix #941

📚 Description

this aims to fix the issues with wrapping functions with __nuxtTimelineWrap after the changes in Nuxt that made function key injection stricter (and more accurate): nuxt/nuxt#33446

the main issue was that we wrapped functions before the key injection plugin transformed the code... as a result, the plugin only saw local variable declarations instead of imports and bailed out without injecting function keys

another issue, reported in nuxt/nuxt#34934, was that it attempted to wrap new compiler macros, even though they're not meant to be called that way

this implementation fixes both of these issues and improves on the original implementation by supporting explicitly imported functions too, where the old one only wrapped auto-imported functions

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 190857ac-8393-47aa-a7f5-177948572925

📥 Commits

Reviewing files that changed from the base of the PR and between d10cb86 and 689910f.

📒 Files selected for processing (3)

• playgrounds/tab-timeline/nuxt.config.ts
• tests/e2e/playwright.config.ts
• tests/e2e/specs/playground-tab-timeline.spec.ts

💤 Files with no reviewable changes (1)

• playgrounds/tab-timeline/nuxt.config.ts

---

📝 Walkthrough

Walkthrough

The timeline integration now wraps eligible imports in a post-build unplugin transform after key injection. A new wrapper utility handles static import bindings, helper injection, and source maps. Vitest coverage validates wrapping and transform filters. The timeline playground adds a keyed page, enables timeline support, and receives dev-only end-to-end coverage. Package and workspace configuration adds the required dependencies and test scripts.

Estimated code review effort: 4 (Complex) | ~45 minutes

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly summarizes the main change: moving timeline wrapping after key injection.
Description check	✅ Passed	The description matches the code changes and explains the timeline wrapping and key-injection fix.
Linked Issues check	✅ Passed	The implementation addresses #941 by running wrapping after key injection and excluding unsupported macros.
Out of Scope Changes check	✅ Passed	The added tests, playground updates, and config changes all support the timeline wrapping fix and validation.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint install timed out. The project may have too many dependencies for the sandbox.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[coderabbitai]

Actionable comments posted: 1

🧹 Nitpick comments (1)

packages/devtools/vitest.config.ts (1)

1-7: 🧹 Nitpick | 🔵 Trivial

Wire the new test suite into CI before merge.

Per the PR summary, tests were added but aren't yet configured in CI. This config also runs the 60s-timeout e2e suite (timeline.e2e.test.ts, which boots a real dev server) together with fast unit tests under the same vitest run invocation — consider splitting them (e.g. separate include globs/projects or a dedicated test:e2e script) once CI is wired up, so unit-test feedback isn't gated on booting a Nuxt dev server.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@packages/devtools/vitest.config.ts` around lines 1 - 7, Wire the new Vitest
suite into the repository’s CI workflow so it runs before merges. In the test
configuration around defineConfig, separate the fast unit tests from
timeline.e2e.test.ts into distinct globs, projects, or scripts, and ensure CI
invokes the unit suite independently so it is not gated by the real dev-server
e2e test.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@packages/devtools/src/integrations/timeline.ts`:
- Around line 87-104: Update the resolveId handling in the bySource processing
block to invoke ctx.resolveId(from) inside a promise-safe boundary so
synchronous throws become rejected resolutions handled as undefined. Ensure
resolvedFrom caches that safely handled promise and Promise.all cannot reject
from a resolver throw, preserving normal mapping behavior for successful
resolutions.

---

Nitpick comments:
In `@packages/devtools/vitest.config.ts`:
- Around line 1-7: Wire the new Vitest suite into the repository’s CI workflow
so it runs before merges. In the test configuration around defineConfig,
separate the fast unit tests from timeline.e2e.test.ts into distinct globs,
projects, or scripts, and ensure CI invokes the unit suite independently so it
is not gated by the real dev-server e2e test.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 04b140c7-e9b9-4e43-a2cc-3271b7c282b2

📥 Commits

Reviewing files that changed from the base of the PR and between 0c94730 and d10cb86.

⛔ Files ignored due to path filters (1)

• pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (11)

• packages/devtools/package.json
• packages/devtools/src/integrations/timeline-wrap.ts
• packages/devtools/src/integrations/timeline.ts
• packages/devtools/test/fixtures/timeline/app.vue
• packages/devtools/test/fixtures/timeline/nuxt.config.ts
• packages/devtools/test/timeline-wrap.test.ts
• packages/devtools/test/timeline.e2e.test.ts
• packages/devtools/vitest.config.ts
• playgrounds/tab-timeline/components/GlobalNav.vue
• playgrounds/tab-timeline/pages/keyed.vue
• pnpm-workspace.yaml