refactor(nav-menu): improve usability #6609
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)
|