Skip to content

fix(NavigationMenu): remove w-full on root slot #2039

fix(NavigationMenu): remove w-full on root slot

fix(NavigationMenu): remove w-full on root slot #2039

Triggered via push January 6, 2025 17:46
Status Failure
Total duration 5m 4s
Artifacts

ci-v3.yml

on: push
Matrix: ci
Fit to window
Zoom out
Zoom in

Annotations

10 errors and 1 warning
test/components/NavigationMenu.spec.ts > NavigationMenu > renders with items correctly: test/components/NavigationMenu.spec.ts#L105
Error: Snapshot `NavigationMenu > renders with items correctly 1` mismatched - Expected + Received @@ -1,6 +1,6 @@ - "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 w-full items-center justify-between"> + "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 items-center justify-between"> <div style="position: relative;"> <ul class="isolate min-w-0 flex items-center" data-orientation="horizontal"> <li data-menu-item="" class="min-w-0 py-2"><button type="button" class="group relative w-full flex items-center gap-1.5 font-medium text-sm before:absolute before:z-[-1] before:rounded-[calc(var(--ui-radius)*1.5)] focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-2 focus-visible:before:ring-[var(--ui-primary)] px-2.5 py-1.5 before:inset-x-px before:inset-y-0 text-[var(--ui-text-muted)] hover:text-[var(--ui-text-highlighted)] hover:before:bg-[var(--ui-bg-elevated)]/50 data-[state=open]:text-[var(--ui-text-highlighted)] transition-colors before:transition-colors data-[state=open]:before:bg-[var(--ui-bg-elevated)]/50" data-state="closed" data-navigation-menu-trigger="" aria-expanded="false" active="false" data-reka-collection-item="" id="reka-navigation-menu-v-0-trigger-0" aria-controls="reka-navigation-menu-v-0-content-0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-5 text-[var(--ui-text-dimmed)] group-hover:text-[var(--ui-text)] group-data-[state=open]:text-[var(--ui-text)] transition-colors" width="1em" height="1em" viewBox="0 0 16 16"></svg><span class="truncate">Documentation<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="font-medium inline-flex items-center text-[10px]/3 px-1.5 py-1 gap-1 rounded-[calc(var(--ui-radius))] ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] shrink-0"><!--v-if--><span class="truncate">10</span> <!--v-if--></span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="size-5 transform shrink-0 group-data-[state=open]:rotate-180 transition-transform duration-200" width="1em" height="1em" viewBox="0 0 16 16"></svg></span> </button> ❯ test/components/NavigationMenu.spec.ts:105:18
test/components/NavigationMenu.spec.ts > NavigationMenu > renders with labelKey correctly: test/components/NavigationMenu.spec.ts#L105
Error: Snapshot `NavigationMenu > renders with labelKey correctly 1` mismatched - Expected + Received @@ -1,6 +1,6 @@ - "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 w-full items-center justify-between"> + "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 items-center justify-between"> <div style="position: relative;"> <ul class="isolate min-w-0 flex items-center" data-orientation="horizontal"> <li data-menu-item="" class="min-w-0 py-2"><button type="button" class="group relative w-full flex items-center gap-1.5 font-medium text-sm before:absolute before:z-[-1] before:rounded-[calc(var(--ui-radius)*1.5)] focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-2 focus-visible:before:ring-[var(--ui-primary)] px-2.5 py-1.5 before:inset-x-px before:inset-y-0 text-[var(--ui-text-muted)] hover:text-[var(--ui-text-highlighted)] hover:before:bg-[var(--ui-bg-elevated)]/50 data-[state=open]:text-[var(--ui-text-highlighted)] transition-colors before:transition-colors data-[state=open]:before:bg-[var(--ui-bg-elevated)]/50" data-state="closed" data-navigation-menu-trigger="" aria-expanded="false" active="false" data-reka-collection-item="" id="reka-navigation-menu-v-0-trigger-0" aria-controls="reka-navigation-menu-v-0-content-0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-5 text-[var(--ui-text-dimmed)] group-hover:text-[var(--ui-text)] group-data-[state=open]:text-[var(--ui-text)] transition-colors" width="1em" height="1em" viewBox="0 0 16 16"></svg><span class="truncate">i-lucide-book-open<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="font-medium inline-flex items-center text-[10px]/3 px-1.5 py-1 gap-1 rounded-[calc(var(--ui-radius))] ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] shrink-0"><!--v-if--><span class="truncate">10</span> <!--v-if--></span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="size-5 transform shrink-0 group-data-[state=open]:rotate-180 transition-transform duration-200" width="1em" height="1em" viewBox="0 0 16 16"></svg></span> </button> ❯ test/components/NavigationMenu.spec.ts:105:18
test/components/NavigationMenu.spec.ts > NavigationMenu > renders with arrow correctly: test/components/NavigationMenu.spec.ts#L105
Error: Snapshot `NavigationMenu > renders with arrow correctly 1` mismatched - Expected + Received @@ -1,6 +1,6 @@ - "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 w-full items-center justify-between"> + "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 items-center justify-between"> <div style="position: relative;"> <ul class="isolate min-w-0 flex items-center" data-orientation="horizontal"> <li data-menu-item="" class="min-w-0 py-2"><button type="button" class="group relative w-full flex items-center gap-1.5 font-medium text-sm before:absolute before:z-[-1] before:rounded-[calc(var(--ui-radius)*1.5)] focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-2 focus-visible:before:ring-[var(--ui-primary)] px-2.5 py-1.5 before:inset-x-px before:inset-y-0 text-[var(--ui-text-muted)] hover:text-[var(--ui-text-highlighted)] hover:before:bg-[var(--ui-bg-elevated)]/50 data-[state=open]:text-[var(--ui-text-highlighted)] transition-colors before:transition-colors data-[state=open]:before:bg-[var(--ui-bg-elevated)]/50" data-state="closed" data-navigation-menu-trigger="" aria-expanded="false" active="false" data-reka-collection-item="" id="reka-navigation-menu-v-0-trigger-0" aria-controls="reka-navigation-menu-v-0-content-0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-5 text-[var(--ui-text-dimmed)] group-hover:text-[var(--ui-text)] group-data-[state=open]:text-[var(--ui-text)] transition-colors" width="1em" height="1em" viewBox="0 0 16 16"></svg><span class="truncate">Documentation<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="font-medium inline-flex items-center text-[10px]/3 px-1.5 py-1 gap-1 rounded-[calc(var(--ui-radius))] ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] shrink-0"><!--v-if--><span class="truncate">10</span> <!--v-if--></span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="size-5 transform shrink-0 group-data-[state=open]:rotate-180 transition-transform duration-200" width="1em" height="1em" viewBox="0 0 16 16"></svg></span> </button> ❯ test/components/NavigationMenu.spec.ts:105:18
test/components/NavigationMenu.spec.ts > NavigationMenu > renders with primary variant pill correctly: test/components/NavigationMenu.spec.ts#L105
Error: Snapshot `NavigationMenu > renders with primary variant pill correctly 1` mismatched - Expected + Received @@ -1,6 +1,6 @@ - "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 w-full items-center justify-between"> + "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 items-center justify-between"> <div style="position: relative;"> <ul class="isolate min-w-0 flex items-center" data-orientation="horizontal"> <li data-menu-item="" class="min-w-0 py-2"><button type="button" class="group relative w-full flex items-center gap-1.5 font-medium text-sm before:absolute before:z-[-1] before:rounded-[calc(var(--ui-radius)*1.5)] focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-2 focus-visible:before:ring-[var(--ui-primary)] px-2.5 py-1.5 before:inset-x-px before:inset-y-0 text-[var(--ui-text-muted)] hover:text-[var(--ui-text-highlighted)] hover:before:bg-[var(--ui-bg-elevated)]/50 data-[state=open]:text-[var(--ui-text-highlighted)] transition-colors before:transition-colors data-[state=open]:before:bg-[var(--ui-bg-elevated)]/50" data-state="closed" data-navigation-menu-trigger="" aria-expanded="false" active="false" data-reka-collection-item="" id="reka-navigation-menu-v-0-trigger-0" aria-controls="reka-navigation-menu-v-0-content-0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-5 text-[var(--ui-text-dimmed)] group-hover:text-[var(--ui-text)] group-data-[state=open]:text-[var(--ui-text)] transition-colors" width="1em" height="1em" viewBox="0 0 16 16"></svg><span class="truncate">Documentation<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="font-medium inline-flex items-center text-[10px]/3 px-1.5 py-1 gap-1 rounded-[calc(var(--ui-radius))] ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] shrink-0"><!--v-if--><span class="truncate">10</span> <!--v-if--></span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="size-5 transform shrink-0 group-data-[state=open]:rotate-180 transition-transform duration-200" width="1em" height="1em" viewBox="0 0 16 16"></svg></span> </button> ❯ test/components/NavigationMenu.spec.ts:105:18
test/components/NavigationMenu.spec.ts > NavigationMenu > renders with primary variant link correctly: test/components/NavigationMenu.spec.ts#L105
Error: Snapshot `NavigationMenu > renders with primary variant link correctly 1` mismatched - Expected + Received @@ -1,6 +1,6 @@ - "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 w-full items-center justify-between"> + "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 items-center justify-between"> <div style="position: relative;"> <ul class="isolate min-w-0 flex items-center" data-orientation="horizontal"> <li data-menu-item="" class="min-w-0 py-2"><button type="button" class="group relative w-full flex items-center gap-1.5 font-medium text-sm before:absolute before:z-[-1] before:rounded-[calc(var(--ui-radius)*1.5)] focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-2 focus-visible:before:ring-[var(--ui-primary)] px-2.5 py-1.5 before:inset-x-px before:inset-y-0 text-[var(--ui-text-muted)] hover:text-[var(--ui-text-highlighted)] data-[state=open]:text-[var(--ui-text-highlighted)] transition-colors" data-state="closed" data-navigation-menu-trigger="" aria-expanded="false" active="false" data-reka-collection-item="" id="reka-navigation-menu-v-0-trigger-0" aria-controls="reka-navigation-menu-v-0-content-0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-5 text-[var(--ui-text-dimmed)] group-hover:text-[var(--ui-text)] group-data-[state=open]:text-[var(--ui-text)] transition-colors" width="1em" height="1em" viewBox="0 0 16 16"></svg><span class="truncate">Documentation<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="font-medium inline-flex items-center text-[10px]/3 px-1.5 py-1 gap-1 rounded-[calc(var(--ui-radius))] ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] shrink-0"><!--v-if--><span class="truncate">10</span> <!--v-if--></span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="size-5 transform shrink-0 group-data-[state=open]:rotate-180 transition-transform duration-200" width="1em" height="1em" viewBox="0 0 16 16"></svg></span> </button> ❯ test/components/NavigationMenu.spec.ts:105:18
test/components/NavigationMenu.spec.ts > NavigationMenu > renders with neutral variant pill correctly: test/components/NavigationMenu.spec.ts#L105
Error: Snapshot `NavigationMenu > renders with neutral variant pill correctly 1` mismatched - Expected + Received @@ -1,6 +1,6 @@ - "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 w-full items-center justify-between"> + "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 items-center justify-between"> <div style="position: relative;"> <ul class="isolate min-w-0 flex items-center" data-orientation="horizontal"> <li data-menu-item="" class="min-w-0 py-2"><button type="button" class="group relative w-full flex items-center gap-1.5 font-medium text-sm before:absolute before:z-[-1] before:rounded-[calc(var(--ui-radius)*1.5)] focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-2 focus-visible:before:ring-[var(--ui-border-inverted)] px-2.5 py-1.5 before:inset-x-px before:inset-y-0 text-[var(--ui-text-muted)] hover:text-[var(--ui-text-highlighted)] hover:before:bg-[var(--ui-bg-elevated)]/50 data-[state=open]:text-[var(--ui-text-highlighted)] transition-colors before:transition-colors data-[state=open]:before:bg-[var(--ui-bg-elevated)]/50" data-state="closed" data-navigation-menu-trigger="" aria-expanded="false" active="false" data-reka-collection-item="" id="reka-navigation-menu-v-0-trigger-0" aria-controls="reka-navigation-menu-v-0-content-0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-5 text-[var(--ui-text-dimmed)] group-hover:text-[var(--ui-text)] group-data-[state=open]:text-[var(--ui-text)] transition-colors" width="1em" height="1em" viewBox="0 0 16 16"></svg><span class="truncate">Documentation<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="font-medium inline-flex items-center text-[10px]/3 px-1.5 py-1 gap-1 rounded-[calc(var(--ui-radius))] ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] shrink-0"><!--v-if--><span class="truncate">10</span> <!--v-if--></span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="size-5 transform shrink-0 group-data-[state=open]:rotate-180 transition-transform duration-200" width="1em" height="1em" viewBox="0 0 16 16"></svg></span> </button> ❯ test/components/NavigationMenu.spec.ts:105:18
test/components/NavigationMenu.spec.ts > NavigationMenu > renders with neutral variant link correctly: test/components/NavigationMenu.spec.ts#L105
Error: Snapshot `NavigationMenu > renders with neutral variant link correctly 1` mismatched - Expected + Received @@ -1,6 +1,6 @@ - "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 w-full items-center justify-between"> + "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 items-center justify-between"> <div style="position: relative;"> <ul class="isolate min-w-0 flex items-center" data-orientation="horizontal"> <li data-menu-item="" class="min-w-0 py-2"><button type="button" class="group relative w-full flex items-center gap-1.5 font-medium text-sm before:absolute before:z-[-1] before:rounded-[calc(var(--ui-radius)*1.5)] focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-2 focus-visible:before:ring-[var(--ui-border-inverted)] px-2.5 py-1.5 before:inset-x-px before:inset-y-0 text-[var(--ui-text-muted)] hover:text-[var(--ui-text-highlighted)] data-[state=open]:text-[var(--ui-text-highlighted)] transition-colors" data-state="closed" data-navigation-menu-trigger="" aria-expanded="false" active="false" data-reka-collection-item="" id="reka-navigation-menu-v-0-trigger-0" aria-controls="reka-navigation-menu-v-0-content-0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-5 text-[var(--ui-text-dimmed)] group-hover:text-[var(--ui-text)] group-data-[state=open]:text-[var(--ui-text)] transition-colors" width="1em" height="1em" viewBox="0 0 16 16"></svg><span class="truncate">Documentation<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="font-medium inline-flex items-center text-[10px]/3 px-1.5 py-1 gap-1 rounded-[calc(var(--ui-radius))] ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] shrink-0"><!--v-if--><span class="truncate">10</span> <!--v-if--></span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="size-5 transform shrink-0 group-data-[state=open]:rotate-180 transition-transform duration-200" width="1em" height="1em" viewBox="0 0 16 16"></svg></span> </button> ❯ test/components/NavigationMenu.spec.ts:105:18
test/components/NavigationMenu.spec.ts > NavigationMenu > renders with primary variant pill highlight correctly: test/components/NavigationMenu.spec.ts#L105
Error: Snapshot `NavigationMenu > renders with primary variant pill highlight correctly 1` mismatched - Expected + Received @@ -1,6 +1,6 @@ - "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 w-full items-center justify-between"> + "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 items-center justify-between"> <div style="position: relative;"> <ul class="isolate min-w-0 flex items-center" data-orientation="horizontal"> <li data-menu-item="" class="min-w-0 py-2 -mb-px"><button type="button" class="group relative w-full flex items-center gap-1.5 font-medium text-sm before:absolute before:z-[-1] before:rounded-[calc(var(--ui-radius)*1.5)] focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-2 focus-visible:before:ring-[var(--ui-primary)] px-2.5 py-1.5 before:inset-x-px before:inset-y-0 text-[var(--ui-text-muted)] after:absolute after:-bottom-2 after:inset-x-2.5 after:block after:h-px after:rounded-full after:transition-colors hover:text-[var(--ui-text-highlighted)] hover:before:bg-[var(--ui-bg-elevated)]/50 data-[state=open]:text-[var(--ui-text-highlighted)] transition-colors before:transition-colors data-[state=open]:before:bg-[var(--ui-bg-elevated)]/50" data-state="closed" data-navigation-menu-trigger="" aria-expanded="false" active="false" data-reka-collection-item="" id="reka-navigation-menu-v-0-trigger-0" aria-controls="reka-navigation-menu-v-0-content-0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-5 text-[var(--ui-text-dimmed)] group-hover:text-[var(--ui-text)] group-data-[state=open]:text-[var(--ui-text)] transition-colors" width="1em" height="1em" viewBox="0 0 16 16"></svg><span class="truncate">Documentation<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="font-medium inline-flex items-center text-[10px]/3 px-1.5 py-1 gap-1 rounded-[calc(var(--ui-radius))] ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] shrink-0"><!--v-if--><span class="truncate">10</span> <!--v-if--></span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="size-5 transform shrink-0 group-data-[state=open]:rotate-180 transition-transform duration-200" width="1em" height="1em" viewBox="0 0 16 16"></svg></span> </button> ❯ test/components/NavigationMenu.spec.ts:105:18
test/components/NavigationMenu.spec.ts > NavigationMenu > renders with primary variant link highlight correctly: test/components/NavigationMenu.spec.ts#L105
Error: Snapshot `NavigationMenu > renders with primary variant link highlight correctly 1` mismatched - Expected + Received @@ -1,6 +1,6 @@ - "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 w-full items-center justify-between"> + "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 items-center justify-between"> <div style="position: relative;"> <ul class="isolate min-w-0 flex items-center" data-orientation="horizontal"> <li data-menu-item="" class="min-w-0 py-2 -mb-px"><button type="button" class="group relative w-full flex items-center gap-1.5 font-medium text-sm before:absolute before:z-[-1] before:rounded-[calc(var(--ui-radius)*1.5)] focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-2 focus-visible:before:ring-[var(--ui-primary)] px-2.5 py-1.5 before:inset-x-px before:inset-y-0 text-[var(--ui-text-muted)] after:absolute after:-bottom-2 after:inset-x-2.5 after:block after:h-px after:rounded-full after:transition-colors hover:text-[var(--ui-text-highlighted)] data-[state=open]:text-[var(--ui-text-highlighted)] transition-colors" data-state="closed" data-navigation-menu-trigger="" aria-expanded="false" active="false" data-reka-collection-item="" id="reka-navigation-menu-v-0-trigger-0" aria-controls="reka-navigation-menu-v-0-content-0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-5 text-[var(--ui-text-dimmed)] group-hover:text-[var(--ui-text)] group-data-[state=open]:text-[var(--ui-text)] transition-colors" width="1em" height="1em" viewBox="0 0 16 16"></svg><span class="truncate">Documentation<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="font-medium inline-flex items-center text-[10px]/3 px-1.5 py-1 gap-1 rounded-[calc(var(--ui-radius))] ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] shrink-0"><!--v-if--><span class="truncate">10</span> <!--v-if--></span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="size-5 transform shrink-0 group-data-[state=open]:rotate-180 transition-transform duration-200" width="1em" height="1em" viewBox="0 0 16 16"></svg></span> </button> ❯ test/components/NavigationMenu.spec.ts:105:18
test/components/NavigationMenu.spec.ts > NavigationMenu > renders with neutral variant pill highlight correctly: test/components/NavigationMenu.spec.ts#L105
Error: Snapshot `NavigationMenu > renders with neutral variant pill highlight correctly 1` mismatched - Expected + Received @@ -1,6 +1,6 @@ - "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 w-full items-center justify-between"> + "<nav aria-label="Main" data-orientation="horizontal" dir="ltr" data-reka-navigation-menu="" class="relative flex gap-1.5 [&>div]:min-w-0 items-center justify-between"> <div style="position: relative;"> <ul class="isolate min-w-0 flex items-center" data-orientation="horizontal"> <li data-menu-item="" class="min-w-0 py-2 -mb-px"><button type="button" class="group relative w-full flex items-center gap-1.5 font-medium text-sm before:absolute before:z-[-1] before:rounded-[calc(var(--ui-radius)*1.5)] focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-2 focus-visible:before:ring-[var(--ui-border-inverted)] px-2.5 py-1.5 before:inset-x-px before:inset-y-0 text-[var(--ui-text-muted)] after:absolute after:-bottom-2 after:inset-x-2.5 after:block after:h-px after:rounded-full after:transition-colors hover:text-[var(--ui-text-highlighted)] hover:before:bg-[var(--ui-bg-elevated)]/50 data-[state=open]:text-[var(--ui-text-highlighted)] transition-colors before:transition-colors data-[state=open]:before:bg-[var(--ui-bg-elevated)]/50" data-state="closed" data-navigation-menu-trigger="" aria-expanded="false" active="false" data-reka-collection-item="" id="reka-navigation-menu-v-0-trigger-0" aria-controls="reka-navigation-menu-v-0-content-0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-5 text-[var(--ui-text-dimmed)] group-hover:text-[var(--ui-text)] group-data-[state=open]:text-[var(--ui-text)] transition-colors" width="1em" height="1em" viewBox="0 0 16 16"></svg><span class="truncate">Documentation<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="font-medium inline-flex items-center text-[10px]/3 px-1.5 py-1 gap-1 rounded-[calc(var(--ui-radius))] ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] shrink-0"><!--v-if--><span class="truncate">10</span> <!--v-if--></span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="size-5 transform shrink-0 group-data-[state=open]:rotate-180 transition-transform duration-200" width="1em" height="1em" viewBox="0 0 16 16"></svg></span> </button> ❯ test/components/NavigationMenu.spec.ts:105:18
ci (ubuntu-latest, 20)
ubuntu-latest pipelines will use ubuntu-24.04 soon. For more details, see https://github.com/actions/runner-images/issues/10636