cabloy 5.1.134 → 5.1.136

package/e2e/specs/a-commerce/commerce.spec.ts

@@ -29,6 +29,16 @@ function collectPageErrors(page: Page) {
   return errors;
 }
 
+function collectConsoleErrors(page: Page) {
+  const errors: string[] = [];
+  page.on('console', message => {
+    if (message.type() === 'error' || /hydration mismatch/i.test(message.text())) {
+      errors.push(message.text());
+    }
+  });
+  return errors;
+}
+
 function waitForApiResponse(page: Page, method: string, path: string | RegExp) {
   return page.waitForResponse(response => {
     const url = new URL(response.url());
@@ -161,8 +171,14 @@ async function createAddressThroughCustomerPage(
   const page = await context.newPage();
   const pageErrors = collectPageErrors(page);
 
-  await login(page, '/commerce/address', customer.username, customer.password, 'commerce');
-  await expect(page).toHaveURL(/\/commerce\/address(?:\?|$)/);
+  await login(
+    page,
+    '/commerce/commerce/member/address',
+    customer.username,
+    customer.password,
+    'commerce',
+  );
+  await expect(page).toHaveURL(/\/commerce\/commerce\/member\/address(?:\?|$)/);
   await expect(page.getByRole('heading', { name: 'Addresses' })).toBeVisible();
   await expect(page.getByText('No addresses yet.')).toBeVisible();
 
@@ -243,7 +259,13 @@ test(
         'true',
       );
 
-      await login(page, '/commerce/address', customer.username, customer.password, 'commerce');
+      await login(
+        page,
+        '/commerce/commerce/member/address',
+        customer.username,
+        customer.password,
+        'commerce',
+      );
       await expect(page.locator('html')).toHaveAttribute('data-zova-hydrated', 'commerce');
       await expect(page.locator('body')).toHaveAttribute('data-theme', 'dark');
       expect(pageErrors).toEqual([]);
@@ -254,6 +276,165 @@ test(
   },
 );
 
+test(
+  'Commerce theme: session cookie mirrors public local preference without hydration mismatch',
+  { tag: ['@web', '@ssr', '@theme'] },
+  async ({ browser, request }, testInfo) => {
+    const customer = await registerCustomer(request, testInfo);
+    const context = await browser.newContext();
+    const page = await context.newPage();
+    const pageErrors = collectPageErrors(page);
+    const consoleErrors = collectConsoleErrors(page);
+    try {
+      await login(
+        page,
+        '/commerce/commerce/member/address',
+        customer.username,
+        customer.password,
+        'commerce',
+      );
+      await context.addCookies([
+        {
+          name: 'themedark',
+          value: 'false',
+          url: new URL(page.url()).origin,
+        },
+      ]);
+      await page.reload({ waitUntil: 'load' });
+      await expect(page.locator('html')).toHaveAttribute('data-zova-hydrated', 'commerce');
+      await expect(page.locator('body')).toHaveAttribute('data-theme', 'light');
+      await expect.poll(() => page.evaluate(() => localStorage.getItem('themedark'))).toBe('false');
+      expect(pageErrors).toEqual([]);
+      expect(consoleErrors).toEqual([]);
+
+      const publicContext = await browser.newContext();
+      await publicContext.addInitScript(() => localStorage.setItem('themedark', 'false'));
+      const publicPage = await publicContext.newPage();
+      const publicPageErrors = collectPageErrors(publicPage);
+      const publicConsoleErrors = collectConsoleErrors(publicPage);
+      try {
+        await publicPage.goto('/commerce', { waitUntil: 'load' });
+        await expect(publicPage.locator('html')).toHaveAttribute('data-zova-hydrated', 'commerce');
+        await expect(publicPage.locator('body')).toHaveAttribute('data-theme', 'light');
+        await expect
+          .poll(() => publicPage.evaluate(() => localStorage.getItem('themedark')))
+          .toBe('false');
+        expect(
+          (await publicContext.cookies()).find(cookie => cookie.name === 'themedark')?.value,
+        ).toBe('false');
+        expect(publicPageErrors).toEqual([]);
+        expect(publicConsoleErrors).toEqual([]);
+      } finally {
+        await publicContext.close();
+      }
+    } finally {
+      await context.close();
+    }
+  },
+);
+
+test(
+  'Commerce theme: public auto preference mirrors resolved media value without hydration mismatch',
+  { tag: ['@web', '@ssr', '@theme'] },
+  async ({ browser }) => {
+    const context = await browser.newContext();
+    await context.addInitScript(() => localStorage.setItem('themedark', JSON.stringify('auto')));
+    const page = await context.newPage();
+    await page.emulateMedia({ colorScheme: 'dark' });
+    const pageErrors = collectPageErrors(page);
+    const consoleErrors = collectConsoleErrors(page);
+    try {
+      await page.goto('/commerce', { waitUntil: 'load' });
+      await expect(page.locator('html')).toHaveAttribute('data-zova-hydrated', 'commerce');
+      await expect(page.locator('body')).toHaveAttribute('data-theme', 'dark');
+      await expect
+        .poll(() => page.evaluate(() => localStorage.getItem('themedark')))
+        .toBe('"auto"');
+      expect((await context.cookies()).find(cookie => cookie.name === 'themedark')?.value).toBe(
+        'true',
+      );
+      expect(pageErrors).toEqual([]);
+      expect(consoleErrors).toEqual([]);
+    } finally {
+      await context.close();
+    }
+  },
+);
+
+test(
+  'Commerce public SSR: theme cookie does not change cacheable HTML',
+  { tag: ['@web', '@ssr', '@theme'] },
+  async ({ request }) => {
+    const responses = await Promise.all([
+      request.get('/commerce'),
+      request.get('/commerce', { headers: { Cookie: 'themedark=true' } }),
+      request.get('/commerce', { headers: { Cookie: 'themedark=false' } }),
+    ]);
+    const html = await Promise.all(responses.map(response => response.text()));
+    for (const [index, response] of responses.entries()) {
+      expect(response.status(), `public response ${index}`).toBe(200);
+      expect(response.headers()['cache-control'], `public response ${index}`).toBe(
+        'public, max-age=600',
+      );
+      expect(html[index].toLowerCase()).not.toContain('data-zova-hydrated');
+      expect(html[index]).toContain('data-ssr-theme-dark-false="light"');
+      expect(html[index]).toContain('data-ssr-theme-dark-true="dark"');
+      expect(html[index]).not.toContain('ssr_cookie_themedark');
+      expect(html[index]).toContain("window.matchMedia('(prefers-color-scheme: dark)')");
+      expect(html[index]).not.toMatch(/<body[^>]*data-theme="(?:dark|light)"/);
+    }
+  },
+);
+
+test(
+  'Commerce session SSR: theme cookie selects raw server theme',
+  { tag: ['@web', '@ssr', '@theme'] },
+  async ({ browser, request }, testInfo) => {
+    const customer = await registerCustomer(request, testInfo);
+    const context = await browser.newContext();
+    const page = await context.newPage();
+    try {
+      await login(
+        page,
+        '/commerce/commerce/member/address',
+        customer.username,
+        customer.password,
+        'commerce',
+      );
+      const origin = new URL(page.url()).origin;
+      const authCookies = (await context.cookies()).filter(cookie => cookie.name !== 'themedark');
+      const getSessionHtml = async (value: string) => {
+        const sessionContext = await browser.newContext();
+        try {
+          await sessionContext.addCookies([
+            ...authCookies.map(({ domain, path, ...cookie }) => ({ ...cookie, url: origin })),
+            { name: 'themedark', value, url: origin },
+          ]);
+          const response = await sessionContext.request.get('/commerce/commerce/member/address');
+          return { response, html: await response.text() };
+        } finally {
+          await sessionContext.close();
+        }
+      };
+      for (const [value, theme] of [
+        ['true', 'dark'],
+        ['false', 'light'],
+      ] as const) {
+        const { response, html } = await getSessionHtml(value);
+        expect(response.status()).toBe(200);
+        expect(response.headers()['cache-control']).toBe('private, no-store');
+        expect(html).toContain(`data-theme="${theme}"`);
+        expect(html).not.toContain('data-ssr-theme-dark-false');
+        expect(html).not.toContain('data-ssr-theme-dark-true');
+        expect(html).not.toContain("window.matchMedia('(prefers-color-scheme: dark)')");
+        expect(html).toContain('Addresses');
+      }
+    } finally {
+      await context.close();
+    }
+  },
+);
+
 test(
   'Commerce catalogue: public sellable inventory renders after hydration',
   { tag: ['@web', '@flow'] },
@@ -307,7 +488,7 @@ test(
     await expect(page.getByText('库存 24 件')).toBeVisible();
     await expect(page.getByRole('link', { name: '购物车' })).toHaveAttribute(
       'href',
-      '/commerce/zh-cn/cart',
+      '/commerce/commerce/trade/cart',
     );
     expect(pageErrors).toEqual([]);
   },
@@ -331,7 +512,7 @@ test(
     await expect(page).toHaveURL(productPath);
     await expect(page.getByRole('heading', { name: 'Wireless Headphones' })).toBeVisible();
 
-    const cartLink = page.locator('a[href="/commerce/cart"]');
+    const cartLink = page.locator('a[href="/commerce/commerce/trade/cart"]');
     await expect(cartLink).toHaveCount(1);
     await expect(cartLink.locator('.badge')).toHaveCount(0);
     expect(pageErrors).toEqual([]);
@@ -342,8 +523,8 @@ test(
   'Commerce Address: session SSR protects an anonymous document request',
   { tag: ['@web', '@cart'] },
   async ({ page, request }) => {
-    const path = '/commerce/address';
-    const routePath = '/address';
+    const path = '/commerce/commerce/member/address';
+    const routePath = '/commerce/member/address';
     const response = await request.get(path, { maxRedirects: 0 });
     expect(response.status()).toBe(302);
     expect(response.headers()['cache-control']).toBe('private, no-store');
@@ -374,7 +555,7 @@ test(
       testInfo,
     );
     try {
-      const addressResponse = await context.request.get('/commerce/address');
+      const addressResponse = await context.request.get('/commerce/commerce/member/address');
       expect(addressResponse.ok()).toBeTruthy();
       expect(addressResponse.headers()['cache-control']).toBe('private, no-store');
       const addressHtml = await addressResponse.text();
@@ -387,7 +568,9 @@ test(
       const coldPage = await context.newPage();
       try {
         const coldPageErrors = collectPageErrors(coldPage);
-        const coldResponse = await coldPage.goto('/commerce/address', { waitUntil: 'load' });
+        const coldResponse = await coldPage.goto('/commerce/commerce/member/address', {
+          waitUntil: 'load',
+        });
         expect(coldResponse?.ok()).toBeTruthy();
         await expect(coldPage.locator('html')).toHaveAttribute('data-zova-hydrated', 'commerce');
         await expect(coldPage.getByRole('heading', { name: 'Addresses' })).toBeVisible();
@@ -454,7 +637,7 @@ test(
       await addResponse;
 
       await page.getByRole('link', { name: /^Cart/ }).click();
-      await expect(page).toHaveURL(/\/commerce\/cart(?:\/|$)/);
+      await expect(page).toHaveURL(/\/commerce\/commerce\/trade\/cart(?:\/|$)/);
       await expect(page.getByRole('heading', { name: 'Cart' })).toBeVisible();
       const cartItem = page.locator('article').filter({ has: page.getByRole('spinbutton') });
       await expect(cartItem).toContainText('COF-SET-01');
@@ -462,7 +645,7 @@ test(
       await expect(cartItem.getByRole('spinbutton')).toHaveValue('1');
 
       await page.getByRole('link', { name: 'Checkout', exact: true }).click();
-      await expect(page).toHaveURL(/\/commerce\/checkout(?:\/|$)/);
+      await expect(page).toHaveURL(/\/commerce\/commerce\/trade\/checkout(?:\/|$)/);
       await expect(page.getByRole('heading', { name: 'Checkout' })).toBeVisible();
       const addressChoice = page.getByRole('radio', { name: new RegExp(fixture.recipientName) });
       await expect(addressChoice).toBeVisible();
@@ -485,7 +668,9 @@ test(
       expect(checkout.currency).toBe('USD');
       expect(checkout.payableTotalCents).toBe(4599);
       await expect(page).toHaveURL(
-        new RegExp(`/commerce/payment/${checkout.paymentSessionId}/${checkout.orderId}(?:/|$)`),
+        new RegExp(
+          `/commerce/commerce/trade/payment/${checkout.paymentSessionId}/${checkout.orderId}(?:/|$)`,
+        ),
       );
       await expect(page.getByRole('heading', { name: 'Payment', exact: true })).toBeVisible();
 
@@ -505,10 +690,13 @@ test(
       );
       await page.getByRole('button', { name: 'Payment succeeded', exact: true }).click();
       expect((await completeResponse).ok()).toBeTruthy();
-      await expect(page).toHaveURL(new RegExp(`/commerce/order/${checkout.orderId}(?:/|$)`), {
-        timeout: 40_000,
-      });
-      const orderPath = `/commerce/order/${checkout.orderId}`;
+      await expect(page).toHaveURL(
+        new RegExp(`/commerce/commerce/trade/order/${checkout.orderId}(?:/|$)`),
+        {
+          timeout: 40_000,
+        },
+      );
+      const orderPath = `/commerce/commerce/trade/order/${checkout.orderId}`;
       const orderResponse = await context.request.get(orderPath);
       expect(orderResponse.ok()).toBeTruthy();
       expect(orderResponse.headers()['cache-control']).toBe('private, no-store');
@@ -604,9 +792,11 @@ test(
       await expect(page.getByText(shipmentCarrier)).toBeVisible();
       await expect(page.getByText(shipmentTrackingNumber)).toBeVisible();
 
-      const ordersDocumentResponse = await page.goto('/commerce/orders', { waitUntil: 'load' });
+      const ordersDocumentResponse = await page.goto('/commerce/commerce/trade/orders', {
+        waitUntil: 'load',
+      });
       expect(ordersDocumentResponse?.ok()).toBeTruthy();
-      await expect(page).toHaveURL(/\/commerce\/orders(?:\/|$)/);
+      await expect(page).toHaveURL(/\/commerce\/commerce\/trade\/orders(?:\/|$)/);
       await expect(page.locator('html')).toHaveAttribute('data-zova-hydrated', 'commerce');
       await expect(page.getByRole('heading', { name: 'My orders' })).toBeVisible();
       const orderCard = page
@@ -620,7 +810,9 @@ test(
         new RegExp(`/api/commerce/trade/order/viewMine/${checkout.orderId}$`),
       );
       await orderCard.getByRole('button', { name: 'View', exact: true }).click();
-      await expect(page).toHaveURL(new RegExp(`/commerce/order/${checkout.orderId}(?:/|$)`));
+      await expect(page).toHaveURL(
+        new RegExp(`/commerce/commerce/trade/order/${checkout.orderId}(?:/|$)`),
+      );
       await historyDetailResponse;
       await expect(page.getByRole('heading', { name: `Order #${checkout.orderId}` })).toBeVisible();
       await expect(page.getByText('1 × $45.99 = $45.99')).toBeVisible();
@@ -684,11 +876,14 @@ test(
       );
       await page.getByRole('button', { name: 'Payment succeeded', exact: true }).click();
       expect((await completeResponse).ok()).toBeTruthy();
-      await expect(page).toHaveURL(new RegExp(`/commerce/order/${checkout.orderId}(?:/|$)`), {
-        timeout: 40_000,
-      });
+      await expect(page).toHaveURL(
+        new RegExp(`/commerce/commerce/trade/order/${checkout.orderId}(?:/|$)`),
+        {
+          timeout: 40_000,
+        },
+      );
 
-      const callbackPath = `/commerce/payment/${checkout.paymentSessionId}/${checkout.orderId}?providerResult=return`;
+      const callbackPath = `/commerce/commerce/trade/payment/${checkout.paymentSessionId}/${checkout.orderId}?providerResult=return`;
       await page.evaluate(() => {
         localStorage.clear();
         sessionStorage.clear();
@@ -721,7 +916,9 @@ test(
       expect(documentResponse?.ok()).toBeTruthy();
       expect((await reconcileResponse).ok()).toBeTruthy();
       await expect(page.locator('html')).toHaveAttribute('data-zova-hydrated', 'commerce');
-      await expect(page).toHaveURL(new RegExp(`/commerce/order/${checkout.orderId}(?:/|$)`));
+      await expect(page).toHaveURL(
+        new RegExp(`/commerce/commerce/trade/order/${checkout.orderId}(?:/|$)`),
+      );
       expect(reconcileCount).toBe(1);
       expect(paymentViewCount).toBeLessThanOrEqual(10);
       expect(orderViewCount).toBeLessThanOrEqual(5);
@@ -773,7 +970,7 @@ test(
       expectTableIdentity(checkout.paymentSessionId);
       expect(checkout.state).toBe('awaiting_payment');
 
-      const callbackPath = `/commerce/payment/${checkout.paymentSessionId}/${checkout.orderId}?providerResult=cancel`;
+      const callbackPath = `/commerce/commerce/trade/payment/${checkout.paymentSessionId}/${checkout.orderId}?providerResult=cancel`;
       const paymentSessionPath = new RegExp(
         `/api/pay/payment-session/${checkout.paymentSessionId}$`,
       );
@@ -850,8 +1047,9 @@ test(
       expect(reconcileCount).toBe(1);
 
       await page.getByRole('button', { name: 'Open order', exact: true }).click();
-      await expect(page).toHaveURL(new RegExp(`/commerce/order/${checkout.orderId}(?:/|$)`));
-      await expect(page.getByText('awaiting_payment · $45.99')).toBeVisible();
+      await expect(page).toHaveURL(
+        new RegExp(`/commerce/commerce/trade/order/${checkout.orderId}(?:/|$)`),
+      );
       expect(pageErrors).toEqual([]);
     } finally {
       await context.close().catch(() => {});
@@ -881,9 +1079,9 @@ test(
       await page.getByRole('button', { name: 'Add to cart', exact: true }).click();
       expect((await addResponse).ok()).toBeTruthy();
       await page.getByRole('link', { name: /^Cart/ }).click();
-      await expect(page).toHaveURL(/\/commerce\/cart(?:\/|$)/);
+      await expect(page).toHaveURL(/\/commerce\/commerce\/trade\/cart(?:\/|$)/);
       await page.getByRole('link', { name: 'Checkout', exact: true }).click();
-      await expect(page).toHaveURL(/\/commerce\/checkout(?:\/|$)/);
+      await expect(page).toHaveURL(/\/commerce\/commerce\/trade\/checkout(?:\/|$)/);
       const addressChoice = page.getByRole('radio', { name: new RegExp(fixture.recipientName) });
       await expect(addressChoice).toBeVisible();
       await addressChoice.check();
@@ -911,9 +1109,12 @@ test(
       );
       await page.getByRole('button', { name: 'Cancel payment', exact: true }).click();
       expect((await cancelResponse).ok()).toBeTruthy();
-      await expect(page).toHaveURL(new RegExp(`/commerce/order/${checkout.orderId}(?:/|$)`), {
-        timeout: 40_000,
-      });
+      await expect(page).toHaveURL(
+        new RegExp(`/commerce/commerce/trade/order/${checkout.orderId}(?:/|$)`),
+        {
+          timeout: 40_000,
+        },
+      );
       await expect(page.getByText('cancelled · $45.99')).toBeVisible();
       await expect(page.getByRole('alert')).toHaveCount(0);
       expect(pageErrors).toEqual([]);
@@ -948,9 +1149,9 @@ test(
       await page.getByRole('button', { name: 'Add to cart', exact: true }).click();
       await addResponse;
       await page.getByRole('link', { name: /^Cart/ }).click();
-      await expect(page).toHaveURL(/\/commerce\/cart(?:\/|$)/);
+      await expect(page).toHaveURL(/\/commerce\/commerce\/trade\/cart(?:\/|$)/);
       await page.getByRole('link', { name: 'Checkout', exact: true }).click();
-      await expect(page).toHaveURL(/\/commerce\/checkout(?:\/|$)/);
+      await expect(page).toHaveURL(/\/commerce\/commerce\/trade\/checkout(?:\/|$)/);
       const addressChoice = page.getByRole('radio', { name: new RegExp(fixture.recipientName) });
       await addressChoice.check();
       await page.getByRole('radio', { name: 'No coupon', exact: true }).check();
@@ -1056,13 +1257,9 @@ test(
         await adminContext.close().catch(() => {});
       }
 
-      const refundedDetailResponse = waitForApiResponse(
-        page,
-        'GET',
-        new RegExp(`/api/commerce/trade/order/viewMine/${checkout.orderId}$`),
-      );
+      // The session SSR reload serializes the refreshed order detail, so no browser API request is
+      // required before the page renders the refunded state.
       await page.reload({ waitUntil: 'load' });
-      await refundedDetailResponse;
       await expect(page.getByText('refunded · $45.99')).toBeVisible();
       await expect(page.getByText('1 × $45.99 = $45.99')).toBeVisible();
       await expect(page.getByRole('heading', { name: 'Shipment' })).toHaveCount(0);
@@ -1424,6 +1621,264 @@ test(
   },
 );
 
+test(
+  'Commerce Product Content: SSR renders stored safe HTML and hydrates without errors',
+  { tag: ['@web', '@flow', '@product'] },
+  async ({ browser }, testInfo) => {
+    test.setTimeout(60_000);
+    const suffix = `${testInfo.workerIndex}-${testInfo.parallelIndex ?? testInfo.retry}-${Date.now()}`;
+    const categoryName = `E2E Product Content Web Category ${suffix}`;
+    const productTitle = `E2E Product Content Web ${suffix}`;
+    const skuCode = `E2E-PC-WEB-${suffix}`;
+    const markdown = `# Product details ${suffix}\n\nA **durable** product.\n\n- [ ] Open task\n- [x] Completed task`;
+    const unsafeHtml = '<a href="javascript:alert(\'unsafe\')">unsafe</a>';
+    const adminContext = await browser.newContext();
+    const adminPage = await adminContext.newPage();
+    const webContext = await browser.newContext();
+    const webPage = await webContext.newPage();
+    const webPageErrors = collectPageErrors(webPage);
+    const webConsoleErrors = collectConsoleErrors(webPage);
+    const categoryActionPath = '/api/commerce/catalog/category';
+    const productActionPath = '/api/commerce/catalog/product';
+    const skuActionPath = '/api/commerce/catalog/sku';
+    const stockAdjustPath = '/api/commerce/trade/stockBalance/adjustStock';
+    let categoryId: number | string | undefined;
+    let productId: number | string | undefined;
+    let skuId: number | string | undefined;
+    let headers: { Authorization: string } | undefined;
+    try {
+      await login(adminPage, '/commerce-admin/', 'admin', '123456', 'commerceAdmin');
+      const accessToken = (await adminContext.cookies()).find(
+        cookie => cookie.name === 'token',
+      )?.value;
+      expect(accessToken).toBeTruthy();
+      headers = { Authorization: `Bearer ${accessToken}` };
+
+      const categoryResponse = await adminPage.request.post(categoryActionPath, {
+        data: { name: categoryName, published: true },
+        headers,
+      });
+      expect(categoryResponse.ok()).toBeTruthy();
+      categoryId = (await categoryResponse.json()).data;
+      expectTableIdentity(categoryId);
+
+      const productResponse = await adminPage.request.post(productActionPath, {
+        data: {
+          categoryId,
+          title: productTitle,
+          published: true,
+          productContentForm: {
+            descriptionMarkdown: `${markdown}\n\n${unsafeHtml}`,
+          },
+        },
+        headers,
+      });
+      expect(productResponse.ok()).toBeTruthy();
+      productId = (await productResponse.json()).data;
+      expectTableIdentity(productId);
+
+      const skuResponse = await adminPage.request.post(skuActionPath, {
+        data: { code: skuCode, productId, priceCents: 1999, lifecycle: 'active' },
+        headers,
+      });
+      expect(skuResponse.ok()).toBeTruthy();
+      skuId = (await skuResponse.json()).data;
+      expectTableIdentity(skuId);
+
+      const stockResponse = await adminPage.request.post(stockAdjustPath, {
+        data: {
+          skuId,
+          delta: 1,
+          reason: 'Product content SSR E2E fixture',
+          correlationId: `product-content-web-${suffix}`,
+        },
+        headers,
+      });
+      expect(stockResponse.ok()).toBeTruthy();
+
+      const productPath = `/commerce/product/${productId}`;
+      const ssrResponse = await webPage.request.get(productPath);
+      expect(ssrResponse.ok()).toBeTruthy();
+      const ssrHtml = await ssrResponse.text();
+      expect(ssrHtml.toLowerCase()).not.toContain('data-zova-hydrated');
+      expect(ssrHtml).toContain(`<h1>Product details ${suffix}</h1>`);
+      expect(ssrHtml).toContain('<strong>durable</strong>');
+      expect(ssrHtml).toContain('<ul data-type="taskList">');
+      expect(ssrHtml).toContain('<input type="checkbox" disabled="disabled" />');
+      expect(ssrHtml).toContain('<input type="checkbox" checked="checked" disabled="disabled" />');
+      expect(ssrHtml).not.toMatch(/<a[^>]+javascript:/i);
+
+      const documentResponse = await webPage.goto(productPath, { waitUntil: 'load' });
+      expect(documentResponse?.ok()).toBeTruthy();
+      await expect(webPage.locator('html')).toHaveAttribute('data-zova-hydrated', 'commerce');
+      await expect(webPage.getByRole('heading', { name: productTitle })).toBeVisible();
+      await expect(webPage.locator('.product-description h1')).toHaveText(
+        `Product details ${suffix}`,
+      );
+      await expect(webPage.locator('.product-description strong')).toHaveText('durable');
+      const description = webPage.locator('.product-description');
+      await expect(description).not.toHaveClass(/\bprose\b/);
+      await expect(description.locator('ul[data-type="taskList"]')).toHaveCount(1);
+      await expect(description.locator('input[type="checkbox"]')).toHaveCount(2);
+      await expect(description.locator('input[type="checkbox"]').nth(0)).not.toBeChecked();
+      await expect(description.locator('input[type="checkbox"]').nth(0)).toBeDisabled();
+      await expect(description.locator('input[type="checkbox"]').nth(1)).toBeChecked();
+      await expect(description.locator('input[type="checkbox"]').nth(1)).toBeDisabled();
+      expect(webPageErrors).toEqual([]);
+      expect(webConsoleErrors).toEqual([]);
+    } finally {
+      if (skuId && headers) {
+        const response = await adminPage.request.delete(`${skuActionPath}/${skuId}`, { headers });
+        expect(response.ok()).toBeTruthy();
+      }
+      if (productId && headers) {
+        const response = await adminPage.request.delete(`${productActionPath}/${productId}`, {
+          headers,
+        });
+        expect(response.ok()).toBeTruthy();
+      }
+      if (categoryId && headers) {
+        const response = await adminPage.request.delete(`${categoryActionPath}/${categoryId}`, {
+          headers,
+        });
+        expect(response.ok()).toBeTruthy();
+      }
+      await webContext.close().catch(() => {});
+      await adminContext.close().catch(() => {});
+    }
+  },
+);
+
+test(
+  'ATP-SPC-02: Product Content opens the rich-text editor and saves Markdown',
+  { tag: ['@admin', '@flow', '@product'] },
+  async ({ browser }, testInfo) => {
+    test.setTimeout(60_000);
+    const suffix = `${testInfo.workerIndex}-${testInfo.parallelIndex ?? testInfo.retry}-${Date.now()}`;
+    const categoryName = `E2E Product Content Category ${suffix}`;
+    const productTitle = `E2E Product Content ${suffix}`;
+    const markdown = `# Product content ${suffix}
+
+- First benefit
+- Second benefit
+
+- [ ] Open task
+- [x] Completed task
+
+> Product quote
+
+\`\`\`ts
+const product = '${suffix}';
+\`\`\`
+
+==highlighted text==
+
+| Feature | Value |
+| --- | --- |
+| Material | Durable |`;
+    const adminContext = await browser.newContext();
+    const adminPage = await adminContext.newPage();
+    const adminPageErrors = collectPageErrors(adminPage);
+    const adminConsoleErrors = collectConsoleErrors(adminPage);
+    const productListPath = '/commerce-admin/rest/resource/commerce-catalog%3Aproduct';
+    const categoryActionPath = '/api/commerce/catalog/category';
+    const productActionPath = '/api/commerce/catalog/product';
+    let categoryId: number | string | undefined;
+    let productId: number | string | undefined;
+    let headers: { Authorization: string } | undefined;
+    try {
+      await adminPage.setViewportSize({ width: 1440, height: 900 });
+      await login(adminPage, '/commerce-admin/', 'admin', '123456', 'commerceAdmin');
+      const accessToken = (await adminContext.cookies()).find(
+        cookie => cookie.name === 'token',
+      )?.value;
+      expect(accessToken).toBeTruthy();
+      headers = { Authorization: `Bearer ${accessToken}` };
+
+      const categoryResponse = await adminPage.request.post(categoryActionPath, {
+        data: { name: categoryName, published: false },
+        headers,
+      });
+      expect(categoryResponse.ok()).toBeTruthy();
+      categoryId = (await categoryResponse.json()).data;
+      expectTableIdentity(categoryId);
+
+      const productResponse = await adminPage.request.post(productActionPath, {
+        data: {
+          categoryId,
+          title: productTitle,
+          published: false,
+          productContentForm: { descriptionMarkdown: markdown },
+        },
+        headers,
+      });
+      expect(productResponse.ok()).toBeTruthy();
+      productId = (await productResponse.json()).data;
+      expectTableIdentity(productId);
+
+      await adminPage.goto(`${productListPath}/${productId}/edit`, { waitUntil: 'load' });
+      await expect(adminPage.locator('html')).toHaveAttribute(
+        'data-zova-hydrated',
+        'commerceAdmin',
+      );
+      expect(adminPageErrors).toEqual([]);
+      expect(adminConsoleErrors).toEqual([]);
+      const editor = adminPage.locator('[contenteditable="true"]');
+      await expect(editor).toBeVisible();
+      const editorSurface = editor.locator('..');
+      await expect(editorSurface).not.toHaveClass(/\bprose\b/);
+      const editorSurfaceClass = await editorSurface.getAttribute('class');
+      expect(editorSurfaceClass?.trim()).toBeTruthy();
+      await editorSurface.click({ position: { x: 20, y: 280 } });
+      await expect(editor).toBeFocused();
+      await expect(editor.locator('h1')).toHaveText(`Product content ${suffix}`);
+      await expect(editor.locator('ul:not([data-type="taskList"])')).toHaveCount(1);
+      await expect(editor.locator('blockquote')).toHaveText('Product quote');
+      await expect(editor.locator('pre code')).toHaveText(`const product = '${suffix}';`);
+      await expect(editor.locator('mark')).toHaveText('highlighted text');
+      await expect(editor.locator('table th')).toHaveCount(2);
+      await expect(editor.locator('table td')).toHaveCount(2);
+      await expect(editor.locator('h1')).toHaveCSS('font-weight', '700');
+      await expect(editor.locator('ul:not([data-type="taskList"])')).toHaveCSS(
+        'list-style-type',
+        'disc',
+      );
+      await expect(editor.locator('ul[data-type="taskList"]')).toHaveCount(1);
+      await expect(editor.locator('input[type="checkbox"]')).toHaveCount(2);
+      await expect(editor.locator('input[type="checkbox"]').nth(0)).not.toBeChecked();
+      await expect(editor.locator('input[type="checkbox"]').nth(1)).toBeChecked();
+      await expect(editor.locator('blockquote')).toHaveCSS('border-left-width', '4px');
+      await expect(editor.locator('pre')).toHaveCSS('overflow-x', 'auto');
+      await expect(editor.locator('table th').first()).toHaveCSS('font-weight', '600');
+      await adminPage.getByRole('button', { name: 'Submit', exact: true }).click();
+
+      const productResponseAfterUpdate = await adminPage.request.get(
+        `${productActionPath}/${productId}`,
+        { headers },
+      );
+      expect(productResponseAfterUpdate.ok()).toBeTruthy();
+      expect((await productResponseAfterUpdate.json()).productContentForm.descriptionMarkdown).toBe(
+        markdown,
+      );
+      expect(adminPageErrors).toEqual([]);
+    } finally {
+      if (productId && headers) {
+        const response = await adminPage.request.delete(`${productActionPath}/${productId}`, {
+          headers,
+        });
+        expect(response.ok()).toBeTruthy();
+      }
+      if (categoryId && headers) {
+        const response = await adminPage.request.delete(`${categoryActionPath}/${categoryId}`, {
+          headers,
+        });
+        expect(response.ok()).toBeTruthy();
+      }
+      await adminContext.close().catch(() => {});
+    }
+  },
+);
+
 test(
   'ATP-SPC-02: SKU renders semantic Admin currency and lifecycle controls',
   { tag: ['@admin', '@flow', '@sku'] },
@@ -1592,7 +2047,7 @@ test(
   'Commerce Cart: anonymous browser is redirected to login',
   { tag: ['@web', '@cart'] },
   async ({ page, request }) => {
-    const path = '/commerce/cart';
+    const path = '/commerce/commerce/trade/cart';
     const response = await request.get(path);
     expect(response.ok()).toBeTruthy();
     expect((await response.text()).toLowerCase()).not.toContain('data-zova-hydrated');
@@ -1610,15 +2065,16 @@ test(
   { tag: ['@web', '@flow'] },
   async ({ page, request }) => {
     const routes = [
-      ['/commerce/checkout', '/checkout'],
-      ['/commerce/payment/1/1', '/payment/1/1'],
-      ['/commerce/orders', '/orders'],
-      ['/commerce/order/1', '/order/1'],
+      ['/commerce/commerce/trade/checkout', '/commerce/trade/checkout'],
+      ['/commerce/commerce/trade/payment/1/1', '/commerce/trade/payment/1/1'],
+      ['/commerce/commerce/trade/orders', '/commerce/trade/orders'],
+      ['/commerce/commerce/trade/order/1', '/commerce/trade/order/1'],
     ] as const;
     for (const [path, routePath] of routes) {
       const response = await request.get(path, { maxRedirects: 0 });
-      expect(response.status(), path).toBe(200);
-      expect(response.headers().location, path).toBeUndefined();
+      expect(response.status(), path).toBe(302);
+      expect(response.headers()['cache-control'], path).toBe('private, no-store');
+      expect(response.headers().location, path).toMatch(/^\/commerce\/login\?(?:.*&)?returnTo=/);
       const html = await response.text();
       expect(html.toLowerCase(), path).not.toContain('data-zova-hydrated');
       expect(html, path).not.toContain('Payment Customer');