Use sr-only for non-button non-anchor elements #439
ozdentarikcanAnnotations
3 errors and 1 warning
|
src/routes/profile.test.tsx > Profile component > renders loading state:
frontend/src/routes/profile.test.tsx#L56
TestingLibraryElementError: Unable to find a label with the text of: /loading/i
Ignored nodes: comments, script, style
<body>
<div>
<div
class="min-h-screen"
>
<a
class="sr-only focus:not-sr-only focus:fixed focus:z-50 focus:block focus:bg-background focus:p-4"
href="#main-content"
>
Skip to main content
</a>
<header
class="container sticky top-0 z-10 flex h-16 items-center gap-4 border-b bg-background px-4 md:px-6"
>
<nav
class="hidden flex-col gap-6 text-lg font-medium md:flex md:flex-row md:items-center md:gap-5 md:text-sm lg:gap-6"
>
<a
class="flex items-center gap-2 text-lg font-semibold md:text-base"
href="/"
>
<svg
class="lucide lucide-code-xml h-6 w-6"
fill="none"
height="24"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="m18 16 4-4-4-4"
/>
<path
d="m6 8-4 4 4 4"
/>
<path
d="m14.5 4-5 16"
/>
</svg>
<h5
class="w-[max-content]"
>
Programming Languages Forum
</h5>
</a>
<a
class="transition-colors hover:text-foreground text-muted-foreground"
href="/"
>
Home
</a>
<a
class="transition-colors hover:text-foreground text-muted-foreground"
href="/tags"
>
Tags
</a>
</nav>
<button
aria-controls="radix-:rh:"
aria-expanded="false"
aria-haspopup="dialog"
class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border border-input bg-background hover:bg-accent hover:text-accent-foreground h-10 w-10 shrink-0 md:hidden"
data-state="closed"
type="button"
>
<svg
class="lucide lucide-menu h-5 w-5"
fill="none"
height="24"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<line
x1="4"
x2="20"
y1="12"
y2="12"
/>
<line
x1="4"
x2="20"
y1="6"
y2="6"
/>
<line
x1="4"
x2="20"
y1="18"
y2="18"
/>
</svg>
<span
class="sr-only"
>
Toggle navigation menu
</span>
</button>
<div
class="flex w-full items-center gap-4 md:ml-auto md:gap-2 lg:gap-4"
>
<div
class="ml-auto flex flex-1 sm:flex-initial"
>
<div
class="flex items-center gap-4"
>
<form
class="flex gap-4"
>
<div
class="flex"
>
<button
aria-expanded="false"
aria-haspopup="menu"
class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled
|
|
src/routes/search.test.tsx > Search component > renders loading state:
frontend/src/routes/search.test.tsx#L58
TestingLibraryElementError: Unable to find a label with the text of: /loading/i
Ignored nodes: comments, script, style
<body>
<div>
<div
class="container flex flex-col gap-2 py-8"
>
<h1
class="text-2xl font-bold "
>
No tags found
</h1>
<p>
Try searching for "python", or "javascript"
</p>
<div
class="mt-4"
>
<div
class="grid grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-4"
/>
<div
class="col-span-3 flex w-full items-center justify-center"
>
<svg
class="lucide lucide-loader-circle h-16 w-16 animate-spin text-primary"
fill="none"
height="24"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M21 12a9 9 0 1 1-6.219-8.56"
/>
</svg>
<span
class="sr-only"
>
Loading
</span>
</div>
</div>
</div>
</div>
</body>
❯ Object.getElementError node_modules/@testing-library/dom/dist/config.js:37:19
❯ getAllByLabelText node_modules/@testing-library/dom/dist/queries/label-text.js:111:38
❯ node_modules/@testing-library/dom/dist/query-helpers.js:52:17
❯ getByLabelText node_modules/@testing-library/dom/dist/query-helpers.js:95:19
❯ src/routes/search.test.tsx:58:19
|
|
Frontend Tests
Process completed with exit code 1.
|
|
Frontend Tests
ubuntu-latest pipelines will use ubuntu-24.04 soon. For more details, see https://github.com/actions/runner-images/issues/10636
|