Move Breadcrumbs component to use /server directory, implement structured data test in e2e test case for Breadcrumbs

Author: webstackdev

src/components/Breadcrumbs/index.astro

@@ -20,14 +20,14 @@ const breadcrumbs = generateBreadcrumbs(path, pageTitle)
 
 {
   breadcrumbs.length > 1 && (
-    <div class="mx-auto max-w-[75rem] w-[90%] mt-4">
+    <div class="mx-auto max-w-300 w-[90%] mt-4">
       <nav aria-label="Breadcrumb" class="breadcrumbs pl-8">
-        <ol class="flex items-center space-x-2 text-sm text-[color:var(--color-text-offset)]">
+        <ol class="flex items-center space-x-2 text-sm text-offset">
           {breadcrumbs.map((item, index) => (
             <li class="flex items-center">
               {index > 0 && (
                 <svg
-                  class="w-4 h-4 mx-2 text-[color:var(--color-text-offset)] opacity-60"
+                  class="w-4 h-4 mx-2 text-offset opacity-60"
                   fill="none"
                   stroke="currentColor"
                   viewBox="0 0 24 24"
@@ -43,13 +43,13 @@ const breadcrumbs = generateBreadcrumbs(path, pageTitle)
               )}
 
               {item.isCurrentPage ? (
-                <span class="text-[color:var(--color-text)] font-medium" aria-current="page">
+                <span class="text-text font-medium" aria-current="page">
                   {item.label}
                 </span>
               ) : (
                 <a
                   href={item.href}
-                  class="text-[color:var(--color-primary)] hover:text-[color:var(--color-primary-offset)] hover:underline transition-colors duration-200"
+                  class="text-primary hover:text-primary-offset hover:underline transition-colors duration-200"
                 >
                   {item.label}
                 </a>

…nts/Breadcrumbs/__tests__/server.spec.ts …eadcrumbs/server/__tests__/index.spec.tssrc/components/Breadcrumbs/__tests__/server.spec.ts renamed to src/components/Breadcrumbs/server/__tests__/index.spec.ts src/components/Breadcrumbs/__tests__/server.spec.ts renamed to src/components/Breadcrumbs/server/__tests__/index.spec.ts

@@ -107,7 +107,7 @@ test.describe('Breadcrumbs Component', () => {
     await page.expectElementVisible('nav[aria-label="Breadcrumb"]')
   })
 
-  test.skip('@wip breadcrumbs have structured data', async ({ page: playwrightPage }) => {
+  test('@ready breadcrumbs have structured data', async ({ page: playwrightPage }) => {
     // Expected: Should include JSON-LD BreadcrumbList schema
     const page = await BasePage.init(playwrightPage)
     await setupTestPage(playwrightPage, '/articles')