remove token shape #13951
Annotations
5 errors
Test codebase:
src/components/donation/Steps/Steps.test.tsx#L226
TestingLibraryElementError: Unable to find an accessible element with the role "button" and name `/select token/i`
Here are the accessible roles:
tablist:
Name "":
<div
aria-orientation="horizontal"
class="grid @md/steps:grid-cols-2 gap-2 @xl/steps:gap-0 p-4 @xl/steps:p-0 @xl/steps:grid-cols-[auto_1fr] @[42rem]/steps:min-w-48 content-start @xl/steps:divide-y @xl/steps:divide-white @xl/steps:border-r border-gray-l4"
role="tablist"
/>
--------------------------------------------------
tab:
Name "Card/Bank":
<button
aria-controls="headlessui-tabs-panel-:r85:"
aria-selected="false"
class="border border-gray-l4 @xl/steps:border-none text-navy-l1 flex items-center gap-2 p-2 @xl/steps:px-3 @xl/steps:py-[1.15rem] @xl/steps:grid @xl/steps:grid-cols-subgrid @xl/steps:col-span-2 focus:outline-none @xl/steps:w-28 rounded @xl/steps:rounded-none"
data-headlessui-state=""
id="headlessui-tabs-tab-:r7t:"
role="tab"
tabindex="-1"
type="button"
/>
Name "Donor Advised Fund":
<button
aria-controls="headlessui-tabs-panel-:r8p:"
aria-selected="false"
class="border border-gray-l4 @xl/steps:border-none text-navy-l1 flex items-center gap-2 p-2 @xl/steps:px-3 @xl/steps:py-[1.15rem] @xl/steps:grid @xl/steps:grid-cols-subgrid @xl/steps:col-span-2 focus:outline-none @xl/steps:w-28 rounded @xl/steps:rounded-none"
data-headlessui-state=""
id="headlessui-tabs-tab-:r7v:"
role="tab"
tabindex="-1"
type="button"
/>
Name "Stocks":
<button
aria-controls="headlessui-tabs-panel-:r8r:"
aria-selected="false"
class="border border-gray-l4 @xl/steps:border-none text-navy-l1 flex items-center gap-2 p-2 @xl/steps:px-3 @xl/steps:py-[1.15rem] @xl/steps:grid @xl/steps:grid-cols-subgrid @xl/steps:col-span-2 focus:outline-none @xl/steps:w-28 rounded @xl/steps:rounded-none"
data-headlessui-state=""
id="headlessui-tabs-tab-:r81:"
role="tab"
tabindex="-1"
type="button"
/>
Name "Crypto":
<button
aria-controls="headlessui-tabs-panel-:r8t:"
aria-selected="true"
class="font-medium bg-[--accent-secondary] text-navy-d4 flex items-center gap-2 p-2 @xl/steps:px-3 @xl/steps:py-[1.15rem] @xl/steps:grid @xl/steps:grid-cols-subgrid @xl/steps:col-span-2 focus:outline-none @xl/steps:w-28 rounded @xl/steps:rounded-none"
data-headlessui-state="selected hover"
data-hover=""
data-selected=""
id="headlessui-tabs-tab-:r83:"
role="tab"
tabindex="0"
type="button"
/>
--------------------------------------------------
presentation:
Name "":
<img
alt=""
class="object-contain shrink-0 h-4 "
src="/src/assets/icons/dafpay.svg"
/>
--------------------------------------------------
tabpanel:
Name "Crypto":
<div
aria-labelledby="headlessui-tabs-tab-:r83:"
data-headlessui-state="selected"
data-selected=""
id="headlessui-tabs-panel-:r8t:"
role="tabpanel"
tabindex="0"
/>
--------------------------------------------------
combobox:
Name "Token":
<input
aria-autocomplete="list"
aria-expanded="false"
class="w-full font-heading bg-transparent py-[13px] px-5 placeholder:text-navy-l3 text-navy-d4 border border-gray-l3 rounded-lg text-base font-semibold placeholder:font-medium outline-blue-d1 outline-offset-4"
data-headlessui-state=""
id="headlessui-control-:r8v:"
placeholder="Search"
role="combobox"
type="text"
value=""
/>
--------------------------------------------------
button:
Name "":
<button
aria-expanded="false"
aria-haspopup="listbox"
class="data-[open]:rotate-180 absolute right-4 top-1/2 -translate-y-1/2 transition-transform ease-in-out"
data-headlessui-state=""
id="headlessui-combobox-button-:r94:"
tabindex="-1"
type="button"
/>
Name "General Donation":
<button
aria-expanded="false"
aria-haspopup="listbox"
class="flex items-center justify-between border border-gray-l4 py-3.5 pl-5 pr-2 rounded-lg focus:ring-2 focus:ring-blue-d1 ring-offset-1"
data-
|
Test codebase:
src/components/donation/Steps/DonateMethods/Crypto/Form.test.tsx#L94
AssertionError: expected "spy" to be called once, but got 0 times
❯ src/components/donation/Steps/DonateMethods/Crypto/Form.test.tsx:94:28
|
Test codebase:
src/components/donation/Steps/DonateMethods/Crypto/Form.test.tsx#L116
TestingLibraryElementError: Found multiple elements with the text: /required/i
Here are the matching elements:
Ignored nodes: comments, script, style
<p
class="text-red text-xs text-right empty:hidden mt-1.5"
>
required
</p>
Ignored nodes: comments, script, style
<p
class="text-red text-xs mt-1.5 empty:hidden"
>
required
</p>
(If this is intentional, then use the `*AllBy*` variant of the query (like `queryAllByText`, `getAllByText`, or `findAllByText`)).
Ignored nodes: comments, script, style
<body>
<div>
<form
autocomplete="off"
class="flex flex-col gap-4 rounded-md min-h-full"
>
<div
class="w-full grid"
data-headlessui-state=""
>
<label
class="block mb-2 red-asterisk font-semibold font-heading"
data-headlessui-state=""
for="headlessui-control-:r1d:"
id="headlessui-label-:r1e:"
>
Token
</label>
<div
class="relative w-full"
>
<input
aria-autocomplete="list"
aria-expanded="false"
class="w-full font-heading bg-transparent py-[13px] px-5 placeholder:text-navy-l3 text-navy-d4 border border-gray-l3 rounded-lg text-base font-semibold placeholder:font-medium outline-blue-d1 outline-offset-4"
data-headlessui-state=""
id="headlessui-control-:r1d:"
placeholder="Search"
role="combobox"
type="text"
value=""
/>
<button
aria-expanded="false"
aria-haspopup="listbox"
class="data-[open]:rotate-180 absolute right-4 top-1/2 -translate-y-1/2 transition-transform ease-in-out"
data-headlessui-state=""
id="headlessui-combobox-button-:r1i:"
tabindex="-1"
type="button"
>
<svg
class="lucide lucide-chevron-down"
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="m6 9 6 6 6-6"
/>
</svg>
</button>
</div>
<p
class="text-red text-xs text-right empty:hidden mt-1.5"
>
required
</p>
<div
hidden=""
style="position: fixed; top: 1px; left: 1px; width: 1px; height: 0px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border-width: 0px; display: none;"
/>
</div>
<div
class="grid"
data-headlessui-state=""
>
<div
class="flex items-center justify-between"
>
<label
class="block mb-2 red-asterisk font-semibold font-heading"
data-headlessui-state=""
for="headlessui-control-:r1m:"
id="headlessui-label-:r1n:"
>
Donation amount
</label>
<p
class="text-sm text-navy-l1"
>
$
0.00
</p>
</div>
<div
class="relative"
>
<input
aria-labelledby="headlessui-label-:r1n:"
class="disabled:bg-gray-l5 w-full font-heading bg-transparent py-[13px] px-5 placeholder:text-navy-l3 text-navy-d4 border border-gray-l3 rounded-lg text-base font-semibold placeholder:font-medium outline-blue-d1 outline-offset-4"
data-focus=""
data-headlessui-state="focus"
id="headlessui-control-:r1m:"
name="amount"
placeholder="Enter amount"
/>
<div
class="absolute top-1/2 -translate-y-1/2 right-4"
/>
</div>
<p
class="text-red text-xs mt-1.5 empty:hidden"
>
required
</p>
<div
hidden
|
Test codebase:
src/components/donation/Steps/DonateMethods/Crypto/Form.test.tsx#L141
TestingLibraryElementError: Found multiple elements with the text: /required/i
Here are the matching elements:
Ignored nodes: comments, script, style
<p
class="text-red text-xs text-right empty:hidden mt-1.5"
>
required
</p>
Ignored nodes: comments, script, style
<p
class="text-red text-xs mt-1.5 empty:hidden"
>
required
</p>
(If this is intentional, then use the `*AllBy*` variant of the query (like `queryAllByText`, `getAllByText`, or `findAllByText`)).
Ignored nodes: comments, script, style
<body>
<div>
<form
autocomplete="off"
class="flex flex-col gap-4 rounded-md min-h-full"
>
<div
class="w-full grid"
data-headlessui-state=""
>
<label
class="block mb-2 red-asterisk font-semibold font-heading"
data-headlessui-state=""
for="headlessui-control-:r1v:"
id="headlessui-label-:r20:"
>
Token
</label>
<div
class="relative w-full"
>
<input
aria-autocomplete="list"
aria-expanded="false"
class="w-full font-heading bg-transparent py-[13px] px-5 placeholder:text-navy-l3 text-navy-d4 border border-gray-l3 rounded-lg text-base font-semibold placeholder:font-medium outline-blue-d1 outline-offset-4"
data-headlessui-state=""
id="headlessui-control-:r1v:"
placeholder="Search"
role="combobox"
type="text"
value=""
/>
<button
aria-expanded="false"
aria-haspopup="listbox"
class="data-[open]:rotate-180 absolute right-4 top-1/2 -translate-y-1/2 transition-transform ease-in-out"
data-headlessui-state=""
id="headlessui-combobox-button-:r24:"
tabindex="-1"
type="button"
>
<svg
class="lucide lucide-chevron-down"
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="m6 9 6 6 6-6"
/>
</svg>
</button>
</div>
<p
class="text-red text-xs text-right empty:hidden mt-1.5"
>
required
</p>
<div
hidden=""
style="position: fixed; top: 1px; left: 1px; width: 1px; height: 0px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border-width: 0px; display: none;"
/>
</div>
<div
class="grid"
data-headlessui-state=""
>
<div
class="flex items-center justify-between"
>
<label
class="block mb-2 red-asterisk font-semibold font-heading"
data-headlessui-state=""
for="headlessui-control-:r28:"
id="headlessui-label-:r29:"
>
Donation amount
</label>
<p
class="text-sm text-navy-l1"
>
$
0.00
</p>
</div>
<div
class="relative"
>
<input
aria-labelledby="headlessui-label-:r29:"
class="disabled:bg-gray-l5 w-full font-heading bg-transparent py-[13px] px-5 placeholder:text-navy-l3 text-navy-d4 border border-gray-l3 rounded-lg text-base font-semibold placeholder:font-medium outline-blue-d1 outline-offset-4"
data-focus=""
data-headlessui-state="focus"
id="headlessui-control-:r28:"
name="amount"
placeholder="Enter amount"
/>
<div
class="absolute top-1/2 -translate-y-1/2 right-4"
/>
</div>
<p
class="text-red text-xs mt-1.5 empty:hidden"
>
required
</p>
<div
hidden
|
Test codebase
Process completed with exit code 1.
|
Loading