[🐞] Qwik + Astro, useVisibleTask$ does not work when using VT

[ITakayuki]

Which component is affected?

Qwik Runtime

Describe the bug

When using useVisibleTask$ in a Qwik component, if is set, useVisibleTask$ is not executed on page transitions in qwikdev/astro.
track, etc. will not work as well.
Please let me know if there is any workaround🙏
Thanks.

code

import { component$, useVisibleTask$ } from "@builder.io/qwik";

export default component$(() => {

  // Not executed when transitioned by ViewTransition
  useVisibleTask$(() => {
    console.log("useVisibleTask$");
  });
  return /* .... */
});

packages

"dependencies": {
  "@astrojs/check": "0.5.10",
  "@builder.io/qwik": "1.5.1",
  "@qwikdev/astro": "0.5.13",
  "astro": "4.5.12",
  "typescript": "5.4.3"
}

Issues

• document events run once per container, even when a container is added later
• we add a page change event for SPA. It also fires on first load together with document idle
• we fix visibility event with transition
• we fix not working track and cleanup

Reproduction

https://codesandbox.io/p/devbox/tvj6y4?file=%2Fsrc%2Fcomponents%2FQwikComponent.tsx%3A4%2C26

Steps to reproduce

1. Add <ViewTransition /> in .astro
2. Transition to a page using Qwik Component.
3. useVisibleTask$ is not executed

System Info

System:
    OS: macOS 13.6.3
    CPU: (8) arm64 Apple M2
    Memory: 53.94 MB / 24.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 18.14.1 - ~/.volta/tools/image/node/18.14.1/bin/node
    npm: 9.3.1 - ~/.volta/tools/image/node/18.14.1/bin/npm
  Browsers:
    Chrome: 123.0.6312.87
  npmPackages:
npmPackages:
    @builder.io/qwik: ^1.5.1 => 1.5.1 
    @qwikdev/astro: ^0.5.13 => 0.5.13

Additional Information

https://discord.com/channels/842438759945601056/1224276803267330069/1224276803267330069

[maiieul]

Hey @ITakayuki, please could you re-create your issue in the qwik/astro repository 🙏?

This way all of the Qwik/Astro integration issues stay in the same place and don't get duplicated.

[ITakayuki]

@maiieul
Thanks🙏
However, when I asked a question on Discord, I was told to create it in this repository.
Perhaps it is related to this one in terms of scope of work.

https://discord.com/channels/842438759945601056/1224276803267330069/1224276803267330069

[maiieul]

I see. Sorry, that looked to me like a Qwik/Astro meta-framework issue. If it is a bug in Qwik core then it belongs here indeed 👍.

[wmertens]

It seems to me that the view transition causes the intersection observer not to work. Feels like a bug to me

[ITakayuki]

This would be an astro-only solution, but how about using astro:page-load as a hook to run processReadyStateChange only when using viewTransition in astro?

Perhaps the reason is that hasInitialized = 1 and readystatechange does not fire if it is a SPA, so the update of events is not being performed.

What do you think?

ITakayuki@2369bd4

qwikloader.ts

[ITakayuki]

Close to move to issue QwikDev/astro#80