cljest.helpers.dom
actcljs
(act cb)Wrap the provided cb in react-dom/test-utils act function. When performing an action on a component
that may have a side effect that is outside of the normal set of functions provided here, such as firing
a localStorage update that then updates a component, you should wrap the function in act.
You may also need to wrap the provided helpers in this file in the event that they result in a side effect.
Example:
(act #(js/localStorage.setItem "ls-key" true))
Wrap the provided `cb` in `react-dom/test-utils` `act` function. When performing an action on a component that may have a side effect that is outside of the normal set of functions provided here, such as firing a localStorage update that then updates a component, you should wrap the function in `act`. You may also need to wrap the provided helpers in this file in the event that they result in a side effect. Example: ``` (act #(js/localStorage.setItem "ls-key" true)) ```
clear+cljs
(clear+ element)Simulates clear event on element.
Simulates clear event on `element`.
click+cljs
(click+ element)Simulates click on the provided element.
Example:
(let [my-element (h/get-by :test-id "some-id")]
(click+ my-element))
Simulates click on the provided element. Example: ``` (let [my-element (h/get-by :test-id "some-id")] (click+ my-element)) ```
context-menucljs
(context-menu element)Simulates context-menu event on element.
Simulates context-menu event on `element`.
debugcljs
(debug)(debug ele)Pretty prints the HTML of the screen, or given ele if provided, using console.log.
Pretty prints the HTML of the screen, or given `ele` if provided, using console.log.
fire-eventcljs
(fire-event element event)Fires an event on the provided element. This is a low level function for non user triggered events. Use click/type/keyboard/etc. for user triggered events.
Fires an event on the provided element. This is a low level function for non user triggered events. Use click/type/keyboard/etc. for user triggered events.
get-all-bycljsmultimethod
Gets all elements using the specified type and selector. May optionally take a scope Testing Library element. Throws if no elements could be found.
See https://testing-library.com/docs/queries/about#types-of-queries
Example:
(get-all-by :test-id "my-ele-test-id")
(get-all-by :text "some button text")
Gets all elements using the specified type and selector. May optionally take a scope Testing Library element. Throws if no elements could be found. See https://testing-library.com/docs/queries/about#types-of-queries Example: ``` (get-all-by :test-id "my-ele-test-id") (get-all-by :text "some button text") ```
get-bycljsmultimethod
Gets an element using the specified type and selector. May optionally take a scope Testing Library element. Throws if the element cannot be found or if more than one element was found.
See https://testing-library.com/docs/queries/about#types-of-queries
Example:
(get-by :test-id "my-ele-test-id")
(get-by :text "some button text")
(let [scoped-ele (within (get-by :test-id "my-ele"))]
(get-by :text "A name" scoped-ele))
Gets an element using the specified type and selector. May optionally take a scope Testing Library element. Throws if the element cannot be found or if more than one element was found. See https://testing-library.com/docs/queries/about#types-of-queries Example: ``` (get-by :test-id "my-ele-test-id") (get-by :text "some button text") (let [scoped-ele (within (get-by :test-id "my-ele"))] (get-by :text "A name" scoped-ele)) ```
hover+cljs
(hover+ element)Simulates hover on the provided element.
Example:
(let [my-element (h/get-by :test-id "some-id")]
(hover+ my-element))
Simulates hover on the provided element. Example: ``` (let [my-element (h/get-by :test-id "some-id")] (hover+ my-element)) ```
keyboard+cljs
(keyboard+ text)Simulates keyboard events described by text.
See https://testing-library.com/docs/ecosystem-user-event#keyboardtext-options.
Simulates keyboard events described by `text`. See https://testing-library.com/docs/ecosystem-user-event#keyboardtext-options.
query-bycljsmultimethod
Queries an element by the specified type and selector. Returns null if no elements are found, and throws if more than one element is found. May optionally take a scope Testing Library element.
See https://testing-library.com/docs/queries/about#types-of-queries
Example:
(query-by :test-id "a-test-id")
(query-by :text "some text")
Queries an element by the specified type and selector. Returns null if no elements are found, and throws if more than one element is found. May optionally take a scope Testing Library element. See https://testing-library.com/docs/queries/about#types-of-queries Example: ``` (query-by :test-id "a-test-id") (query-by :text "some text") ```
rendercljs
(render component)Takes a React component and renders it. This works with vanille React components, e.g. UIx and Helix
components. If you need to render a Reagent component, use cljest.helpers.reagent/render instead.
Example:
(render ($ my-cool-component))
Takes a React component and renders it. This works with vanille React components, e.g. UIx and Helix components. If you need to render a Reagent component, use `cljest.helpers.reagent/render` instead. Example: ``` (render ($ my-cool-component)) ```
right-click+cljs
(right-click+ element)Simulates right-click on the provided element.
Example:
(let [my-element (h/get-by :test-id "some-id")]
(right-click+ my-element))
Simulates right-click on the provided element. Example: ``` (let [my-element (h/get-by :test-id "some-id")] (right-click+ my-element)) ```
type+cljs
(type+ element text)Simulates typing on the provided element (generally an input).
Example:
(type+ (h/get-by :test-id "email") "john@example.com")
Simulates typing on the provided element (generally an input). Example: ``` (type+ (h/get-by :test-id "email") "john@example.com") ```
upload+cljs
(upload+ element files)Change a file input as if a user clicked it and selected files in the resulting file upload dialog.
Example:
(let [buffer (fs/readFileSync (path/join js/__dirname " __fixtures__ " " filename.png "))
file (js/File. buffer #js {:type " image/png "})]
(async
...
(h.dom/upload+ (h.dom/get-by :test-id " upload-avatar ") file)
Change a file input as if a user clicked it and selected files in the resulting file upload dialog.
Example:
```
(let [buffer (fs/readFileSync (path/join js/__dirname " __fixtures__ " " filename.png "))
file (js/File. buffer #js {:type " image/png "})]
(async
...
(h.dom/upload+ (h.dom/get-by :test-id " upload-avatar ") file)
```wait-for+cljs
(wait-for+ cb)Calls the provided cb until it doesn't throw. Returns a promise.
Useful when you've performed an action on an element (e.g. clicking) and are now waiting for a matcher to pass.
Example:
(async
(await (click+ (h/get-by :test-id "some-id")))
(await (wait-for+ #(m/visible? (h/get-by :test-id "some-other-id"))))
(click+ (h/get-by :test-id "some-other-id")))
Calls the provided `cb` until it doesn't throw. Returns a promise. Useful when you've performed an action on an element (e.g. clicking) and are now waiting for a matcher to pass. Example: ``` (async (await (click+ (h/get-by :test-id "some-id"))) (await (wait-for+ #(m/visible? (h/get-by :test-id "some-other-id")))) (click+ (h/get-by :test-id "some-other-id"))) ```
withincljs
(within ele)Gets an element within another element. Useful in cases like getting an element that has the same test ID or text as another but is inside of a distinct parent.
Example:
(let [rows (h/get-all-by :test-id "table-row")
row (get rows 1)]
(m/visible? (h/get-by :test-id "row-name" (within row))))
Gets an element within another element. Useful in cases like getting an element that has the same test ID or text
as another but is inside of a distinct parent.
Example:
```
(let [rows (h/get-all-by :test-id "table-row")
row (get rows 1)]
(m/visible? (h/get-by :test-id "row-name" (within row))))
```cljdoc is a website building & hosting documentation for Clojure/Script libraries
× close