search

vuejs / devtools

⚙️ Browser devtools extension for debugging Vue.js applications.
https://devtools.vuejs.org/
MIT License
1.7k stars 122 forks source link

Improve the display text on computed values that are not accessed. #535

Open NHZEX opened 4 months ago

NHZEX commented 4 months ago

I encountered an issue where a computed property shows as undefined in the Vue Devtools when it's not used in the template. This behavior is confusing and can make debugging more difficult.

Preview: https://stackblitz.com/edit/vitejs-vite-md6fq8?file=src%2Fcomponents%2FHelloWorld.vue

alexzhang1030 commented 4 months ago

This is a vue design pattern. Computers are lazy, we will never know its value until somewhere access computedValue.value. See computed implementation

alexzhang1030 commented 4 months ago

We can improve the display text on computed values that are not accessed.

NHZEX commented 4 months ago

We can improve the display text on computed values that are not accessed.

Is it possible to provide a feature in devtools that actively triggers the computation of these values?

alexzhang1030 commented 4 months ago

We can improve the display text on computed values that are not accessed.

Is it possible to provide a feature in devtools that actively triggers the computation of these values?

I would not recommend doing it. Access value will make devtools the computed values' dependency, which will mess up the reactivity system and introduce some perf issues.

In the future, we might make this as a devtools plugin.