cabloy 5.1.172 → 5.1.174

package/.cabloy-version

@@ -1 +1 @@
-5.1.172
+5.1.174

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Changelog
 
+## 5.1.174
+
+### Improvements
+
+- Refresh dependency lockfiles and core patches to prepare for compensation reruns.
+
+## 5.1.173
+
+### Features
+
+- Consolidate boundary handling and retry behavior.
+
 ## 5.1.172
 
 ### Features

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cabloy",
-  "version": "5.1.172",
+  "version": "5.1.174",
   "gitHead": "2c5c19284bab738e492856189acb6fad74b8a7b7",
   "description": "A Node.js fullstack framework",
   "keywords": [
@@ -76,7 +76,7 @@
   },
   "devDependencies": {
     "@cabloy/dotenv": "^1.2.8",
-    "@cabloy/lint": "^5.1.32",
+    "@cabloy/lint": "^5.1.33",
     "@cabloy/process-helper": "^3.1.3",
     "@playwright/test": "^1.62.1",
     "@types/fs-extra": "^11.0.4",

package/repo-docs/frontend/component-guide.md

@@ -78,6 +78,39 @@ Component wrappers can also participate in asynchronous loading behavior automat
 
 This matters because the wrapper is not just a naming convenience. It is part of how Zova turns modular code into practical runtime behavior.
 
+## Controller load boundaries
+
+A component Controller, optional Style bean, and optional Render bean load in that order. While that asynchronous work is pending, Zova can render a loading boundary; an unhandled initialization failure renders an error boundary.
+
+```ts
+@Controller()
+class ControllerReport extends BeanControllerBase {
+  static $componentOptions: IComponentOptions = {
+    boundary: {
+      loading: { delay: 500 },
+      renderMode: 'inline',
+      retry: true,
+    },
+  };
+}
+```
+
+`retry` is disabled by default. Enable it only when creating a fresh Controller → Style → Render graph and running the Controller initialization again is safe. In particular, do not opt in for initialization that can repeat a non-idempotent external effect without its own idempotency or recovery contract.
+
+Error rendering keeps Controller ownership first. A Controller override may receive the retry action as its trailing argument; otherwise the application boundary renderer receives it:
+
+```ts
+protected renderError(error, renderMode, retry?) {
+  return null;
+}
+
+config.boundary.renderError(ctx, error, renderMode, retry?);
+```
+
+The callback is optional because retry may be disabled or unavailable. Existing error renderers that accept only `error` or `error, renderMode` remain valid. When a Controller provides its own error renderer, Zova does not wrap that output with an application retry control; the Controller decides whether to present the action.
+
+For SSR, a server-selected error fallback remains the client’s first hydration result. Retry becomes interactive only after the component has mounted, so the server HTML and hydration-time client output stay equivalent. A retry then creates a fresh client-side load graph; it does not rerun the failed Controller instance in place.
+
 ## Reference the component instance
 
 Instead of relying on template refs in the usual Vue style, Zova prefers direct access to the component controller instance.

package/repo-docs/frontend/model-resource-cookbook.md

@@ -86,10 +86,6 @@ export class ModelStudent extends BeanModelBase {
         const res = await this.scope.api.trainingStudent.summary({ params: { id } });
         return res ?? null;
       },
-      meta: {
-        // The Summary dialog renders query errors itself.
-        disableErrorEffect: true,
-      },
     });
   }
 
@@ -187,10 +183,6 @@ summary(id: TableIdentity) {
       const res = await this.scope.api.trainingStudent.summary({ params: { id } });
       return res ?? null;
     },
-    meta: {
-      // The Summary dialog renders query errors itself.
-      disableErrorEffect: true,
-    },
   });
 }
 ```

package/repo-docs/frontend/model-resource-usage-guide.md

@@ -128,10 +128,6 @@ export class ModelStudent extends BeanModelBase {
         const res = await this.scope.api.trainingStudent.summary({ params: { id } });
         return res ?? null;
       },
-      meta: {
-        // The Summary dialog renders query errors itself.
-        disableErrorEffect: true,
-      },
     });
   }
 

package/repo-e2e/specs/cabloy-basic.spec.ts

@@ -563,6 +563,164 @@ test(
   },
 );
 
+test(
+  'ATP-BASIC-TABLE-03: Training Student row delete handles cancellation, local failures, and retry',
+  { tag: ['@admin', '@flow'] },
+  async ({ page }) => {
+    test.setTimeout(120_000);
+    page.setDefaultTimeout(10_000);
+    await page.setViewportSize({ width: 1440, height: 900 });
+    const pageErrors = collectPageErrors(page);
+    await loginAsAdmin(page);
+
+    const studentName = `Row Delete E2E ${Date.now()}`;
+    const accessToken = (await page.context().cookies()).find(
+      cookie => cookie.name === 'token',
+    )?.value;
+    expect(accessToken).toBeTruthy();
+    const headers = { Authorization: `Bearer ${accessToken}` };
+    let studentId: string | number | undefined;
+    try {
+      const createResponse = await page.request.post('/api/training/student', {
+        data: { name: studentName, mobile: '13812345678', level: 1 },
+        headers,
+      });
+      expect(createResponse.ok()).toBeTruthy();
+      studentId = (await createResponse.json()).data;
+      expect(['string', 'number']).toContain(typeof studentId);
+
+      const initialSelect = waitForStudentSelect(page);
+      await page.getByRole('link', { name: 'Student', exact: true }).click();
+      await expect(page).toHaveURL(studentResourceUrl);
+      await initialSelect;
+
+      await page.getByLabel('Student Name').fill(studentName);
+      const filteredResponse = waitForStudentSelect(page);
+      await page.getByRole('button', { name: 'Search', exact: true }).click();
+      await filteredResponse;
+
+      const row = page.locator('tbody tr').filter({
+        has: page.getByRole('link', { name: studentName, exact: true }),
+      });
+      const deleteButton = row.locator('button.btn-outline.btn-error').first();
+      const confirmDialog = page.getByRole('dialog').filter({
+        hasText: 'Are you sure you want to delete this item?',
+      });
+      await expect(row).toHaveCount(1);
+      await expect(deleteButton).toBeVisible();
+
+      let cancelledRequestCount = 0;
+      const cancelledRequestListener = (request: Request) => {
+        const url = new URL(request.url());
+        if (
+          request.method() === 'DELETE' &&
+          url.pathname === `/api/training/student/${studentId}` &&
+          !request.headers()['x-vona-openapi-schema']
+        ) {
+          cancelledRequestCount++;
+        }
+      };
+      page.on('request', cancelledRequestListener);
+      try {
+        await deleteButton.click();
+        await expect(confirmDialog).toBeVisible();
+        await confirmDialog.getByRole('button', { name: 'No', exact: true }).click();
+        await expect(confirmDialog).toHaveCount(0);
+        await expect(row).toHaveCount(1);
+        expect(cancelledRequestCount).toBe(0);
+      } finally {
+        page.off('request', cancelledRequestListener);
+      }
+
+      let failureRequestCount = 0;
+      let releaseFailedDelete: (() => void) | undefined;
+      const failedDeleteHeld = new Promise<void>(resolve => {
+        releaseFailedDelete = resolve;
+      });
+      const deleteRoute = (url: URL) => url.pathname === `/api/training/student/${studentId}`;
+      const failedDeleteHandler = async (route: Route) => {
+        failureRequestCount++;
+        await failedDeleteHeld;
+        await route.fulfill({
+          status: 500,
+          contentType: 'application/json',
+          body: JSON.stringify({ code: 500, message: 'Row deletion temporarily unavailable' }),
+        });
+      };
+      await page.route(deleteRoute, failedDeleteHandler);
+      try {
+        await deleteButton.click();
+        await confirmDialog.getByRole('button', { name: 'Yes', exact: true }).click();
+        await expect.poll(() => failureRequestCount).toBe(1);
+        await expect(deleteButton).toBeDisabled();
+        await expect(deleteButton).toHaveAttribute('aria-busy', 'true');
+        await expect(deleteButton.locator('.loading.loading-spinner')).toHaveCount(1);
+        await deleteButton.click({ force: true });
+        await expect.poll(() => failureRequestCount).toBe(1);
+
+        releaseFailedDelete?.();
+        const errorDialog = page.getByRole('dialog').filter({
+          hasText: 'Row deletion temporarily unavailable',
+        });
+        await expect(errorDialog).toBeVisible();
+        await expect(errorDialog.getByRole('button', { name: 'Close', exact: true })).toBeVisible();
+        await expect(row).toHaveCount(1);
+        await errorDialog.getByRole('button', { name: 'Close', exact: true }).click();
+        await expect(errorDialog).toHaveCount(0);
+        await expect(deleteButton).toBeEnabled();
+        await expect(deleteButton).not.toHaveAttribute('aria-busy', 'true');
+        await expect(deleteButton.locator('.loading.loading-spinner')).toHaveCount(0);
+      } finally {
+        releaseFailedDelete?.();
+        await page.unroute(deleteRoute, failedDeleteHandler);
+      }
+
+      const deleteRequest = page.waitForRequest(request => {
+        const url = new URL(request.url());
+        return (
+          request.method() === 'DELETE' &&
+          url.pathname === `/api/training/student/${studentId}` &&
+          !request.headers()['x-vona-openapi-schema']
+        );
+      });
+      const deleteResponse = page.waitForResponse(response => {
+        const url = new URL(response.url());
+        return (
+          response.request().method() === 'DELETE' &&
+          url.pathname === `/api/training/student/${studentId}` &&
+          !response.request().headers()['x-vona-openapi-schema']
+        );
+      });
+      const refetchResponse = waitForStudentSelect(page, false);
+      await deleteButton.click();
+      await confirmDialog.getByRole('button', { name: 'Yes', exact: true }).click();
+      const [, response, refetch] = await Promise.all([
+        deleteRequest,
+        deleteResponse,
+        refetchResponse,
+      ]);
+      expect(response.ok()).toBeTruthy();
+      expect(refetch.ok()).toBeTruthy();
+      await expect(row).toHaveCount(0);
+      expect(pageErrors).toEqual([]);
+    } finally {
+      if (studentId !== undefined) {
+        const deleteResponse = await page.request.delete(
+          `/api/training/student/deleteForce/${studentId}`,
+          {
+            headers,
+            timeout: 10_000,
+          },
+        );
+        expect(
+          deleteResponse.ok() || deleteResponse.status() === 404,
+          `Failed to clean up Training Student ${studentName} (${studentId}): ${deleteResponse.status()}`,
+        ).toBeTruthy();
+      }
+    }
+  },
+);
+
 test(
   'ATP-BASIC-TABLE-02: Training Student selection mode preserves page state and bulk deletes selected rows',
   { tag: ['@admin', '@flow'] },

package/repo-e2e/specs/controller-boundary.spec.ts

@@ -0,0 +1,261 @@
+import type { Page } from '@playwright/test';
+
+import { expect, test } from '@playwright/test';
+
+const probeErrorMessage = 'Controller boundary probe initialization failed';
+
+function collectPageErrors(page: Page) {
+  const errors: Error[] = [];
+  page.on('pageerror', error => {
+    errors.push(error);
+  });
+  return errors;
+}
+
+function collectConsoleErrors(page: Page) {
+  const errors: string[] = [];
+  page.on('console', message => {
+    if (message.type() === 'error') {
+      errors.push(message.text());
+    }
+  });
+  return errors;
+}
+
+test(
+  'ATP-BASIC-CONTROLLER-BOUNDARY-01: global boundaries render loading, error, and recovery',
+  { tag: ['@web', '@flow'] },
+  async ({ page, request }) => {
+    const serverResponse = await request.get('/demo/basic/controllerBoundary');
+    expect(serverResponse.ok()).toBeTruthy();
+    const serverHtml = await serverResponse.text();
+    expect(serverHtml).not.toContain('Controller boundary probe ready');
+    expect(serverHtml).not.toContain(probeErrorMessage);
+
+    const pageErrors = collectPageErrors(page);
+    const consoleErrors = collectConsoleErrors(page);
+    const response = await page.goto('/demo/basic/controllerBoundary', { waitUntil: 'load' });
+    expect(response?.ok()).toBeTruthy();
+    await expect(page.locator('html')).toHaveAttribute('data-zova-hydrated', 'web');
+    await expect(
+      page.getByRole('heading', { name: 'Controller Boundary Manual Validation', exact: true }),
+    ).toBeVisible();
+    await page.waitForTimeout(1_000);
+
+    const loading = page.getByRole('status');
+    const error = page.locator('.alert.alert-error');
+    const ready = page.getByText('Controller boundary probe ready', { exact: true });
+
+    await expect(loading).toHaveCount(0);
+    await expect(error).toHaveCount(0);
+    await expect(ready).toHaveCount(0);
+
+    await page.getByRole('button', { name: 'Mount fast success probe', exact: true }).click();
+    await page.waitForTimeout(400);
+    await expect(loading).toHaveCount(0);
+    await expect(ready).toBeVisible();
+    await expect(error).toHaveCount(0);
+
+    await page.getByRole('button', { name: 'Mount fast failing probe', exact: true }).click();
+    await page.waitForTimeout(400);
+    await expect(error).toHaveText(probeErrorMessage);
+    await expect(loading).toHaveCount(0);
+    await expect(ready).toHaveCount(0);
+
+    const delayedSuccessLoading = loading.waitFor({ state: 'visible' });
+    await page.getByRole('button', { name: 'Mount delayed success probe', exact: true }).click();
+    await delayedSuccessLoading;
+    await expect(ready).toBeVisible();
+    await expect(loading).toHaveCount(0);
+    await expect(error).toHaveCount(0);
+
+    const failingProbeLoading = loading.waitFor({ state: 'visible' });
+    await page.getByRole('button', { name: 'Mount failing probe', exact: true }).click();
+    await failingProbeLoading;
+    await expect.poll(() => loading.evaluate(element => element.tagName)).toBe('DIV');
+    await expect(error).toHaveText(probeErrorMessage);
+    await expect.poll(() => error.evaluate(element => element.tagName)).toBe('DIV');
+    await expect(ready).toHaveCount(0);
+    const retry = page.getByRole('button', { name: 'Retry', exact: true });
+    await expect(retry).toBeVisible();
+
+    const failedRetryLoading = loading.waitFor({ state: 'visible' });
+    await retry.click();
+    await failedRetryLoading;
+    await expect(error).toHaveText(probeErrorMessage);
+    await expect(retry).toBeVisible();
+
+    await page.getByRole('button', { name: 'Prepare probe retry success', exact: true }).click();
+    const successfulRetryLoading = loading.waitFor({ state: 'visible' });
+    await retry.evaluate(button => {
+      button.click();
+      button.click();
+    });
+    await successfulRetryLoading;
+    await expect(ready).toBeVisible();
+    await expect(loading).toHaveCount(0);
+    await expect(error).toHaveCount(0);
+
+    expect(pageErrors).toEqual([]);
+    expect(consoleErrors.every(error => error.includes(probeErrorMessage))).toBeTruthy();
+  },
+);
+
+test(
+  'ATP-BASIC-CONTROLLER-BOUNDARY-02: inline boundaries preserve phrasing-content markup',
+  { tag: ['@web', '@flow'] },
+  async ({ page }) => {
+    const pageErrors = collectPageErrors(page);
+    const consoleErrors = collectConsoleErrors(page);
+    const response = await page.goto('/demo/basic/controllerBoundary', { waitUntil: 'load' });
+    expect(response?.ok()).toBeTruthy();
+    await expect(page.locator('html')).toHaveAttribute('data-zova-hydrated', 'web');
+    await page.waitForTimeout(1_000);
+
+    const inlineHost = page.locator('p', { hasText: 'Inline boundary:' });
+    const loading = inlineHost.getByRole('status');
+    const error = inlineHost.getByRole('alert');
+    const ready = inlineHost.getByText('Inline Controller boundary probe ready', { exact: true });
+    await page.getByRole('button', { name: 'Mount inline failing probe', exact: true }).click();
+    await expect(error).toHaveText('Inline Controller boundary probe initialization failed');
+    await expect.poll(() => error.evaluate(element => element.tagName)).toBe('SPAN');
+    await expect(ready).toHaveCount(0);
+    await expect(inlineHost.locator('div')).toHaveCount(0);
+    await expect(inlineHost.getByRole('button', { name: 'Retry', exact: true })).toBeVisible();
+
+    await page.getByRole('button', { name: 'Prepare inline retry success', exact: true }).click();
+    await inlineHost.getByRole('button', { name: 'Retry', exact: true }).click();
+    await expect(ready).toBeVisible();
+    await expect(loading).toHaveCount(0);
+    await expect(error).toHaveCount(0);
+
+    expect(pageErrors).toEqual([]);
+    expect(
+      consoleErrors.every(error =>
+        error.includes('Inline Controller boundary probe initialization failed'),
+      ),
+    ).toBeTruthy();
+  },
+);
+
+test(
+  'ATP-BASIC-CONTROLLER-BOUNDARY-03: Controller overrides receive the mode and retain legacy error arity',
+  { tag: ['@web', '@flow'] },
+  async ({ page }) => {
+    const pageErrors = collectPageErrors(page);
+    const consoleErrors = collectConsoleErrors(page);
+    const response = await page.goto('/demo/basic/controllerBoundary', { waitUntil: 'load' });
+    expect(response?.ok()).toBeTruthy();
+    await expect(page.locator('html')).toHaveAttribute('data-zova-hydrated', 'web');
+    await page.waitForTimeout(1_000);
+
+    const overrideHost = page.locator('p', { hasText: 'Override boundary:' });
+    const loading = overrideHost.getByRole('status');
+    const error = overrideHost.getByRole('alert');
+    const ready = overrideHost.getByText('Override Controller boundary probe ready', {
+      exact: true,
+    });
+    const initialOverrideLoading = loading.waitFor({ state: 'visible' });
+    await page.getByRole('button', { name: 'Mount override failing probe', exact: true }).click();
+    await initialOverrideLoading;
+    await expect(loading).toHaveText('Override loading mode: inline');
+    await expect(error).toHaveText(
+      'Override legacy error: Override Controller boundary probe initialization failed',
+    );
+    await expect(ready).toHaveCount(0);
+    await expect(overrideHost.getByRole('button', { name: 'Retry', exact: true })).toHaveCount(0);
+
+    const recoveredOverrideLoading = loading.waitFor({ state: 'visible' });
+    await page
+      .getByRole('button', { name: 'Recover override with delayed success', exact: true })
+      .click();
+    await recoveredOverrideLoading;
+    await expect(loading).toHaveText('Override loading mode: inline');
+    await expect(ready).toBeVisible();
+    await expect(loading).toHaveCount(0);
+    await expect(error).toHaveCount(0);
+
+    expect(pageErrors).toEqual([]);
+    expect(
+      consoleErrors.every(error =>
+        error.includes('Override Controller boundary probe initialization failed'),
+      ),
+    ).toBeTruthy();
+  },
+);
+
+test(
+  'ATP-BASIC-CONTROLLER-BOUNDARY-04: inline server load failure remains hydration-safe',
+  { tag: ['@web', '@flow'] },
+  async ({ page, request }) => {
+    const errorMessage = 'Inline Controller boundary probe initialization failed';
+    const serverResponse = await request.get(
+      '/demo/basic/controllerBoundary?mode=inlineServerFailure',
+    );
+    expect(serverResponse.ok()).toBeTruthy();
+    const serverHtml = await serverResponse.text();
+    expect(serverHtml).toContain(errorMessage);
+    expect(serverHtml).not.toContain('Inline Controller boundary probe ready');
+    expect(serverHtml).not.toContain('>Retry<');
+
+    const pageErrors = collectPageErrors(page);
+    const consoleErrors = collectConsoleErrors(page);
+    const response = await page.goto('/demo/basic/controllerBoundary?mode=inlineServerFailure', {
+      waitUntil: 'load',
+    });
+    expect(response?.ok()).toBeTruthy();
+    await expect(page.locator('html')).toHaveAttribute('data-zova-hydrated', 'web');
+    await page.waitForTimeout(1_000);
+    const inlineHost = page.locator('p', { hasText: 'Inline boundary:' });
+    const error = inlineHost.getByRole('alert');
+    await expect(error).toHaveText(errorMessage);
+    await expect.poll(() => error.evaluate(element => element.tagName)).toBe('SPAN');
+    await expect(
+      inlineHost.getByText('Inline Controller boundary probe ready', { exact: true }),
+    ).toHaveCount(0);
+    const retry = inlineHost.getByRole('button', { name: 'Retry', exact: true });
+    await expect(retry).toBeVisible();
+
+    await retry.click();
+    await expect(
+      inlineHost.getByText('Inline Controller boundary probe ready', { exact: true }),
+    ).toBeVisible();
+    await expect(error).toHaveCount(0);
+
+    expect(pageErrors).toEqual([]);
+    expect(consoleErrors.every(error => error.includes(errorMessage))).toBeTruthy();
+  },
+);
+
+test(
+  'ATP-BASIC-CONTROLLER-BOUNDARY-05: server load failure remains the initial hydration boundary',
+  { tag: ['@web', '@flow'] },
+  async ({ page, request }) => {
+    const serverResponse = await request.get('/demo/basic/controllerBoundary?mode=serverFailure');
+    expect(serverResponse.ok()).toBeTruthy();
+    const serverHtml = await serverResponse.text();
+    expect(serverHtml).toContain(probeErrorMessage);
+    expect(serverHtml).not.toContain('Controller boundary probe ready');
+    expect(serverHtml).not.toContain('>Retry<');
+
+    const pageErrors = collectPageErrors(page);
+    const consoleErrors = collectConsoleErrors(page);
+    const response = await page.goto('/demo/basic/controllerBoundary?mode=serverFailure', {
+      waitUntil: 'load',
+    });
+    expect(response?.ok()).toBeTruthy();
+    await expect(page.locator('html')).toHaveAttribute('data-zova-hydrated', 'web');
+    await page.waitForTimeout(1_000);
+    await expect(page.locator('.alert.alert-error')).toHaveText(probeErrorMessage);
+    await expect(page.getByText('Controller boundary probe ready', { exact: true })).toHaveCount(0);
+    const retry = page.getByRole('button', { name: 'Retry', exact: true });
+    await expect(retry).toBeVisible();
+
+    await retry.click();
+    await expect(page.getByText('Controller boundary probe ready', { exact: true })).toBeVisible();
+    await expect(page.locator('.alert.alert-error')).toHaveCount(0);
+
+    expect(pageErrors).toEqual([]);
+    expect(consoleErrors.every(error => error.includes(probeErrorMessage))).toBeTruthy();
+  },
+);

package/test-results/.last-run.json

@@ -1,4 +1,4 @@
 {
-  "status": "passed",
+  "status": "failed",
   "failedTests": []
 }

package/vona/packages-utils/lint/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cabloy/lint",
-  "version": "5.1.32",
+  "version": "5.1.35",
   "gitHead": "2c5c19284bab738e492856189acb6fad74b8a7b7",
   "description": "Node Style Guide for Cabloy.",
   "files": [

package/vona/packages-utils/lint/src/oxc/lint.ts

@@ -375,7 +375,7 @@ const _configDefault: OxlintConfig = {
         switches: 'never',
       },
     ],
-    '@stylistic/quote-props': ['error', 'consistent-as-needed'],
+    '@stylistic/quote-props': 'off',
     '@stylistic/quotes': [
       'error',
       'single',

package/vona/packages-utils/lint/src/oxc/lintVue.ts

@@ -373,7 +373,7 @@ const _configDefault: OxlintConfig = {
         switches: 'never',
       },
     ],
-    '@stylistic/quote-props': ['error', 'consistent-as-needed'],
+    '@stylistic/quote-props': 'off',
     '@stylistic/quotes': [
       'error',
       'single',