fix: RUN_QRL host object

Author: Varixo

packages/qwik/src/core/client/queue-qrl.ts

@@ -4,6 +4,7 @@ import { ChoreType } from '../shared/scheduler';
 import { getInvokeContext } from '../use/use-core';
 import { useLexicalScope } from '../use/use-lexical-scope.public';
 import { _getQContainerElement, getDomContainer } from './dom-container';
+import type { ElementVNode } from './types';
 
 /**
  * This is called by qwik-loader to schedule a QRL. It has to be synchronous.
@@ -14,14 +15,13 @@ export const queueQRL = (...args: unknown[]) => {
   // This will already check container
   const [runQrl] = useLexicalScope<[QRLInternal<(...args: unknown[]) => unknown>]>();
   const context = getInvokeContext();
-  const el = context.$element$!;
-  const containerElement = _getQContainerElement(el) as HTMLElement;
-  const container = getDomContainer(containerElement);
+  const hostElement = context.$hostElement$ as ElementVNode;
+  const container = getDomContainer(hostElement);
 
   const scheduler = container.$scheduler$;
   if (!scheduler) {
     throw qError(QError.schedulerNotFound);
   }
 
-  return scheduler(ChoreType.RUN_QRL, el, runQrl, args);
+  return scheduler(ChoreType.RUN_QRL, hostElement, runQrl, args);
 };

packages/qwik/src/core/client/vnode-diff.ts

@@ -766,7 +766,7 @@ export const vnode_diff = (
             if (qrl) {
               const value = container.$scheduler$(
                 ChoreType.RUN_QRL,
-                element,
+                vNode,
                 qrl as QRLInternal<(...args: unknown[]) => unknown>,
                 [event, element]
               ) as unknown;

packages/qwik/src/core/shared/scheduler.ts

@@ -89,7 +89,7 @@ import {
   type ElementVNode,
   type VirtualVNode,
 } from '../client/types';
-import { VNodeJournalOpCode, vnode_isVNode, vnode_locate, vnode_setAttr } from '../client/vnode';
+import { VNodeJournalOpCode, vnode_isVNode, vnode_setAttr } from '../client/vnode';
 import { vnode_diff } from '../client/vnode-diff';
 import { triggerEffects, type ComputedSignal, type WrappedSignal } from '../signal/signal';
 import { isSignal, type Signal } from '../signal/signal.public';
@@ -99,7 +99,7 @@ import { runResource, type ResourceDescriptor } from '../use/use-resource';
 import { Task, TaskFlags, cleanupTask, runTask, type TaskFn } from '../use/use-task';
 import { executeComponent } from './component-execution';
 import type { OnRenderFn } from './component.public';
-import { assertEqual } from './error/assert';
+import { assertEqual, assertFalse } from './error/assert';
 import type { Props } from './jsx/jsx-runtime';
 import type { JSXOutput } from './jsx/types/jsx-node';
 import { type QRLInternal } from './qrl/qrl-class';
@@ -214,7 +214,7 @@ export const createScheduler = (
   ): ValueOrPromise<void>;
   function schedule(
     type: ChoreType.RUN_QRL,
-    host: Element,
+    host: HostElement,
     target: QRLInternal<(...args: unknown[]) => unknown>,
     args: unknown[]
   ): ValueOrPromise<void>;
@@ -240,7 +240,7 @@ export const createScheduler = (
   ///// IMPLEMENTATION /////
   function schedule(
     type: ChoreType,
-    hostOrTask: HostElement | Task | Element | null = null,
+    hostOrTask: HostElement | Task | null = null,
     targetOrQrl: ChoreTarget | string | null = null,
     payload: any = null
   ): ValueOrPromise<any> {
@@ -436,11 +436,7 @@ export const createScheduler = (
                   qrlRuns.splice(qrlRuns.indexOf(handled), 1);
                 })
                 .catch((error) => {
-                  // TODO test this
-                  const host = isDomContainer(container)
-                    ? vnode_locate(container.rootVNode, chore.$host$ as any as Element)
-                    : null!;
-                  container.handleError(error, host);
+                  container.handleError(error, chore.$host$);
                 });
               // Don't wait for the promise to resolve
               // TODO come up with a better solution, we also want concurrent signal handling with tasks but serial tasks
@@ -578,6 +574,8 @@ export const createScheduler = (
           return hostDiff;
         }
       } else {
+        assertFalse(vnode_isVNode(aHost), 'expected aHost to be SSRNode but it is a VNode');
+        assertFalse(vnode_isVNode(bHost), 'expected bHost to be SSRNode but it is a VNode');
         // we are running on the server.
         // On server we can't schedule task for a different host!
         // Server is SSR, and therefore scheduling for anything but the current host

packages/qwik/src/core/use/use-core.ts

@@ -5,7 +5,6 @@ import type { QRLInternal } from '../shared/qrl/qrl-class';
 import type { QRL } from '../shared/qrl/qrl.public';
 import {
   ComputedEvent,
-  QContainerSelector,
   QLocaleAttr,
   RenderEvent,
   ResourceEvent,
@@ -16,9 +15,9 @@ import { seal } from '../shared/utils/qdev';
 import { isArray } from '../shared/utils/types';
 import { setLocale } from './use-locale';
 import type { Container, HostElement } from '../shared/types';
-import { vnode_getNode, vnode_isElementVNode, vnode_isVNode } from '../client/vnode';
-import { _getQContainerElement } from '../client/dom-container';
-import type { ContainerElement } from '../client/types';
+import { vnode_getNode, vnode_isElementVNode, vnode_isVNode, vnode_locate } from '../client/vnode';
+import { _getQContainerElement, getDomContainer } from '../client/dom-container';
+import { type ContainerElement } from '../client/types';
 import {
   WrappedSignal,
   type EffectPropData,
@@ -175,10 +174,12 @@ export const waitAndRun = (ctx: RenderInvokeContext, callback: () => unknown) =>
 };
 
 export const newInvokeContextFromTuple = ([element, event, url]: InvokeTuple) => {
-  const container = element.closest(QContainerSelector);
+  const domContainer = getDomContainer(element);
+  const container = domContainer.element;
+  const vNode = container ? vnode_locate(domContainer.rootVNode, element) : undefined;
   const locale = container?.getAttribute(QLocaleAttr) || undefined;
   locale && setLocale(locale);
-  return newInvokeContext(locale, undefined, element, event, url);
+  return newInvokeContext(locale, vNode, element, event, url);
 };
 
 // TODO how about putting url and locale (and event/custom?) in to a "static" object

packages/qwik/src/core/use/use-task.ts

@@ -156,12 +156,11 @@ export const useTaskQrl = (qrl: QRL<TaskFn>): void => {
   // deleted and we need to be able to release the task subscriptions.
   set(task);
   const container = iCtx.$container$;
-  container.$scheduler$(ChoreType.TASK, task)?.catch(() => {});
-
-  // const result = runTask(task, container, iCtx.$hostElement$);
-  // if (isPromise(result)) {
-  //   throw result;
-  // }
+  const promise = container.$scheduler$(ChoreType.TASK, task);
+  if (isPromise(promise)) {
+    // TODO: should we handle this differently?
+    promise.catch(() => {});
+  }
 };
 
 export const runTask = (

packages/qwik/src/testing/element-fixture.ts

@@ -1,7 +1,6 @@
 import { getDomContainer } from '@qwik.dev/core';
 import { vi } from 'vitest';
 import { assertDefined } from '../core/shared/error/assert';
-import type { QRLInternal } from '../core/shared/qrl/qrl-class';
 import type { QElement, QwikLoaderEventScope } from '../core/shared/types';
 import { fromCamelToKebabCase } from '../core/shared/utils/event-names';
 import { QFuncsPrefix, QInstanceAttr } from '../core/shared/utils/markers';
@@ -142,7 +141,6 @@ export const dispatch = async (
   const preventAttributeName =
     PREVENT_DEFAULT + (isDocumentOrWindow ? event.type.substring(1) : event.type);
   const stopPropagationName = STOP_PROPAGATION + event.type;
-  const collectListeners: { element: Element; qrl: QRLInternal }[] = [];
   while (element) {
     const preventDefault = element.hasAttribute(preventAttributeName);
     const stopPropagation = element.hasAttribute(stopPropagationName);
@@ -159,7 +157,7 @@ export const dispatch = async (
     } else if (element.hasAttribute(attrName)) {
       const container = getDomContainer(element as HTMLElement);
       const qrl = element.getAttribute(attrName)!;
-      const ctx = newInvokeContextFromTuple([element!, event]);
+      const ctx = newInvokeContextFromTuple([element, event]);
       try {
         await Promise.all(
           qrl
@@ -177,10 +175,6 @@ export const dispatch = async (
     }
     element = element.parentElement;
   }
-  for (let i = 0; i < collectListeners.length; i++) {
-    const { element, qrl } = collectListeners[i];
-    await (qrl.getFn([element, event], () => element.isConnected) as Function)(event, element);
-  }
 };
 
 export async function advanceToNextTimerAndFlush() {