feat: scheduler rewrite

packages/docs/src/routes/api/qwik-testing/api.json

@@ -209,7 +209,7 @@
         }
       ],
       "kind": "Function",
-      "content": "Trigger an event in unit tests on an element.\n\nFuture deprecation candidate.\n\n\n```typescript\nexport declare function trigger(root: Element, queryOrElement: string | Element | keyof HTMLElementTagNameMap | null, eventName: string, eventPayload?: any): Promise<void>;\n```\n\n\n<table><thead><tr><th>\n\nParameter\n\n\n</th><th>\n\nType\n\n\n</th><th>\n\nDescription\n\n\n</th></tr></thead>\n<tbody><tr><td>\n\nroot\n\n\n</td><td>\n\nElement\n\n\n</td><td>\n\n\n</td></tr>\n<tr><td>\n\nqueryOrElement\n\n\n</td><td>\n\nstring \\| Element \\| keyof HTMLElementTagNameMap \\| null\n\n\n</td><td>\n\n\n</td></tr>\n<tr><td>\n\neventName\n\n\n</td><td>\n\nstring\n\n\n</td><td>\n\n\n</td></tr>\n<tr><td>\n\neventPayload\n\n\n</td><td>\n\nany\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n</tbody></table>\n\n**Returns:**\n\nPromise&lt;void&gt;",
+      "content": "Trigger an event in unit tests on an element.\n\nFuture deprecation candidate.\n\n\n```typescript\nexport declare function trigger(root: Element, queryOrElement: string | Element | keyof HTMLElementTagNameMap | null, eventName: string, eventPayload?: any, options?: {\n    waitForIdle?: boolean;\n}): Promise<void>;\n```\n\n\n<table><thead><tr><th>\n\nParameter\n\n\n</th><th>\n\nType\n\n\n</th><th>\n\nDescription\n\n\n</th></tr></thead>\n<tbody><tr><td>\n\nroot\n\n\n</td><td>\n\nElement\n\n\n</td><td>\n\n\n</td></tr>\n<tr><td>\n\nqueryOrElement\n\n\n</td><td>\n\nstring \\| Element \\| keyof HTMLElementTagNameMap \\| null\n\n\n</td><td>\n\n\n</td></tr>\n<tr><td>\n\neventName\n\n\n</td><td>\n\nstring\n\n\n</td><td>\n\n\n</td></tr>\n<tr><td>\n\neventPayload\n\n\n</td><td>\n\nany\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n<tr><td>\n\noptions\n\n\n</td><td>\n\n{ waitForIdle?: boolean; }\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n</tbody></table>\n\n**Returns:**\n\nPromise&lt;void&gt;",
       "editUrl": "https://github.com/QwikDev/qwik/tree/main/packages/qwik/src/testing/element-fixture.ts",
       "mdFile": "core.trigger.md"
     },

packages/docs/src/routes/api/qwik-testing/index.mdx

@@ -507,6 +507,9 @@ export declare function trigger(
   queryOrElement: string | Element | keyof HTMLElementTagNameMap | null,
   eventName: string,
   eventPayload?: any,
+  options?: {
+    waitForIdle?: boolean;
+  },
 ): Promise<void>;
 ```
 
@@ -568,6 +571,19 @@ any
 
 _(Optional)_
 
+</td></tr>
+<tr><td>
+
+options
+
+</td><td>
+
+\{ waitForIdle?: boolean; }
+
+</td><td>
+
+_(Optional)_
+
 </td></tr>
 </tbody></table>
 

packages/docs/src/routes/api/qwik/api.json

@@ -672,6 +672,20 @@
       "content": "Use this to force running subscribers, for example when the calculated value mutates but remains the same object.\n\n\n```typescript\nforce(): void;\n```\n**Returns:**\n\nvoid",
       "mdFile": "core.computedsignal.force.md"
     },
+    {
+      "name": "forceStoreEffects",
+      "id": "forcestoreeffects",
+      "hierarchy": [
+        {
+          "name": "forceStoreEffects",
+          "id": "forcestoreeffects"
+        }
+      ],
+      "kind": "Function",
+      "content": "Force a store to recompute and schedule effects.\n\n\n```typescript\nforceStoreEffects: (value: StoreTarget, prop: keyof StoreTarget) => void\n```\n\n\n<table><thead><tr><th>\n\nParameter\n\n\n</th><th>\n\nType\n\n\n</th><th>\n\nDescription\n\n\n</th></tr></thead>\n<tbody><tr><td>\n\nvalue\n\n\n</td><td>\n\nStoreTarget\n\n\n</td><td>\n\n\n</td></tr>\n<tr><td>\n\nprop\n\n\n</td><td>\n\nkeyof StoreTarget\n\n\n</td><td>\n\n\n</td></tr>\n</tbody></table>\n\n**Returns:**\n\nvoid",
+      "editUrl": "https://github.com/QwikDev/qwik/tree/main/packages/qwik/src/core/reactive-primitives/impl/store.ts",
+      "mdFile": "core.forcestoreeffects.md"
+    },
     {
       "name": "Fragment",
       "id": "fragment",

packages/docs/src/routes/api/qwik/index.mdx

@@ -1318,6 +1318,57 @@ force(): void;
 
 void
 
+## forceStoreEffects
+
+Force a store to recompute and schedule effects.
+
+```typescript
+forceStoreEffects: (value: StoreTarget, prop: keyof StoreTarget) => void
+```
+
+<table><thead><tr><th>
+
+Parameter
+
+</th><th>
+
+Type
+
+</th><th>
+
+Description
+
+</th></tr></thead>
+<tbody><tr><td>
+
+value
+
+</td><td>
+
+StoreTarget
+
+</td><td>
+
+</td></tr>
+<tr><td>
+
+prop
+
+</td><td>
+
+keyof StoreTarget
+
+</td><td>
+
+</td></tr>
+</tbody></table>
+
+**Returns:**
+
+void
+
+[Edit this section](https://github.com/QwikDev/qwik/tree/main/packages/qwik/src/core/reactive-primitives/impl/store.ts)
+
 ## Fragment
 
 ```typescript

packages/qwik-router/src/buildtime/build-layout.unit.ts

@@ -4,7 +4,7 @@ const test = testAppSuite('Build Layout');
 
 test('total layouts', ({ ctx: { layouts } }) => {
   // $ find starters/apps/qwikrouter-test/src/routes -name layout*tsx | wc -l
-  assert.equal(layouts.length, 12, JSON.stringify(layouts, null, 2));
+  assert.equal(layouts.length, 13, JSON.stringify(layouts, null, 2));
 });
 
 test('nested named layout', ({ assertLayout }) => {

packages/qwik-router/src/runtime/src/link-component.tsx

@@ -70,13 +70,14 @@ export const Link = component$<LinkProps>((props) => {
       })
     : undefined;
   const handleClick = clientNavPath
-    ? $(async (event: Event, elm: HTMLAnchorElement) => {
+    ? $((event: Event, elm: HTMLAnchorElement) => {
         if (event.defaultPrevented) {
           // If default was prevented, than it is up to us to make client side navigation.
           if (elm.href) {
             elm.setAttribute('aria-pressed', 'true');
-            await nav(elm.href, { forceReload: reload, replaceState, scroll });
-            elm.removeAttribute('aria-pressed');
+            nav(elm.href, { forceReload: reload, replaceState, scroll }).then(() => {
+              elm.removeAttribute('aria-pressed');
+            });
           }
         }
       })

packages/qwik-router/src/runtime/src/qwik-router-component.tsx

@@ -20,12 +20,14 @@ import {
   _getContextContainer,
   _getContextElement,
   _getQContainerElement,
-  _UNINITIALIZED,
   _waitUntilRendered,
+  _UNINITIALIZED,
   SerializerSymbol,
   type _ElementVNode,
   type AsyncComputedReadonlySignal,
   type SerializationStrategy,
+  forceStoreEffects,
+  _hasStoreEffects,
 } from '@qwik.dev/core/internal';
 import { clientNavigate } from './client-navigate';
 import { CLIENT_DATA_CACHE, DEFAULT_LOADERS_SERIALIZATION_STRATEGY, Q_ROUTE } from './constants';
@@ -156,15 +158,13 @@ export const useQwikRouter = (props?: QwikRouterProps) => {
   }
 
   const url = new URL(urlEnv);
-  const routeLocation = useStore<MutableRouteLocation>(
-    {
-      url,
-      params: env.params,
-      isNavigating: false,
-      prevUrl: undefined,
-    },
-    { deep: false }
-  );
+  const routeLocationTarget: MutableRouteLocation = {
+    url,
+    params: env.params,
+    isNavigating: false,
+    prevUrl: undefined,
+  };
+  const routeLocation = useStore<MutableRouteLocation>(routeLocationTarget, { deep: false });
   const navResolver: { r?: () => void } = {};
   const container = _getContextContainer();
   const getSerializationStrategy = (loaderId: string): SerializationStrategy => {
@@ -470,14 +470,30 @@ export const useQwikRouter = (props?: QwikRouterProps) => {
         if (navigation.dest.search && !!isSamePath(trackUrl, prevUrl)) {
           trackUrl.search = navigation.dest.search;
         }
-
+        let shouldForcePrevUrl = false;
+        let shouldForceUrl = false;
+        let shouldForceParams = false;
         // Update route location
         if (!isSamePath(trackUrl, prevUrl)) {
-          routeLocation.prevUrl = prevUrl;
+          if (_hasStoreEffects(routeLocation, 'prevUrl')) {
+            shouldForcePrevUrl = true;
+          }
+          routeLocationTarget.prevUrl = prevUrl;
+        }
+
+        if (routeLocationTarget.url !== trackUrl) {
+          if (_hasStoreEffects(routeLocation, 'url')) {
+            shouldForceUrl = true;
+          }
+          routeLocationTarget.url = trackUrl;
         }
 
-        routeLocation.url = trackUrl;
-        routeLocation.params = { ...params };
+        if (routeLocationTarget.params !== params) {
+          if (_hasStoreEffects(routeLocation, 'params')) {
+            shouldForceParams = true;
+          }
+          routeLocationTarget.params = params;
+        }
 
         (routeInternal as any).untrackedValue = { type: navType, dest: trackUrl };
 
@@ -746,6 +762,15 @@ export const useQwikRouter = (props?: QwikRouterProps) => {
               callRestoreScrollOnDocument();
             }
 
+            if (shouldForcePrevUrl) {
+              forceStoreEffects(routeLocation, 'prevUrl');
+            }
+            if (shouldForceUrl) {
+              forceStoreEffects(routeLocation, 'url');
+            }
+            if (shouldForceParams) {
+              forceStoreEffects(routeLocation, 'params');
+            }
             routeLocation.isNavigating = false;
             navResolver.r?.();
           });

packages/qwik-router/src/runtime/src/router-outlet-component.tsx

@@ -7,6 +7,7 @@ import {
   useContext,
   useServerData,
 } from '@qwik.dev/core';
+import { _getContextElement, _getDomContainer } from '@qwik.dev/core/internal';
 
 import { ContentInternalContext } from './contexts';
 import type { ClientSPAWindow } from './qwik-router-component';
@@ -20,13 +21,16 @@ export const RouterOutlet = component$(() => {
     throw new Error('PrefetchServiceWorker component must be rendered on the server.');
   }
 
-  const { value } = useContext(ContentInternalContext);
-  if (value && value.length > 0) {
-    const contentsLen = value.length;
+  const internalContext = useContext(ContentInternalContext);
+
+  const contents = internalContext.value;
+
+  if (contents && contents.length > 0) {
+    const contentsLen = contents.length;
     let cmp: JSXNode | null = null;
     for (let i = contentsLen - 1; i >= 0; i--) {
-      if (value[i].default) {
-        cmp = jsx(value[i].default as any, {
+      if (contents[i].default) {
+        cmp = jsx(contents[i].default as any, {
           children: cmp,
         });
       }

packages/qwik/src/core/client/dom-container.ts

@@ -3,8 +3,7 @@
 import { assertTrue } from '../shared/error/assert';
 import { QError, qError } from '../shared/error/error';
 import { ERROR_CONTEXT, isRecoverable } from '../shared/error/error-handling';
-import { getPlatform } from '../shared/platform/platform';
-import { emitEvent, type QRLInternal } from '../shared/qrl/qrl-class';
+import { type QRLInternal } from '../shared/qrl/qrl-class';
 import type { QRL } from '../shared/qrl/qrl.public';
 import { ChoreType } from '../shared/util-chore-type';
 import { _SharedContainer } from '../shared/shared-container';
@@ -38,7 +37,6 @@ import {
   QLocaleAttr,
   QManifestHashAttr,
 } from '../shared/utils/markers';
-import { isPromise } from '../shared/utils/promises';
 import { isSlotProp } from '../shared/utils/prop';
 import { qDev } from '../shared/utils/qdev';
 import {
@@ -60,15 +58,16 @@ import {
 import {
   VNodeJournalOpCode,
   vnode_applyJournal,
-  vnode_getDOMChildNodes,
+  vnode_createErrorDiv,
   vnode_getDomParent,
+  vnode_getNextSibling,
   vnode_getParent,
   vnode_getProp,
   vnode_getProps,
   vnode_insertBefore,
+  vnode_isElementVNode,
   vnode_isVirtualVNode,
   vnode_locate,
-  vnode_newElement,
   vnode_newUnMaterializedElement,
   vnode_setProp,
   type VNodeJournal,
@@ -113,7 +112,6 @@ export class DomContainer extends _SharedContainer implements IClientContainer {
   public rootVNode: ElementVNode;
   public document: QDocument;
   public $journal$: VNodeJournal;
-  public renderDone: Promise<void> | null = null;
   public $rawStateData$: unknown[];
   public $storeProxyMap$: ObjToProxyMap = new WeakMap();
   public $qFuncs$: Array<(...args: unknown[]) => unknown>;
@@ -124,12 +122,13 @@ export class DomContainer extends _SharedContainer implements IClientContainer {
 
   private $stateData$: unknown[];
   private $styleIds$: Set<string> | null = null;
-  private $renderCount$ = 0;
 
   constructor(element: ContainerElement) {
     super(
-      () => this.scheduleRender(),
-      () => vnode_applyJournal(this.$journal$),
+      () => {
+        this.$flushEpoch$++;
+        vnode_applyJournal(this.$journal$);
+      },
       {},
       element.getAttribute(QLocaleAttr)!
     );
@@ -181,24 +180,19 @@ export class DomContainer extends _SharedContainer implements IClientContainer {
     return inflateQRL(this, parseQRL(qrl)) as QRL<T>;
   }
 
-  handleError(err: any, host: HostElement): void {
+  handleError(err: any, host: HostElement | null): void {
     if (qDev && host) {
-      // Clean vdom
       if (typeof document !== 'undefined') {
         const vHost = host as VirtualVNode;
-        const errorDiv = document.createElement('errored-host');
-        if (err && err instanceof Error) {
-          (errorDiv as any).props = { error: err };
-        }
-        errorDiv.setAttribute('q:key', '_error_');
         const journal: VNodeJournal = [];
-
-        const vErrorDiv = vnode_newElement(errorDiv, 'errored-host');
-
-        vnode_getDOMChildNodes(journal, vHost, true).forEach((child) => {
-          vnode_insertBefore(journal, vErrorDiv, child, null);
-        });
-        vnode_insertBefore(journal, vHost, vErrorDiv, null);
+        const vHostParent = vnode_getParent(vHost) as VirtualVNode | ElementVNode | undefined;
+        const vHostNextSibling = vnode_getNextSibling(vHost);
+        const vErrorDiv = vnode_createErrorDiv(document, vHost, err, journal);
+        // If the host is an element node, we need to insert the error div into its parent.
+        const insertHost = vnode_isElementVNode(vHost) ? vHostParent || vHost : vHost;
+        // If the host is different then we need to insert errored-host in the same position as the host.
+        const insertBefore = insertHost === vHost ? null : vHostNextSibling;
+        vnode_insertBefore(journal, insertHost, vErrorDiv, insertBefore);
         vnode_applyJournal(journal);
       }
 
@@ -279,33 +273,6 @@ export class DomContainer extends _SharedContainer implements IClientContainer {
     return vnode_getProp(vNode, name, getObjectById);
   }
 
-  scheduleRender() {
-    this.$renderCount$++;
-    this.renderDone ||= getPlatform().nextTick(() => this.processChores());
-    return this.renderDone.finally(() =>
-      emitEvent('qrender', { instanceHash: this.$instanceHash$, renderCount: this.$renderCount$ })
-    );
-  }
-
-  private processChores() {
-    let renderCount = this.$renderCount$;
-    const result = this.$scheduler$(ChoreType.WAIT_FOR_ALL);
-    if (isPromise(result)) {
-      return result.then(async () => {
-        while (renderCount !== this.$renderCount$) {
-          renderCount = this.$renderCount$;
-          await this.$scheduler$(ChoreType.WAIT_FOR_ALL);
-        }
-        this.renderDone = null;
-      });
-    }
-    if (renderCount !== this.$renderCount$) {
-      this.processChores();
-      return;
-    }
-    this.renderDone = null;
-  }
-
   ensureProjectionResolved(vNode: VirtualVNode): void {
     if ((vNode[VNodeProps.flags] & VNodeFlags.Resolved) === 0) {
       vNode[VNodeProps.flags] |= VNodeFlags.Resolved;