vuejs / vuejs/devtools

Support component tree negative filter

Open
#1,002 2 comments 2 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

enhancement
Dominant language
TypeScript
Stars
2.9k
Forks
279
PR merge metrics
No merged PRs in 30d

Description

What problem does this feature solve?

When looking at the component tree there are often wrapper components that you don't need to look for, that clutter the view.

It would be awesome if you could filter out certain components by a negative search pattern, just like Chrome devtools does in the console and network views.

Image

So if I typed -loading I would expect to see my full DOM tree but with the <loading> components hidden. Importantly: I would still see the children of the <loading> components.

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

The issue names no files or tests; first locate the component-tree search and filtering entry point, then read how the tree is rendered. Done means a negative pattern such as -loading hides matching components while preserving their children in the visible tree.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
devtools, frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.