Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

useElementVisibility options are not configureable #3525

Open
7 tasks done
maxjayne98 opened this issue Nov 2, 2023 · 1 comment
Open
7 tasks done

useElementVisibility options are not configureable #3525

maxjayne98 opened this issue Nov 2, 2023 · 1 comment

Comments

@maxjayne98
Copy link

Describe the bug

In this commit https://github.com/vueuse/vueuse/commit/429edda72fc283a7540c79afbea1a0a6299221ae the threshold option got hardcoded to 0, when you have a list of elements on the screen this change causes to trigger isVisible flag true while the element is not fully on the screen. when it used to be 0.1 we didn't have the problem(0.1 is the default threshold of useIntersectionObserver). I think the best way to fix it is to the default threshold if it's not defined on the options like the below. you just need to update your typescript interface as well.
const { window = defaultWindow, scrollTarget, threshold = 0 } = options

Reproduction

https://stackblitz.com/edit/vitejs-vite-rptfks/?file=package.json

System Info

System:
    OS: macOS 14.1
    CPU: (8) arm64 Apple M1 Pro
    Memory: 816.78 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.11.0 - ~/.nvm/versions/node/v18.11.0/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 8.19.2 - ~/.nvm/versions/node/v18.11.0/bin/npm
    pnpm: 7.33.6 - ~/Library/pnpm/pnpm
    Watchman: 2023.04.10.00 - /opt/homebrew/bin/watchman
  Browsers:
    Brave Browser: 117.1.58.131
    Chrome: 118.0.5993.117
    Safari: 17.1
  npmPackages:
    @vueuse/components: 10.2.1 => 10.2.1 
    @vueuse/core: 10.2.1 => 10.4.1 
    @vueuse/head: ^1.1.26 => 1.3.1 
    vue: ^3.3.4 => 3.3.4

Used Package Manager

pnpm

Validations

@matrunchyk
Copy link

Indeed this is an important feature. Not very useful otherwise. "Only fully visible" - this is oftenly used pattern when scrolling elements

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 a pull request may close this issue.

2 participants