Skip to content

refactor(nav-menu): improve usability #6609

refactor(nav-menu): improve usability

refactor(nav-menu): improve usability #6609

Triggered via push March 4, 2025 15:36
Status Failure
Total duration 4m 28s
Artifacts

quality.yml

on: push
Matrix: End-to-end Tests
Fit to window
Zoom out
Zoom in

Annotations

9 errors and 12 notices
e2e/navigation-menu.e2e.ts:61:7 › navigation-menu › hover + focus should toggle content: e2e/models/navigation-menu.model.ts#L59
1) e2e/navigation-menu.e2e.ts:61:7 › navigation-menu › hover + focus should toggle content ─────── Error: Timed out 10000ms waiting for expect(locator).toBeHidden() Locator: locator('[data-scope="navigation-menu"][data-part="content"][data-value="products"]') Expected: hidden Received: visible Call log: - expect.toBeHidden with timeout 10000ms - waiting for locator('[data-scope="navigation-menu"][data-part="content"][data-value="products"]') 14 × locator resolved to <div dir="ltr" data-uid=":R6m:" data-type="root" data-state="open" data-part="content" data-value="products" data-scope="navigation-menu" id="nav-menu::R6m::content:products" aria-labelledby="nav-menu::R6m::trigger:products">…</div> - unexpected value "visible" at models/navigation-menu.model.ts:59 57 | 58 | async dontSeeContent(value: string) { > 59 | await expect(this.getContent(value)).toBeHidden() | ^ 60 | } 61 | 62 | async seeContentLinkIsFocused(value: string, text: string) { at NavigationMenuModel.dontSeeContent (/home/runner/work/zag/zag/e2e/models/navigation-menu.model.ts:59:42) at /home/runner/work/zag/zag/e2e/navigation-menu.e2e.ts:65:13
e2e/navigation-menu.e2e.ts:61:7 › navigation-menu › hover + focus should toggle content: e2e/models/navigation-menu.model.ts#L59
1) e2e/navigation-menu.e2e.ts:61:7 › navigation-menu › hover + focus should toggle content ─────── Retry #1 ─────────────────────────────────────────────────────────────────────────────────────── Error: Timed out 10000ms waiting for expect(locator).toBeHidden() Locator: locator('[data-scope="navigation-menu"][data-part="content"][data-value="products"]') Expected: hidden Received: visible Call log: - expect.toBeHidden with timeout 10000ms - waiting for locator('[data-scope="navigation-menu"][data-part="content"][data-value="products"]') 14 × locator resolved to <div dir="ltr" data-uid=":R6m:" data-type="root" data-state="open" data-part="content" data-value="products" data-scope="navigation-menu" id="nav-menu::R6m::content:products" aria-labelledby="nav-menu::R6m::trigger:products">…</div> - unexpected value "visible" at models/navigation-menu.model.ts:59 57 | 58 | async dontSeeContent(value: string) { > 59 | await expect(this.getContent(value)).toBeHidden() | ^ 60 | } 61 | 62 | async seeContentLinkIsFocused(value: string, text: string) { at NavigationMenuModel.dontSeeContent (/home/runner/work/zag/zag/e2e/models/navigation-menu.model.ts:59:42) at /home/runner/work/zag/zag/e2e/navigation-menu.e2e.ts:65:13
e2e/navigation-menu.e2e.ts:61:7 › navigation-menu › hover + focus should toggle content: e2e/models/navigation-menu.model.ts#L59
1) e2e/navigation-menu.e2e.ts:61:7 › navigation-menu › hover + focus should toggle content ─────── Retry #2 ─────────────────────────────────────────────────────────────────────────────────────── Error: Timed out 10000ms waiting for expect(locator).toBeHidden() Locator: locator('[data-scope="navigation-menu"][data-part="content"][data-value="products"]') Expected: hidden Received: visible Call log: - expect.toBeHidden with timeout 10000ms - waiting for locator('[data-scope="navigation-menu"][data-part="content"][data-value="products"]') 14 × locator resolved to <div dir="ltr" data-uid=":R6m:" data-type="root" data-state="open" data-part="content" data-value="products" data-scope="navigation-menu" id="nav-menu::R6m::content:products" aria-labelledby="nav-menu::R6m::trigger:products">…</div> - unexpected value "visible" at models/navigation-menu.model.ts:59 57 | 58 | async dontSeeContent(value: string) { > 59 | await expect(this.getContent(value)).toBeHidden() | ^ 60 | } 61 | 62 | async seeContentLinkIsFocused(value: string, text: string) { at NavigationMenuModel.dontSeeContent (/home/runner/work/zag/zag/e2e/models/navigation-menu.model.ts:59:42) at /home/runner/work/zag/zag/e2e/navigation-menu.e2e.ts:65:13
e2e/navigation-menu.e2e.ts:79:7 › navigation-menu › tab navigation: e2e/models/navigation-menu.model.ts#L67
2) e2e/navigation-menu.e2e.ts:79:7 › navigation-menu › tab navigation ──────────────────────────── Error: Timed out 10000ms waiting for expect(locator).toBeFocused() Locator: locator('[data-scope="navigation-menu"][data-part="link"][data-value="pricing"]') Expected: focused Received: inactive Call log: - expect.toBeFocused with timeout 10000ms - waiting for locator('[data-scope="navigation-menu"][data-part="link"][data-value="pricing"]') 14 × locator resolved to <a href="#" dir="ltr" data-part="link" data-value="pricing" data-scope="navigation-menu" data-ownedby="nav-menu::R6m::content:pricing">Pricing</a> - unexpected value "inactive" at models/navigation-menu.model.ts:67 65 | 66 | async seeLinkIsFocused(value: string) { > 67 | await expect(this.getLink(value)).toBeFocused() | ^ 68 | } 69 | } 70 | at NavigationMenuModel.seeLinkIsFocused (/home/runner/work/zag/zag/e2e/models/navigation-menu.model.ts:67:39) at /home/runner/work/zag/zag/e2e/navigation-menu.e2e.ts:90:13
e2e/navigation-menu.e2e.ts:79:7 › navigation-menu › tab navigation: e2e/models/navigation-menu.model.ts#L67
2) e2e/navigation-menu.e2e.ts:79:7 › navigation-menu › tab navigation ──────────────────────────── Retry #1 ─────────────────────────────────────────────────────────────────────────────────────── Error: Timed out 10000ms waiting for expect(locator).toBeFocused() Locator: locator('[data-scope="navigation-menu"][data-part="link"][data-value="pricing"]') Expected: focused Received: inactive Call log: - expect.toBeFocused with timeout 10000ms - waiting for locator('[data-scope="navigation-menu"][data-part="link"][data-value="pricing"]') 14 × locator resolved to <a href="#" dir="ltr" data-part="link" data-value="pricing" data-scope="navigation-menu" data-ownedby="nav-menu::R6m::content:pricing">Pricing</a> - unexpected value "inactive" at models/navigation-menu.model.ts:67 65 | 66 | async seeLinkIsFocused(value: string) { > 67 | await expect(this.getLink(value)).toBeFocused() | ^ 68 | } 69 | } 70 | at NavigationMenuModel.seeLinkIsFocused (/home/runner/work/zag/zag/e2e/models/navigation-menu.model.ts:67:39) at /home/runner/work/zag/zag/e2e/navigation-menu.e2e.ts:90:13
e2e/navigation-menu.e2e.ts:79:7 › navigation-menu › tab navigation: e2e/models/navigation-menu.model.ts#L67
2) e2e/navigation-menu.e2e.ts:79:7 › navigation-menu › tab navigation ──────────────────────────── Retry #2 ─────────────────────────────────────────────────────────────────────────────────────── Error: Timed out 10000ms waiting for expect(locator).toBeFocused() Locator: locator('[data-scope="navigation-menu"][data-part="link"][data-value="pricing"]') Expected: focused Received: inactive Call log: - expect.toBeFocused with timeout 10000ms - waiting for locator('[data-scope="navigation-menu"][data-part="link"][data-value="pricing"]') 14 × locator resolved to <a href="#" dir="ltr" data-part="link" data-value="pricing" data-scope="navigation-menu" data-ownedby="nav-menu::R6m::content:pricing">Pricing</a> - unexpected value "inactive" at models/navigation-menu.model.ts:67 65 | 66 | async seeLinkIsFocused(value: string) { > 67 | await expect(this.getLink(value)).toBeFocused() | ^ 68 | } 69 | } 70 | at NavigationMenuModel.seeLinkIsFocused (/home/runner/work/zag/zag/e2e/models/navigation-menu.model.ts:67:39) at /home/runner/work/zag/zag/e2e/navigation-menu.e2e.ts:90:13
End-to-end Tests (5)
Process completed with exit code 1.
e2e/tags-input.e2e.ts:26:7 › tags-input › deletes tag with backspace when input value is empty: e2e/models/tags-input.model.ts#L70
1) e2e/tags-input.e2e.ts:26:7 › tags-input › deletes tag with backspace when input value is empty Error: Timed out 10000ms waiting for expect(locator).toHaveAttribute(expected) Locator: locator('[data-testid=svelte-tag]') Expected string: "" Received string: serializes to the same string Call log: - expect.toHaveAttribute with timeout 10000ms - waiting for locator('[data-testid=svelte-tag]') 14 × locator resolved to <div dir="ltr" data-value="Svelte" data-scope="tags-input" data-testid="svelte-tag" data-part="item-preview" id="tags-input::R6m::tag:Svelte:2">…</div> - unexpected value "null" at models/tags-input.model.ts:70 68 | 69 | async seeTagIsHighlighted(value: string) { > 70 | await expect(this.getTag(value)).toHaveAttribute("data-highlighted", "") | ^ 71 | } 72 | 73 | async seeTag(value: string) { at TagsInputModel.seeTagIsHighlighted (/home/runner/work/zag/zag/e2e/models/tags-input.model.ts:70:38) at /home/runner/work/zag/zag/e2e/tags-input.e2e.ts:30:13
e2e/tags-input.e2e.ts:117:7 › tags-input › edit tag with enter key: e2e/models/tags-input.model.ts#L90
2) e2e/tags-input.e2e.ts:117:7 › tags-input › edit tag with enter key ──────────────────────────── Error: Timed out 10000ms waiting for expect(locator).toBeFocused() Locator: locator('[data-testid=svelte-input]') Expected: focused Received: inactive Call log: - expect.toBeFocused with timeout 10000ms - waiting for locator('[data-testid=svelte-input]') 14 × locator resolved to <input value="" dir="ltr" hidden="" tabindex="-1" data-part="item-input" data-scope="tags-input" data-testid="svelte-input" id="tags-input::R6m::tag:Svelte:2:input" aria-label="Editing tag Svelte. Press enter to save or escape to cancel."/> - unexpected value "inactive" at models/tags-input.model.ts:90 88 | 89 | async seeTagInputIsFocused(value: string) { > 90 | await expect(this.getTagInput(value)).toBeFocused() | ^ 91 | } 92 | 93 | async dontSeeTagInput(value: string) { at TagsInputModel.seeTagInputIsFocused (/home/runner/work/zag/zag/e2e/models/tags-input.model.ts:90:43) at /home/runner/work/zag/zag/e2e/tags-input.e2e.ts:124:13
🎭 Playwright Run Summary
1 skipped 16 passed (28.2s)
🎭 Playwright Run Summary
1 skipped 21 passed (34.7s)
🎭 Playwright Run Summary
1 skipped 28 passed (44.6s)
🎭 Playwright Run Summary
1 skipped 26 passed (44.4s)
🎭 Playwright Run Summary
28 passed (49.4s)
🎭 Playwright Run Summary
1 skipped 29 passed (50.5s)
🎭 Playwright Run Summary
38 passed (57.9s)
🎭 Playwright Run Summary
17 passed (34.6s)
🎭 Playwright Run Summary
1 skipped 29 passed (55.8s)
🎭 Playwright Run Summary
3 skipped 26 passed (1.1m)
🎭 Playwright Run Summary
2 failed e2e/navigation-menu.e2e.ts:61:7 › navigation-menu › hover + focus should toggle content ──────── e2e/navigation-menu.e2e.ts:79:7 › navigation-menu › tab navigation ───────────────────────────── 3 skipped 29 passed (2.2m)
🎭 Playwright Run Summary
2 flaky e2e/tags-input.e2e.ts:26:7 › tags-input › deletes tag with backspace when input value is empty ─ e2e/tags-input.e2e.ts:117:7 › tags-input › edit tag with enter key ───────────────────────────── 11 skipped 16 passed (1.1m)