@@ -72,25 +72,35 @@ Open the extension manager with <kbd>ctrl</kbd>+<kbd>shift</kbd>+<kbd>X</kbd> (W
7272
7373## Cheat Sheet
7474
75- | Search Variants | Result |
76- | ---------------- | --------------------------------------------- |
77- | ` getBy ` ... | ` Element ` or ` Error ` |
78- | ` getAllBy ` ... | ` Element[] ` or ` Error ` |
79- | ` queryBy ` ... | ` Element ` or ` null ` |
80- | ` queryAllBy ` ... | ` Element[] ` or ` null ` |
81- | ` findBy ` ... | ` Promise<Element> ` or ` Promise<rejection> ` |
82- | ` findAllBy ` ... | ` Promise<Element[]> ` or ` Promise<rejection> ` |
83-
84- | Search Types | Result |
85- | --------------------- | --------------------------------------------- |
86- | ...` Role ` | ` <div aria="role"> ` or [ Aria Roles] ( https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques#roles ) |
87- | ...` LabelText ` | ` <label for="Text"> ` |
88- | ...` PlaceHolderText ` | ` <input placeholder="Text"> ` |
89- | ...` Text ` | ` <a href="/page">Text</a> ` |
90- | ...` DisplayValue ` | ` <input value="Text"> ` |
91- | ...` AltText ` | ` <img alt="Text"> ` |
92- | ...` Title ` | ` <span title="Text"> ` or ` <title> ` |
93- | ...` TestId ` | ` <input data-testid="Id"> ` |
75+ You can write any combination of Search variants and Search types.
76+
77+ ### Search variants
78+
79+ | Variants | Return if no match | Return if 1 match | Return if 1+ match | Await? |
80+ | --------------- | ------------------ | ----------------- | ------------------ | ------ |
81+ | ` getBy ` ... | throw | return | throw | No |
82+ | ` getAllBy ` ... | throw | array | array | No |
83+ | ` queryBy ` ... | ` null ` | return | throw | No |
84+ | ` queryAllBy ` ... | ` [] ` | array | array | No |
85+ | ` findBy ` ... | throw | return | throw | Yes |
86+ | ` findAllBy ` ... | throw | array | array | Yes |
87+
88+ ### Search types
89+
90+ Sorted by oficial recommended [ order of priority] ( https://testing-library.com/docs/queries/about/#priority ) .
91+
92+ | | Types | finds by... | DOM example |
93+ | - | --------------------- | -------------------------------- | ------------------------------------- |
94+ | 1 | ...,` Role ` | [ ARIA role] ( https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques#roles ) | ` <div role="dialog" /> ` |
95+ | 2 | ...,` LabelText ` | label or aria-label content | ` <label for="element" /> ` |
96+ | 3 | ...,` PlaceholderText ` | input placeholder value | ` <input placeholder="name" /> ` |
97+ | 4 | ...,` Text ` | element text content | ` <p>Lorem ipsum</p> ` |
98+ | 5 | ...,` DisplayValue ` | form element current value | ` <input value="Current Value"> ` |
99+ | 6 | ...,` AltText ` | img alt attribute | ` <img alt="movie poster" /> ` |
100+ | 7 | ...,` Title ` | title attribute or svg title tag | ` <span title="Add" /> ` or ` <title /> ` |
101+ | 8 | ...,` TestId ` | data-testid attribute | ` <div data-testid="some-message" /> ` |
102+
103+ > For more information visit the oficial cheat sheet: [ DOM] ( https://testing-library.com/docs/dom-testing-library/cheatsheet ) - [ React] ( https://testing-library.com/docs/react-testing-library/cheatsheet ) - [ Vue] ( https://testing-library.com/docs/vue-testing-library/cheatsheet )
94104
95105⇧ [ Back to menu] ( #menu )
96106
@@ -118,8 +128,6 @@ Below is a list of all available snippets and the triggers of each one. The `░
118128
119129### Queries
120130
121- Sorted by recommended official priority
122-
123131#### 1. Role
124132
125133| Trigger | Result |
0 commit comments