Skip to content

feat: Add selector parameter to scope DOM snapshots#42

Closed
imqqmi wants to merge 3 commits intofreema:mainfrom
imqqmi:main
Closed

feat: Add selector parameter to scope DOM snapshots#42
imqqmi wants to merge 3 commits intofreema:mainfrom
imqqmi:main

Conversation

@imqqmi
Copy link

@imqqmi imqqmi commented Feb 24, 2026

I'll provide this as is, I don't have too much free time to re-merge this. You're free to reject it of course.

- Always traverse children even when parent element is filtered out
- Relevant descendants now bubble up through non-relevant wrapper divs
- Text content check uses direct text only (not all descendant text)
- Add hasInteractiveDescendant() to include containers with interactive children
- Add includeAll option to bypass relevance filtering entirely

Fixes issue where wrapper divs with no id/class and long descendant text
were filtered out along with all their children, resulting in nearly
empty snapshots for SPA frameworks.
Allows scoping snapshots to a specific element using CSS selectors:
  take_snapshot({ selector: 'main' })
  take_snapshot({ selector: '#app table tbody' })
  take_snapshot({ selector: '.content-area' })

Benefits:
- Skip irrelevant nav/header/footer when focusing on main content
- Deeper traversal into target area without hitting node limits
- More efficient token usage for large pages
- Better iterative exploration (overview first, then zoom in)

Returns clear error if selector doesn't match any element.
Copy link
Owner

@freema freema left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the contribution! The core changes are solid — the tree walker fix for SPA frameworks and the selector parameter are both useful.

Before merging, a few things need attention:

  1. Drop package-lock.json — it's based on 0.5.2/0.6.0 but main is at 0.7.1
  2. Rebase on current main
  3. Remove unrelated .gitignore changes (agents/, opencode.json)
  4. Tests would be appreciated — significant refactor of treeWalker.ts

Happy to cherry-pick the core logic myself if you don't have time for the cleanup. Let me know!

@imqqmi
Copy link
Author

imqqmi commented Feb 25, 2026

Yes, please, cherry-pick, I'm not able to do it myself. I'll test it when I'm doing some front-end stuff.

@freema
Copy link
Owner

freema commented Feb 27, 2026

Hey @imqqmi, thanks for the contribution and for the inspiration! 🙏

We actually implemented the selector, includeAll, and bubble-up pattern features independently in recent releases. After reviewing your PR, we confirmed that all three features are already present in the current codebase:

  • selector parameter — scopes snapshot to a matched element (src/firefox/snapshot/injected/snapshot.injected.ts)
  • includeAll mode — includes all visible elements bypassing relevance filter (src/firefox/snapshot/injected/treeWalker.ts)
  • Bubble-up pattern — irrelevant parents are skipped, relevant children bubble up (src/firefox/snapshot/injected/treeWalker.ts)

I've also added comprehensive unit tests for the injected browser scripts covering all of these features:

  • tests/firefox/snapshot/injected/elementCollector.test.ts (27 tests)
  • tests/firefox/snapshot/injected/treeWalker.test.ts (13 tests)
  • tests/firefox/snapshot/injected/snapshot.injected.test.ts (8 tests)

Since the features are already shipped and tested, I'm going to close this PR. Thanks again for taking the time to put this together!

@freema
Copy link
Owner

freema commented Feb 27, 2026

FYI — the unit tests I mentioned are now up in PR #43: #43

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.

2 participants