github/puppeteer
0
0
Fork 0
mirror of https://github.com/puppeteer/puppeteer synced 2024-06-14 14:02:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

docs: improve docs on file upload (#10058)

Browse Source
This commit is contained in:
jrandolf 2023-04-21 14:15:19 +02:00 committed by GitHub
parent 23d6a95cf1
commit e5d6864056
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 40 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/api/puppeteer.elementhandle.md
View File

@ -80,6 +80,6 @@ The constructor for this class is marked as internal. Third-party code should no
| [touchMove(this)](./puppeteer.elementhandle.touchmove.md) | | | | [touchMove(this)](./puppeteer.elementhandle.touchmove.md) | | |
| [touchStart(this)](./puppeteer.elementhandle.touchstart.md) | | | | [touchStart(this)](./puppeteer.elementhandle.touchstart.md) | | |
| [type(text, options)](./puppeteer.elementhandle.type.md) | | <p>Focuses the element, and then sends a <code>keydown</code>, <code>keypress</code>/<code>input</code>, and <code>keyup</code> event for each character in the text.</p><p>To press a special key, like <code>Control</code> or <code>ArrowDown</code>, use [ElementHandle.press()](./puppeteer.elementhandle.press.md).</p> | | [type(text, options)](./puppeteer.elementhandle.type.md) | | <p>Focuses the element, and then sends a <code>keydown</code>, <code>keypress</code>/<code>input</code>, and <code>keyup</code> event for each character in the text.</p><p>To press a special key, like <code>Control</code> or <code>ArrowDown</code>, use [ElementHandle.press()](./puppeteer.elementhandle.press.md).</p> |
| [uploadFile(this, filePaths)](./puppeteer.elementhandle.uploadfile.md) | | This method expects <code>elementHandle</code> to point to an [input element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input). | | [uploadFile(this, paths)](./puppeteer.elementhandle.uploadfile.md) | | Sets the value of an [input element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input) to the given file paths. |
| [waitForSelector(selector, options)](./puppeteer.elementhandle.waitforselector.md) | | <p>Wait for an element matching the given selector to appear in the current element.</p><p>Unlike [Frame.waitForSelector()](./puppeteer.frame.waitforselector.md), this method does not work across navigations or if the element is detached from DOM.</p> | | [waitForSelector(selector, options)](./puppeteer.elementhandle.waitforselector.md) | | <p>Wait for an element matching the given selector to appear in the current element.</p><p>Unlike [Frame.waitForSelector()](./puppeteer.frame.waitforselector.md), this method does not work across navigations or if the element is detached from DOM.</p> |
| [waitForXPath(xpath, options)](./puppeteer.elementhandle.waitforxpath.md) | | | | [waitForXPath(xpath, options)](./puppeteer.elementhandle.waitforxpath.md) | | |

16
docs/api/puppeteer.elementhandle.uploadfile.md
View File

@ -4,7 +4,7 @@ sidebar_label: ElementHandle.uploadFile
# ElementHandle.uploadFile() method # ElementHandle.uploadFile() method
This method expects `elementHandle` to point to an [input element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input). Sets the value of an [input element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input) to the given file paths.
#### Signature: #### Signature:
@ -12,18 +12,22 @@ This method expects `elementHandle` to point to an [input element](https://devel
class ElementHandle { class ElementHandle {
uploadFile( uploadFile(
this: ElementHandle<HTMLInputElement>, this: ElementHandle<HTMLInputElement>,
...filePaths: string[] ...paths: string[]
): Promise<void>; ): Promise<void>;
} }
``` ```
## Parameters ## Parameters
| Parameter | Type | Description | | Parameter | Type | Description |
| --------- | --------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | --------- | --------------------------------------------------------------------- | ----------- |
| this | [ElementHandle](./puppeteer.elementhandle.md)&lt;HTMLInputElement&gt; | | | this | [ElementHandle](./puppeteer.elementhandle.md)&lt;HTMLInputElement&gt; | |
| filePaths | string\[\] | Sets the value of the file input to these paths. If a path is relative, then it is resolved against the [current working directory](https://nodejs.org/api/process.html#process_process_cwd). Note for locals script connecting to remote chrome environments, paths must be absolute. | | paths | string\[\] | |
**Returns:** **Returns:**
Promise&lt;void&gt; Promise&lt;void&gt;
## Remarks
This will not validate whether the file paths exists. Also, if a path is relative, then it is resolved against the [current working directory](https://nodejs.org/api/process.html#process_process_cwd). For locals script connecting to remote chrome environments, paths must be absolute.

14
docs/api/puppeteer.filechooser.accept.md
View File

@ -4,22 +4,26 @@ sidebar_label: FileChooser.accept
# FileChooser.accept() method # FileChooser.accept() method
Accept the file chooser request with given paths. Accept the file chooser request with the given file paths.
#### Signature: #### Signature:
```typescript ```typescript
class FileChooser { class FileChooser {
accept(filePaths: string[]): Promise<void>; accept(paths: string[]): Promise<void>;
} }
``` ```
## Parameters ## Parameters
| Parameter | Type | Description | | Parameter | Type | Description |
| --------- | ---------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | --------- | ---------- | ----------- |
| filePaths | string\[\] | If some of the <code>filePaths</code> are relative paths, then they are resolved relative to the [current working directory](https://nodejs.org/api/process.html#process_process_cwd). | | paths | string\[\] | |
**Returns:** **Returns:**
Promise&lt;void&gt; Promise&lt;void&gt;
## Remarks
This will not validate whether the file paths exists. Also, if a path is relative, then it is resolved against the [current working directory](https://nodejs.org/api/process.html#process_process_cwd). For locals script connecting to remote chrome environments, paths must be absolute.

10
docs/api/puppeteer.filechooser.md
View File

@ -32,8 +32,8 @@ await fileChooser.accept(['/tmp/myfile.pdf']);
## Methods ## Methods
| Method | Modifiers | Description | | Method | Modifiers | Description |
| ------------------------------------------------------ | --------- | --------------------------------------------------------------------------------------------------------------------------------------------- | | ----------------------------------------------------- | --------- | --------------------------------------------------------------------------------------------------------------------------------------------- |
| [accept(filePaths)](./puppeteer.filechooser.accept.md) | | Accept the file chooser request with given paths. | | [accept(paths)](./puppeteer.filechooser.accept.md) | | Accept the file chooser request with the given file paths. |
| [cancel()](./puppeteer.filechooser.cancel.md) | | Closes the file chooser without selecting any files. | | [cancel()](./puppeteer.filechooser.cancel.md) | | Closes the file chooser without selecting any files. |
| [isMultiple()](./puppeteer.filechooser.ismultiple.md) | | Whether file chooser allow for [multiple](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#attr-multiple) file selection. | | [isMultiple()](./puppeteer.filechooser.ismultiple.md) | | Whether file chooser allow for [multiple](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#attr-multiple) file selection. |

15
packages/puppeteer-core/src/api/ElementHandle.ts
View File

@ -702,18 +702,19 @@ export class ElementHandle<
} }
/** /**
* This method expects `elementHandle` to point to an * Sets the value of an
* {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input | input element}. * {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input | input element}
* to the given file paths.
* *
* @param filePaths - Sets the value of the file input to these paths. * @remarks This will not validate whether the file paths exists. Also, if a
* If a path is relative, then it is resolved against the * path is relative, then it is resolved against the
* {@link https://nodejs.org/api/process.html#process_process_cwd | current working directory}. * {@link https://nodejs.org/api/process.html#process_process_cwd | current working directory}.
* Note for locals script connecting to remote chrome environments, * For locals script connecting to remote chrome environments, paths must be
* paths must be absolute. * absolute.
*/ */
async uploadFile( async uploadFile(
this: ElementHandle<HTMLInputElement>, this: ElementHandle<HTMLInputElement>,
...filePaths: string[] ...paths: string[]
): Promise<void>; ): Promise<void>;
async uploadFile(this: ElementHandle<HTMLInputElement>): Promise<void> { async uploadFile(this: ElementHandle<HTMLInputElement>): Promise<void> {
throw new Error('Not implemented'); throw new Error('Not implemented');

12
packages/puppeteer-core/src/common/FileChooser.ts
View File

@ -67,19 +67,21 @@ export class FileChooser {
} }
/** /**
* Accept the file chooser request with given paths. * Accept the file chooser request with the given file paths.
* *
* @param filePaths - If some of the `filePaths` are relative paths, then * @remarks This will not validate whether the file paths exists. Also, if a
* they are resolved relative to the * path is relative, then it is resolved against the
* {@link https://nodejs.org/api/process.html#process_process_cwd | current working directory}. * {@link https://nodejs.org/api/process.html#process_process_cwd | current working directory}.
* For locals script connecting to remote chrome environments, paths must be
* absolute.
*/ */
async accept(filePaths: string[]): Promise<void> { async accept(paths: string[]): Promise<void> {
assert( assert(
!this.#handled, !this.#handled,
'Cannot accept FileChooser which is already handled!' 'Cannot accept FileChooser which is already handled!'
); );
this.#handled = true; this.#handled = true;
await this.#element.uploadFile(...filePaths); await this.#element.uploadFile(...paths);
} }
/** /**