Jakub Zych
d980f4cf2f
- typed client and useMenu/useMenuApi (SSR, menu:<code>:<locale> key, server and public bases, x-forwarded-for forwarded also on cached renders) - MenuNav and recursive MenuNavItem: WAI disclosure navigation, URL allowlist with a text fallback, rel on _blank, active link and trail, mobile toggle, Esc / focus-out / outside pointer / route change closing - menu tokens and base CSS, README - node tests (link rules, client, server-rendered NavItem) and a playground SSR smoke against a fixture API
25 lines
1.7 KiB
Plaintext
25 lines
1.7 KiB
Plaintext
# SSR smoke of the playground (one MenuNav code="main", one code="missing"
|
|
# with a fallback slot) against testing/fixtures. Run: pnpm build:playground
|
|
# && pnpm smoke:ssr. Vue's SSR markers (<!--[-->) sit around slot content.
|
|
200 / contains=<nav class="menu-nav nav-main" aria-label="Main menu">
|
|
200 /about contains=<a href="/" class="menu-nav__link"><!--[-->Home<!--]--></a>
|
|
200 / contains=<a href="/about" class="menu-nav__link"><!--[-->About<!--]--></a>
|
|
200 / contains=<span class="menu-nav__sr">Show submenu: About</span>
|
|
200 / contains=<a href="/first-topic" class="menu-nav__link"><!--[-->First topic<!--]--></a>
|
|
200 / contains=<li class="menu-nav__divider" aria-hidden="true"></li>
|
|
# The parent of a list type with the placeholder URL "#" is one disclosure button.
|
|
200 / contains=class="menu-nav__link menu-nav__subtoggle" aria-expanded="false"
|
|
# javascript: never reaches an href; it renders as text.
|
|
200 / notcontains=href="javascript:
|
|
200 / contains=<span class="menu-nav__text"><!--[-->Unsafe topic<!--]--></span>
|
|
200 / contains=target="_blank" rel="noopener noreferrer"
|
|
200 / contains=<span class="menu-nav__sr">Open menu</span>
|
|
# The active link and the trail of its ancestors.
|
|
200 /about contains=<a href="/about" class="menu-nav__link menu-nav__link--active" aria-current="page">
|
|
200 /about/team contains=menu-nav__item--parent menu-nav__item--trail
|
|
200 /about/team/ contains=<a href="/about/team" class="menu-nav__link menu-nav__link--active" aria-current="page">
|
|
200 /?x=1 contains=<a href="/" class="menu-nav__link menu-nav__link--active" aria-current="page">
|
|
# A missing menu renders its fallback, never an empty nav.
|
|
200 / contains=<p class="playground-fallback">No menu</p>
|
|
200 / notcontains=aria-label="missing"
|