diff --git a/README.md b/README.md index 43aadb4b..cac07711 100644 --- a/README.md +++ b/README.md @@ -90,10 +90,11 @@ test("click", () => { You can also ctrlClick / shiftClick etc with ```js -userEvent.click(elem, { ctrlKey: true, shiftKey: true }) +userEvent.click(elem, { ctrlKey: true, shiftKey: true }); ``` -See the [`MouseEvent`](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/MouseEvent) +See the +[`MouseEvent`](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/MouseEvent) constructor documentation for more options. ### `dblClick(element)` @@ -140,6 +141,45 @@ one character at the time. `false` is the default value. are typed. By default it's 0. You can use this option if your component has a different behavior for fast or slow users. +### `upload(element, file, [{ clickInit, changeInit }])` + +Uploads file to an ``. For uploading multiple files use `` with +`multiple` attribute and the second `upload` argument must be array then. Also +it's possible to initialize click or change event with using third argument. + +```jsx +import React from "react"; +import { render, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; + +test("upload file", () => { + const file = new File(["hello"], "hello.png", { type: "image/png" }); + + render(); + + userEvent.upload(screen.getByTestId("upload"), file); + + expect(input.files[0]).toStrictEqual(file); + expect(input.files.item(0)).toStrictEqual(file); + expect(input.files).toHaveLength(1); +}); + +test("upload multiple files", () => { + const files = [ + new File(["hello"], "hello.png", { type: "image/png" }), + new File(["there"], "there.png", { type: "image/png" }), + ]; + + render(); + + userEvent.upload(screen.getByTestId("upload"), files); + + expect(input.files).toHaveLength(2); + expect(input.files[0]).toStrictEqual(files[0]); + expect(input.files[1]).toStrictEqual(files[1]); +}); +``` + ### `clear(element)` Selects the text inside an `` or `