chore: replace ScriptHammer references with SpokeToWork #170
TortoiseWolfeAnnotations
8 errors and 1 warning
|
accessibility
Process completed with exit code 1.
|
|
[happy-dom] src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx > FontSwitcher Accessibility > Visual Indicators > should visually indicate current selection:
src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx#L214
TestingLibraryElementError: Unable to find an accessible element with the role "option" and name `/system default/i`
Here are the accessible roles:
button:
Name "Font Selection":
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
/>
Name "Select System Default font (currently selected)":
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
data-font-index="0"
style="font-family: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;"
/>
Name "Select Inter font":
<button
aria-label="Select Inter font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="1"
style="font-family: Inter, system-ui, -apple-system, sans-serif;"
/>
Name "Select OpenDyslexic font":
<button
aria-label="Select OpenDyslexic font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="2"
style="font-family: OpenDyslexic, \"Comic Sans MS\", sans-serif;"
/>
Name "Select Atkinson Hyperlegible font":
<button
aria-label="Select Atkinson Hyperlegible font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="3"
style="font-family: \"Atkinson Hyperlegible\", system-ui, sans-serif;"
/>
Name "Select Georgia font":
<button
aria-label="Select Georgia font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="4"
style="font-family: Georgia, \"Times New Roman\", Times, serif;"
/>
Name "Select JetBrains Mono font":
<button
aria-label="Select JetBrains Mono font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="5"
style="font-family: \"JetBrains Mono\", \"SF Mono\", Monaco, \"Courier New\", monospace;"
/>
--------------------------------------------------
heading:
Name "Font Selection":
<h3
class="mb-2 text-lg font-bold"
/>
--------------------------------------------------
listbox:
Name "Font options":
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
/>
--------------------------------------------------
status:
Name "":
<div
class="alert alert-info mt-4"
role="status"
/>
--------------------------------------------------
Ignored nodes: comments, script, style
<body
style="font-family: var(--font-family);"
>
<div>
<div
class="dropdown dropdown-end "
>
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
>
<svg
class="h-5 w-5"
fill="none"
stroke="currentColor"
stroke-width="1.5"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25H12"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
<span
class="hidden sm:inline"
>
System Default
</span>
</button>
<div
class="dropdown-content menu card card-compact bg-base-100 z-[100] mt-2 w-80 p-4 shadow-xl"
tabindex="0"
>
<div
class="card-body"
>
<h3
class="mb-2 text-lg font-bold"
>
Font Selection
</h3>
<div
class="text-sm font-semibold opacity-90"
>
All Fonts
</div>
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
>
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
|
|
[happy-dom] src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx > FontSwitcher Accessibility > Visual Indicators > should show loading state for fonts:
src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx#L202
TestingLibraryElementError: Unable to find an accessible element with the role "option"
Here are the accessible roles:
button:
Name "Font Selection":
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
/>
Name "Select System Default font (currently selected)":
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
data-font-index="0"
style="font-family: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;"
/>
Name "Select Inter font":
<button
aria-label="Select Inter font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="1"
style="font-family: Inter, system-ui, -apple-system, sans-serif;"
/>
Name "Select OpenDyslexic font":
<button
aria-label="Select OpenDyslexic font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="2"
style="font-family: OpenDyslexic, \"Comic Sans MS\", sans-serif;"
/>
Name "Select Atkinson Hyperlegible font":
<button
aria-label="Select Atkinson Hyperlegible font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="3"
style="font-family: \"Atkinson Hyperlegible\", system-ui, sans-serif;"
/>
Name "Select Georgia font":
<button
aria-label="Select Georgia font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="4"
style="font-family: Georgia, \"Times New Roman\", Times, serif;"
/>
Name "Select JetBrains Mono font":
<button
aria-label="Select JetBrains Mono font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="5"
style="font-family: \"JetBrains Mono\", \"SF Mono\", Monaco, \"Courier New\", monospace;"
/>
--------------------------------------------------
heading:
Name "Font Selection":
<h3
class="mb-2 text-lg font-bold"
/>
--------------------------------------------------
listbox:
Name "Font options":
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
/>
--------------------------------------------------
status:
Name "":
<div
class="alert alert-info mt-4"
role="status"
/>
--------------------------------------------------
Ignored nodes: comments, script, style
<body
style="font-family: var(--font-family);"
>
<div>
<div
class="dropdown dropdown-end "
>
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
>
<svg
class="h-5 w-5"
fill="none"
stroke="currentColor"
stroke-width="1.5"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25H12"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
<span
class="hidden sm:inline"
>
System Default
</span>
</button>
<div
class="dropdown-content menu card card-compact bg-base-100 z-[100] mt-2 w-80 p-4 shadow-xl"
tabindex="0"
>
<div
class="card-body"
>
<h3
class="mb-2 text-lg font-bold"
>
Font Selection
</h3>
<div
class="text-sm font-semibold opacity-90"
>
All Fonts
</div>
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
>
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
data-font-index
|
|
[happy-dom] src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx > FontSwitcher Accessibility > Focus Management > should handle font selection:
src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx#L142
TestingLibraryElementError: Unable to find an accessible element with the role "option" and name `/inter/i`
Here are the accessible roles:
button:
Name "Font Selection":
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
/>
Name "Select System Default font (currently selected)":
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
data-font-index="0"
style="font-family: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;"
/>
Name "Select Inter font":
<button
aria-label="Select Inter font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="1"
style="font-family: Inter, system-ui, -apple-system, sans-serif;"
/>
Name "Select OpenDyslexic font":
<button
aria-label="Select OpenDyslexic font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="2"
style="font-family: OpenDyslexic, \"Comic Sans MS\", sans-serif;"
/>
Name "Select Atkinson Hyperlegible font":
<button
aria-label="Select Atkinson Hyperlegible font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="3"
style="font-family: \"Atkinson Hyperlegible\", system-ui, sans-serif;"
/>
Name "Select Georgia font":
<button
aria-label="Select Georgia font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="4"
style="font-family: Georgia, \"Times New Roman\", Times, serif;"
/>
Name "Select JetBrains Mono font":
<button
aria-label="Select JetBrains Mono font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="5"
style="font-family: \"JetBrains Mono\", \"SF Mono\", Monaco, \"Courier New\", monospace;"
/>
--------------------------------------------------
heading:
Name "Font Selection":
<h3
class="mb-2 text-lg font-bold"
/>
--------------------------------------------------
listbox:
Name "Font options":
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
/>
--------------------------------------------------
status:
Name "":
<div
class="alert alert-info mt-4"
role="status"
/>
--------------------------------------------------
Ignored nodes: comments, script, style
<body
style="font-family: var(--font-family);"
>
<div>
<div
class="dropdown dropdown-end "
>
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
>
<svg
class="h-5 w-5"
fill="none"
stroke="currentColor"
stroke-width="1.5"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25H12"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
<span
class="hidden sm:inline"
>
System Default
</span>
</button>
<div
class="dropdown-content menu card card-compact bg-base-100 z-[100] mt-2 w-80 p-4 shadow-xl"
tabindex="0"
>
<div
class="card-body"
>
<h3
class="mb-2 text-lg font-bold"
>
Font Selection
</h3>
<div
class="text-sm font-semibold opacity-90"
>
All Fonts
</div>
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
>
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
|
|
[happy-dom] src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx > FontSwitcher Accessibility > Focus Management > should trap focus within dropdown:
src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx#L131
TestingLibraryElementError: Unable to find an accessible element with the role "option"
Here are the accessible roles:
button:
Name "Font Selection":
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
/>
Name "Select System Default font (currently selected)":
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
data-font-index="0"
style="font-family: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;"
/>
Name "Select Inter font":
<button
aria-label="Select Inter font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="1"
style="font-family: Inter, system-ui, -apple-system, sans-serif;"
/>
Name "Select OpenDyslexic font":
<button
aria-label="Select OpenDyslexic font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="2"
style="font-family: OpenDyslexic, \"Comic Sans MS\", sans-serif;"
/>
Name "Select Atkinson Hyperlegible font":
<button
aria-label="Select Atkinson Hyperlegible font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="3"
style="font-family: \"Atkinson Hyperlegible\", system-ui, sans-serif;"
/>
Name "Select Georgia font":
<button
aria-label="Select Georgia font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="4"
style="font-family: Georgia, \"Times New Roman\", Times, serif;"
/>
Name "Select JetBrains Mono font":
<button
aria-label="Select JetBrains Mono font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="5"
style="font-family: \"JetBrains Mono\", \"SF Mono\", Monaco, \"Courier New\", monospace;"
/>
--------------------------------------------------
heading:
Name "Font Selection":
<h3
class="mb-2 text-lg font-bold"
/>
--------------------------------------------------
listbox:
Name "Font options":
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
/>
--------------------------------------------------
status:
Name "":
<div
class="alert alert-info mt-4"
role="status"
/>
--------------------------------------------------
Ignored nodes: comments, script, style
<body
style="font-family: var(--font-family);"
>
<div>
<div
class="dropdown dropdown-end "
>
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
>
<svg
class="h-5 w-5"
fill="none"
stroke="currentColor"
stroke-width="1.5"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25H12"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
<span
class="hidden sm:inline"
>
System Default
</span>
</button>
<div
class="dropdown-content menu card card-compact bg-base-100 z-[100] mt-2 w-80 p-4 shadow-xl"
tabindex="0"
>
<div
class="card-body"
>
<h3
class="mb-2 text-lg font-bold"
>
Font Selection
</h3>
<div
class="text-sm font-semibold opacity-90"
>
All Fonts
</div>
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
>
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
data-font-index
|
|
[happy-dom] src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx > FontSwitcher Accessibility > Keyboard Navigation > should have keyboard accessible options:
src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx#L109
TestingLibraryElementError: Unable to find an accessible element with the role "option"
Here are the accessible roles:
button:
Name "Font Selection":
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
/>
Name "Select System Default font (currently selected)":
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
data-font-index="0"
style="font-family: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;"
/>
Name "Select Inter font":
<button
aria-label="Select Inter font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="1"
style="font-family: Inter, system-ui, -apple-system, sans-serif;"
/>
Name "Select OpenDyslexic font":
<button
aria-label="Select OpenDyslexic font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="2"
style="font-family: OpenDyslexic, \"Comic Sans MS\", sans-serif;"
/>
Name "Select Atkinson Hyperlegible font":
<button
aria-label="Select Atkinson Hyperlegible font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="3"
style="font-family: \"Atkinson Hyperlegible\", system-ui, sans-serif;"
/>
Name "Select Georgia font":
<button
aria-label="Select Georgia font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="4"
style="font-family: Georgia, \"Times New Roman\", Times, serif;"
/>
Name "Select JetBrains Mono font":
<button
aria-label="Select JetBrains Mono font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="5"
style="font-family: \"JetBrains Mono\", \"SF Mono\", Monaco, \"Courier New\", monospace;"
/>
--------------------------------------------------
heading:
Name "Font Selection":
<h3
class="mb-2 text-lg font-bold"
/>
--------------------------------------------------
listbox:
Name "Font options":
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
/>
--------------------------------------------------
status:
Name "":
<div
class="alert alert-info mt-4"
role="status"
/>
--------------------------------------------------
Ignored nodes: comments, script, style
<body
style="font-family: var(--font-family);"
>
<div>
<div
class="dropdown dropdown-end "
>
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
>
<svg
class="h-5 w-5"
fill="none"
stroke="currentColor"
stroke-width="1.5"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25H12"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
<span
class="hidden sm:inline"
>
System Default
</span>
</button>
<div
class="dropdown-content menu card card-compact bg-base-100 z-[100] mt-2 w-80 p-4 shadow-xl"
tabindex="0"
>
<div
class="card-body"
>
<h3
class="mb-2 text-lg font-bold"
>
Font Selection
</h3>
<div
class="text-sm font-semibold opacity-90"
>
All Fonts
</div>
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
>
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
data-font-index
|
|
[happy-dom] src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx > FontSwitcher Accessibility > ARIA Attributes > should indicate current selection with aria-selected:
src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx#L58
TestingLibraryElementError: Unable to find an accessible element with the role "option"
Here are the accessible roles:
button:
Name "Font Selection":
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
/>
Name "Select System Default font (currently selected)":
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
data-font-index="0"
style="font-family: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;"
/>
Name "Select Inter font":
<button
aria-label="Select Inter font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="1"
style="font-family: Inter, system-ui, -apple-system, sans-serif;"
/>
Name "Select OpenDyslexic font":
<button
aria-label="Select OpenDyslexic font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="2"
style="font-family: OpenDyslexic, \"Comic Sans MS\", sans-serif;"
/>
Name "Select Atkinson Hyperlegible font":
<button
aria-label="Select Atkinson Hyperlegible font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="3"
style="font-family: \"Atkinson Hyperlegible\", system-ui, sans-serif;"
/>
Name "Select Georgia font":
<button
aria-label="Select Georgia font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="4"
style="font-family: Georgia, \"Times New Roman\", Times, serif;"
/>
Name "Select JetBrains Mono font":
<button
aria-label="Select JetBrains Mono font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="5"
style="font-family: \"JetBrains Mono\", \"SF Mono\", Monaco, \"Courier New\", monospace;"
/>
--------------------------------------------------
heading:
Name "Font Selection":
<h3
class="mb-2 text-lg font-bold"
/>
--------------------------------------------------
listbox:
Name "Font options":
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
/>
--------------------------------------------------
status:
Name "":
<div
class="alert alert-info mt-4"
role="status"
/>
--------------------------------------------------
Ignored nodes: comments, script, style
<body
style="font-family: var(--font-family);"
>
<div>
<div
class="dropdown dropdown-end "
>
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
>
<svg
class="h-5 w-5"
fill="none"
stroke="currentColor"
stroke-width="1.5"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25H12"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
<span
class="hidden sm:inline"
>
System Default
</span>
</button>
<div
class="dropdown-content menu card card-compact bg-base-100 z-[100] mt-2 w-80 p-4 shadow-xl"
tabindex="0"
>
<div
class="card-body"
>
<h3
class="mb-2 text-lg font-bold"
>
Font Selection
</h3>
<div
class="text-sm font-semibold opacity-90"
>
All Fonts
</div>
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
>
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
data-font-index
|
|
[happy-dom] src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx > FontSwitcher Accessibility > ARIA Attributes > should mark font items as options:
src/components/atomic/FontSwitcher/FontSwitcher.accessibility.test.tsx#L41
TestingLibraryElementError: Unable to find an accessible element with the role "option"
Here are the accessible roles:
button:
Name "Font Selection":
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
/>
Name "Select System Default font (currently selected)":
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
data-font-index="0"
style="font-family: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;"
/>
Name "Select Inter font":
<button
aria-label="Select Inter font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="1"
style="font-family: Inter, system-ui, -apple-system, sans-serif;"
/>
Name "Select OpenDyslexic font":
<button
aria-label="Select OpenDyslexic font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="2"
style="font-family: OpenDyslexic, \"Comic Sans MS\", sans-serif;"
/>
Name "Select Atkinson Hyperlegible font":
<button
aria-label="Select Atkinson Hyperlegible font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="3"
style="font-family: \"Atkinson Hyperlegible\", system-ui, sans-serif;"
/>
Name "Select Georgia font":
<button
aria-label="Select Georgia font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="4"
style="font-family: Georgia, \"Times New Roman\", Times, serif;"
/>
Name "Select JetBrains Mono font":
<button
aria-label="Select JetBrains Mono font"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors "
data-font-index="5"
style="font-family: \"JetBrains Mono\", \"SF Mono\", Monaco, \"Courier New\", monospace;"
/>
--------------------------------------------------
heading:
Name "Font Selection":
<h3
class="mb-2 text-lg font-bold"
/>
--------------------------------------------------
listbox:
Name "Font options":
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
/>
--------------------------------------------------
status:
Name "":
<div
class="alert alert-info mt-4"
role="status"
/>
--------------------------------------------------
Ignored nodes: comments, script, style
<body
style="font-family: var(--font-family);"
>
<div>
<div
class="dropdown dropdown-end "
>
<button
aria-label="Font Selection"
class="btn btn-ghost gap-2"
tabindex="0"
>
<svg
class="h-5 w-5"
fill="none"
stroke="currentColor"
stroke-width="1.5"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25H12"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
<span
class="hidden sm:inline"
>
System Default
</span>
</button>
<div
class="dropdown-content menu card card-compact bg-base-100 z-[100] mt-2 w-80 p-4 shadow-xl"
tabindex="0"
>
<div
class="card-body"
>
<h3
class="mb-2 text-lg font-bold"
>
Font Selection
</h3>
<div
class="text-sm font-semibold opacity-90"
>
All Fonts
</div>
<div
aria-label="Font options"
class="space-y-1"
role="listbox"
>
<button
aria-label="Select System Default font (currently selected)"
class="hover:bg-base-200 w-full rounded-lg p-3 text-left transition-colors bg-primary text-primary-content active"
data-font-index
|
|
accessibility
No files were found with the provided path: .pa11y-screenshots/. No artifacts will be uploaded.
|