WIP actions support

Author: wmertens

PR-TODO-DO-NOT-MERGE.md

@@ -0,0 +1,11 @@
+# TODO
+
+- fix failing e2e tests
+- dev mode support for q-loader-data and other things that read the manifest for qwik-router-config
+- remove every q-data.json load
+- implement eTag option for loaders
+- implement expires option for loaders
+  - changes the cache-control max-age
+  - use on client side to determine if the data is stale before fetching
+  - during SSR, store page create time and loader expires deltas
+- cache q-loader-data responses in the browser

packages/qwik-router/src/middleware/request-handler/handlers/action-handler.ts

@@ -1,16 +1,25 @@
-import { _serialize, type ValueOrPromise } from '@qwik.dev/core/internal';
+import { _serialize, _UNINITIALIZED, type ValueOrPromise } from '@qwik.dev/core/internal';
 import type {
   ActionInternal,
   JSONObject,
+  LoaderInternal,
   RequestEvent,
   RequestHandler,
 } from '../../../runtime/src/types';
-import { getRequestActions, getRequestMode, type RequestEventInternal } from '../request-event';
+import {
+  getRequestActions,
+  getRequestLoaders,
+  getRequestMode,
+  type RequestEventInternal,
+} from '../request-event';
 import { measure, verifySerializable } from '../resolve-request-handlers';
 import { IsQAction, QActionId } from '../user-response';
 import { runValidators } from './validator-utils';
 
-export function actionHandler(routeActions: ActionInternal[]): RequestHandler {
+export function actionHandler(
+  routeActions: ActionInternal[],
+  routeLoaders: LoaderInternal[]
+): RequestHandler {
   return async (requestEvent: RequestEvent) => {
     const requestEv = requestEvent as RequestEventInternal;
 
@@ -25,7 +34,6 @@ export function actionHandler(routeActions: ActionInternal[]): RequestHandler {
     const actionId = requestEv.sharedMap.get(QActionId);
 
     // Execute just this action
-    const actions = getRequestActions(requestEv);
     const isDev = getRequestMode(requestEv) === 'dev';
     const method = requestEv.method;
 
@@ -35,13 +43,20 @@ export function actionHandler(routeActions: ActionInternal[]): RequestHandler {
       );
     }
     if (method === 'POST') {
+      const actions = getRequestActions(requestEv);
       let action: ActionInternal | undefined;
       for (const routeAction of routeActions) {
         if (routeAction.__id === actionId) {
           action = routeAction;
-          break;
+        } else {
+          // actions can use other actions
+          actions[routeAction.__id] = _UNINITIALIZED;
         }
-        // TODO: do we need to initialize the rest with _UNINITIALIZED?
+      }
+      // actions can use loaders
+      const loaders = getRequestLoaders(requestEv);
+      for (const routeLoader of routeLoaders) {
+        loaders[routeLoader.__id] = _UNINITIALIZED;
       }
       if (!action) {
         const serverActionsMap = globalThis._qwikActionsMap as
@@ -68,7 +83,7 @@ export function actionHandler(routeActions: ActionInternal[]): RequestHandler {
   };
 }
 
-async function executeAction(
+export async function executeAction(
   action: ActionInternal,
   actions: Record<string, ValueOrPromise<unknown> | undefined>,
   requestEv: RequestEventInternal,

packages/qwik-router/src/middleware/request-handler/handlers/action-handler.unit.ts

@@ -20,6 +20,8 @@ vi.mock('../resolve-request-handlers', () => ({
 }));
 
 vi.mock('../request-event', () => ({
+  getRequestLoaders: vi.fn(),
+  getRequestLoaderSerializationStrategyMap: vi.fn(),
   getRequestActions: vi.fn(),
   getRequestMode: vi.fn(),
   RequestEvQwikSerializer: Symbol('RequestEvQwikSerializer'),
@@ -122,7 +124,7 @@ describe('actionHandler', () => {
 
   describe('when not a QAction request', () => {
     it('should return early without processing', async () => {
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockRequestEvent);
 
@@ -140,7 +142,7 @@ describe('actionHandler', () => {
       };
       mockEvent.sharedMap.set(IsQAction, true);
 
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockEvent);
 
@@ -157,7 +159,7 @@ describe('actionHandler', () => {
       };
       mockEvent.sharedMap.set(IsQAction, true);
 
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockEvent);
 
@@ -175,7 +177,7 @@ describe('actionHandler', () => {
       mockEvent.sharedMap.set(IsQAction, true);
       mockEvent.sharedMap.set(QActionId, mockActionId);
 
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockEvent);
 
@@ -194,7 +196,7 @@ describe('actionHandler', () => {
       mockEvent.sharedMap.set(IsQAction, true);
       mockEvent.sharedMap.set(QActionId, mockActionId);
 
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockEvent);
 
@@ -208,7 +210,7 @@ describe('actionHandler', () => {
       mockRequestEvent.sharedMap.set(IsQAction, true);
       mockRequestEvent.sharedMap.set(QActionId, 'non-existent-action');
 
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockRequestEvent);
 
@@ -235,7 +237,7 @@ describe('actionHandler', () => {
         data,
       });
 
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockRequestEvent);
 
@@ -256,7 +258,7 @@ describe('actionHandler', () => {
     });
 
     it('should execute action and return serialized data', async () => {
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockRequestEvent);
 
@@ -284,7 +286,7 @@ describe('actionHandler', () => {
     it('should measure execution time in dev mode', async () => {
       vi.mocked(getRequestMode).mockReturnValue('dev');
 
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockRequestEvent);
 
@@ -295,7 +297,7 @@ describe('actionHandler', () => {
     it('should not measure execution time in production mode', async () => {
       vi.mocked(getRequestMode).mockReturnValue('server');
 
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockRequestEvent);
 
@@ -306,7 +308,7 @@ describe('actionHandler', () => {
     it('should not return serialized data when client does not accept JSON', async () => {
       mockRequestEvent.request.headers.set('accept', 'text/html');
 
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockRequestEvent);
 
@@ -338,7 +340,7 @@ describe('actionHandler', () => {
     });
 
     it('should call fail method and store the result', async () => {
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockRequestEvent);
 
@@ -356,7 +358,7 @@ describe('actionHandler', () => {
         error: 'Validation failed',
       });
 
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockRequestEvent);
 
@@ -376,7 +378,7 @@ describe('actionHandler', () => {
     });
 
     it('should throw an error', async () => {
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await expect(handler(mockRequestEvent)).rejects.toThrow(
         `Expected request data for the action id ${mockActionId} to be an object`
@@ -389,7 +391,7 @@ describe('actionHandler', () => {
         parseBody: vi.fn().mockResolvedValue(null),
       };
 
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await expect(handler(mockEvent)).rejects.toThrow(
         `Expected request data for the action id ${mockActionId} to be an object`
@@ -414,7 +416,7 @@ describe('actionHandler', () => {
     });
 
     it('should propagate the error', async () => {
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await expect(handler(mockRequestEvent)).rejects.toThrow('Action execution failed');
     });
@@ -425,7 +427,7 @@ describe('actionHandler', () => {
       mockRequestEvent.sharedMap.set(IsQAction, true);
       mockRequestEvent.sharedMap.set(QActionId, mockActionId);
 
-      const handler = actionHandler([]);
+      const handler = actionHandler([], []);
 
       await handler(mockRequestEvent);
 
@@ -437,7 +439,7 @@ describe('actionHandler', () => {
       mockRequestEvent.sharedMap.set(IsQAction, true);
       mockRequestEvent.sharedMap.set(QActionId, 'non-existent-action');
 
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockRequestEvent);
 
@@ -458,7 +460,7 @@ describe('actionHandler', () => {
       });
       (mockAction.__qrl.call as Mock).mockResolvedValue({ result: 'success' });
 
-      const handler = actionHandler([mockAction]);
+      const handler = actionHandler([mockAction], []);
 
       await handler(mockEvent);
 

packages/qwik-router/src/middleware/request-handler/handlers/loader-handler.ts

@@ -1,8 +1,9 @@
 import qwikRouterConfig from '@qwik-router-config';
 import { _serialize, _UNINITIALIZED } from '@qwik.dev/core/internal';
-import type { LoaderInternal, RequestHandler } from '../../../runtime/src/types';
+import type { ActionInternal, LoaderInternal, RequestHandler } from '../../../runtime/src/types';
 import { getPathnameForDynamicRoute } from '../../../utils/pathname';
 import {
+  getRequestActions,
   getRequestLoaders,
   getRequestLoaderSerializationStrategyMap,
   getRequestMode,
@@ -71,7 +72,10 @@ export function loaderDataHandler(routeLoaders: LoaderInternal[]): RequestHandle
   };
 }
 
-export function loaderHandler(routeLoaders: LoaderInternal[]): RequestHandler {
+export function loaderHandler(
+  routeLoaders: LoaderInternal[],
+  routeActions: ActionInternal[]
+): RequestHandler {
   return async (requestEvent: RequestEvent) => {
     const requestEv = requestEvent as RequestEventInternal;
 
@@ -94,10 +98,17 @@ export function loaderHandler(routeLoaders: LoaderInternal[]): RequestHandler {
       if (routeLoader.__id === loaderId) {
         loader = routeLoader;
       } else if (!loaders[routeLoader.__id]) {
+        // loaders can use other loaders
         loaders[routeLoader.__id] = _UNINITIALIZED;
       }
     }
 
+    // loaders can use actions
+    const actions = getRequestActions(requestEv);
+    for (const routeAction of routeActions) {
+      actions[routeAction.__id] = _UNINITIALIZED;
+    }
+
     if (!loader) {
       requestEv.json(404, { error: 'Loader not found' });
       return;