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.

Sign up for GitHub

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

Jump to bottom

on:qvisible doesn't work on invisible elements like <head> #1062

Closed
felixsanz opened this issue Aug 14, 2022 · 1 comment · Fixed by #2365
Closed

on:qvisible doesn't work on invisible elements like <head> #1062

felixsanz opened this issue Aug 14, 2022 · 1 comment · Fixed by #2365
Labels
TYPE: bug Something isn't working
Milestone
1.0-rc0

Comments

@felixsanz
Copy link
Contributor

Qwik Version

0.0.100

Operating System (or Browser)

Chrome

Node Version (if applicable)

No response

Which component is affected?

Qwik Runtime

Expected Behaviour

Having a component like this one:

import { component$, useClientEffect$ } from '@builder.io/qwik'

export default component$(() => {
  useClientEffect$(() => {
    console.log('foo')
  })

  return (
    <></>
  )
})

And calling it inside head.tsx component doesn't work as expected because it produces:

<head q:id="2" q:head on:qvisible="/src/head_component_useclienteffect_euppxjgcjwg.js#_hW[0]">

Which means on:qvisible will never execute because head is not a visible element.

The workaround is:

  useClientEffect$((track) => {
    //...
  }, { eagerness: 'load' })

But i'm opening the issue as requested:

manucorporat — Today at 1:33 PM
This is an actual issue, we are appending a visibility event to head, qwik should be smart to print a warning or automatically use load in this scenario

Actual Behaviour

.

Additional Information

No response
@felixsanz felixsanz added TYPE: bug Something isn't working STATUS-1: needs triage New issue which needs to be triaged labels Aug 14, 2022
@manucorporat manucorporat added this to the 1.0-rc0 milestone Aug 22, 2022
@Varixo
Copy link
Member

Varixo commented Oct 9, 2022

Is it the same issue? #1413

@manucorporat manucorporat mentioned this issue Dec 4, 2022
Merged
3 tasks
manucorporat added a commit that referenced this issue Dec 4, 2022
@manucorporat
fix: useClientEffect() in empty components (#2365)
5c975a9 
fixes #1955
fixes #2329
fixes #1062
fixes #1413
fixes #1446
reemardelarosa pushed a commit to reemardelarosa/qwik that referenced this issue Dec 8, 2022
@manucorporat @reemardelarosa
fix: useClientEffect() in empty components (QwikDev#2365)
0e7c9a0 
fixes QwikDev#1955
fixes QwikDev#2329
fixes QwikDev#1062
fixes QwikDev#1413
fixes QwikDev#1446
mhevery pushed a commit that referenced this issue Dec 22, 2022
@reemardelarosa @manucorporat
@adamdbradley @ssmlee04 @TejasQ @bryanhannes @jwickers @forresst @Mhmdrza @shairez @brunocrosier @almilo @utherpally @Wimpert @prototypa @nnelgxorz @wmertens @saikatdas0790 @the-r3aper7 @Kesmek @zanettin @jweb89 @tuoitrevohoc @machineloop
docs: added cheatsheet for best practices (#2266)
eec2096 
* docs: added cheatsheet for anti patterns

* docs:cleanup

* chore: another clickup and spacing update

* chore: Release 0.14.1 (#2264)

* 0.14.1

* 🐤

* fix: page, endpoint, q-data GET request (#2265)

* chore: release qwik-city 0.0.127 (#2269)

* chore: Add my stock investing website (#2268)

:)

* fix: signal rendering of classes (#2271)

fixes #2245

* docs: fix a typo (#2279)

* docs: Inline causes the clock to not show (#2283)

clock.css is not correctly loaded which causes the clock to not show.
Error: Cannot find module './clock.css?inline' or its corresponding type declarations.

* docs: Tutorial onError should be onRejected (#2284)

When using onError in the IDE as provided in the example it gives the following error:
Property 'onError' does not exist on type 'IntrinsicAttributes & ResourceProps<string[]>'

The solution says it should be onRejected

* fix: not silent error during rendering (#2297)

* fix: correctly handle draggable and spellcheck (#2299)

Co-authored-by: Jeremy Wickersheimer <jwickers@gmail.com>

* docs: right menu for Getting Started & Think Qwik (#2243)

* fix: dev server 302 error (#2300)

* feat: non-serializable response data dev error (#2305)

* docs: fix typo (#2302)

* docs: include vercel edge in the adaptors overview (#2292)

* fix(optimizer): missing args passed to wasm fallback (#2308)

* fix: textarea value rendering in SSR (#2309)

fixes #2235

* feat: better error reporting (#2312)

* fix: render toggle + signal (#2313)

fixes #2311

* feat: Link prefetch by default (#2314)

* fix: useContent menu lookup (#2315)

* docs: updated img-models url in showcase (#2320)

* fix: rendering of sibling component and mandatory key (#2321)

* feat: click-to-source  (#2217) (#2319)



Co-authored-by: Bruno Crosier <bruno.crosier@gmail.com>

* chore: 0.15.0 (#2330)

* fix: client redirect for trailing slash (#2333)

* fix: forceConsistentCasingInFileNames in starters (#2334)

* docs: fix typos and improve explanations (#2332)

* fix: click-to-component (#2335)

* docs: fix some typos and align explanations (#2331)

* release: qwik-city 0.0.128 (#2337)

* docs: fix build.preview (#2341)

* chore: add vite ecosystem scripts (#2349)

* docs: fix typo lifecycle (#2346)

* feat: add URLSearchParams to serializer (#2352)

* refactor: use class prop without casting to any (#2348)


Co-authored-by: langbamit <langbamit@gmail.com>

* feat: add to package.json when present in the ssr dir (#2354)

* docs: Add Qwind starter template to showcase (#2343)

* fix: detect and error on array holes (#2356)

* chore: remove className (#2310)

* fix: textarea vdom patching (#2357)

fixes #2344

* fix: update features (#2363)

* fix: jsx rule with fragment (#2364)

fixes #2177

* feat: Pre-fetch Link data on anchor focus (#2358)

* fix: useClientEffect() in empty components (#2365)

fixes #1955
fixes #2329
fixes #1062
fixes #1413
fixes #1446

* chore: release 0.15.1 (#2366)

* docs: improve styling docs (#2367)

* fix: make array hole test more readable (#2369)

* 0.15.2 (#2371)

* docs: fix typo (#2372)

* docs: removed unnecessary fragments (#2361)

* docs: Add Guide On Using Map Functions In JSX (#2373)

* docs: remove async from component$ overview (#2377)

* feat: add config for dev inspector (#2375)

* docs(qwik-v-react): fix array key consistency in docs (#2383)

Qwik array map in qwik vs. react did not have key even though in rendering portion of docs it says
key is required

* fix(vite): module side effect (#2387)

* feat: detect invalid HTML (#2389)

* docs: link accessibility (#2386)

* feat: standardize params/query api (#2385)

Co-Authored-By: Tran Thien Khiem <20198928+tuoitrevohoc@users.noreply.github.com>

* docs(contributing): Add install note for wasm-pack (#2390)

To avoid running into unexpected `wasm-pack` failures when doing full build, adds note to Contributing docs about installation of `wasm-pack`, linking to site showing installation command for each platform.

* docs: update anti pattern to best practice

Co-authored-by: Manu MA <manu.mtza@gmail.com>
Co-authored-by: Adam Bradley <adamdbradley@users.noreply.github.com>
Co-authored-by: Shih-Min Lee <ssmlee04@gmail.com>
Co-authored-by: Tejas Kumar <tejas+lol@tejas.qa>
Co-authored-by: Bryan Hannes <31400961+bryanhannes@users.noreply.github.com>
Co-authored-by: Jeremy Wickersheimer <jwickers@gmail.com>
Co-authored-by: Forresst <forresst17@gmail.com>
Co-authored-by: Mhmdrz_a <mr.ala72@gmail.com>
Co-authored-by: Shai Reznik <shairez@users.noreply.github.com>
Co-authored-by: Bruno Crosier <bruno.crosier@gmail.com>
Co-authored-by: Alberto Mijares <almilo@users.noreply.github.com>
Co-authored-by: Uther Pally <43192714+langbamit@users.noreply.github.com>
Co-authored-by: langbamit <langbamit@gmail.com>
Co-authored-by: Wim Holvoet <holvoetwim@gmail.com>
Co-authored-by: prototypa <54446028+prototypa@users.noreply.github.com>
Co-authored-by: Glenn Becker <nnelgxorz@gmail.com>
Co-authored-by: Wout Mertens <Wout.Mertens@gmail.com>
Co-authored-by: Saikat Das <saikatdas0790@gmail.com>
Co-authored-by: Sai Srikar Dumpeti <80447788+the-r3aper7@users.noreply.github.com>
Co-authored-by: Justin Scopelleti <38704268+Kesmek@users.noreply.github.com>
Co-authored-by: roman zanettin <zanettin@users.noreply.github.com>
Co-authored-by: jweb89 <62513031+jweb89@users.noreply.github.com>
Co-authored-by: Tran Thien Khiem <20198928+tuoitrevohoc@users.noreply.github.com>
Co-authored-by: machineloop <3682072+machineloop@users.noreply.github.com>
@shairez shairez removed the STATUS-1: needs triage New issue which needs to be triaged label Mar 5, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
TYPE: bug Something isn't working
Projects
None yet
Milestone
1.0-rc0
Development

Successfully merging a pull request may close this issue.

fix: useClientEffect() in empty components QwikDev/qwik
4 participants
@manucorporat @shairez @felixsanz @Varixo