vuejs / vuejs/test-utils

Bug: Within mounted component Vue warns about slot outside render function

Open
#2,135 0 comments 2 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug
Dominant language
TypeScript
Stars
1.2k
Forks
291
Avg merge
1d 9h
Merged PRs (30d)
18

Description

Describe the bug

When calling slot content within an onBeforeUpdate hook, Vue will incorrectly warn [Vue warn]: Slot "X" invoked outside of the render function: this will not track dependencies used in the slot. Invoke the slot function inside the render function instead.

This does not happen outside of VTU tests.
https://play.vuejs.org/#eNqtVdGO0zoQ/ZXZINGuaJPlstK9N2wXAQIJhACxwAvhIZs4rRfHtmynFFX9d2ZsJ03LLrywD1t75ng8c854sk2eap2uO5bkyYWtDNcOLHOdviwkb7UyDrZgWAM7aIxqYYLQyeB6rlod7WlGG4p06D4/8J9HQCEvsnAb3oMbx1otSsdwB3DhkX6Jm94F98rKcSXtoki2UJeuhF2RRFQ8NOwOzjVKjRz0xyVIZh2rwQrlctj2AXejANlBUsE0uuTIH3yU9YEjmSV0RXpjkeCBUG4/v1U1mxFDLZNuBi9NuaTVEc+FzLJgWDmnbZ5lS+5W3XVaqTZDyI3NKmVYdi3UddaWXGa6rL6VS2Yz00nHWzb3fmuqbMWEZgYdTNbMXFFWzt5789/5/M3//xaSbXxyTSc9zbBkjjDPlXSY13QtMWF7ClsqljcwPektBtvFIKGdEOSL2+BNrWrZtFpxUcPiMhyOxyMHwXk6hHGmY3uUd6buh2awWCx6ugZwUwo7Qvc6HZ0auL1/v0ecHFUXTvj/SM9pgN12zVGWuwh9EusNuzySgd3kBYzUVti8Dj4M9MMCplvfgRiH6KElHbkb7wmUZctymOwdkxmZtVHYIfBlQmEmX70taA3TqNs+/xVHbfx1WARCMVVs1f4J/2EYzKCzjC62M1DyGWuwxT5pfEHs9jGxPWqm2bio/kSaxYfi2z7UThaLZffXTZHu4ME3HSnBfMhcyMNMplhz33ERnK5L0WFLHLe2vyVF0JMU9XDcCaL3I/1OUBkMTjL/bmDVfB2ngp+I06vA3RVxFzuEMLCe8wbHV8ynSKASpaWB5qUYDbOT+fziZSwxu5zP954RczmdOgiXDbOpz6hfHQwl3Fr3QzCwldKs9kDfDX2X6LKuuVzm8PAfvXkcbNc4WJZGdbLOcRQ3tTdj2yAvFCvMumHG/9XPCUAvu5/SQfMzJBZDv0INDQo71ptQQewHD1C8GTw8OyP4nRIWbiThaBn1PM99yF+/E3uece0JpLeJksRPFUqS0wG00M+gMCaC4LsEQh4dKiMbvsTnoCRy6csqEpz6mgtm3ukYHlMKEfFKIdT3195G08k/f39mxapvt9hv7IZsRfLeMIsUsiIZfK40+EaC+8XVW7bB9eBsVd0JRP/G+YFZJTrKMcCeYddg2iOcz/aVlx0b7aN9scGnaPuihvHq8UWCbUBC3FX6Pt1H6aPYlrtk9xPxVe9N

To Reproduce

https://stackblitz.com/edit/github-guxdre?file=src%2Fcomponents%2FHelloWorld.vue,src%2Fcomponents%2F__tests__%2FHelloWorld.spec.ts,src%2FApp.vue

Expected behavior

Test should pass without throwing warnings.
Is there any current recommended solution to this other than parsing the warnings in jest and removing this one?

Related information:

Additional context

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the reproduction files src/components/HelloWorld.vue, src/components/tests/HelloWorld.spec.ts, and src/App.vue from the linked StackBlitz project. Run the test and inspect how the mounted component invokes slot content during onBeforeUpdate. Done means the test passes without the reported slot warning, with coverage for this behavior in the relevant test file.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
testing-qa
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.