puppeteer/new-docs/puppeteer.jshandle.evaluatehandle.md

<!-- Do not edit this file. It is automatically generated by API Documenter. -->

[Home](./index.md) &gt; [puppeteer](./puppeteer.md) &gt; [JSHandle](./puppeteer.jshandle.md) &gt; [evaluateHandle](./puppeteer.jshandle.evaluatehandle.md)

## JSHandle.evaluateHandle() method

This method passes this handle as the first argument to `pageFunction`<!-- -->.

<b>Signature:</b>

```typescript
evaluateHandle<HandleType extends JSHandle = JSHandle>(pageFunction: EvaluateHandleFn, ...args: SerializableOrJSHandle[]): Promise<HandleType>;
```

## Parameters

|  Parameter | Type | Description |
|  --- | --- | --- |
|  pageFunction | [EvaluateHandleFn](./puppeteer.evaluatehandlefn.md) |  |
|  args | [SerializableOrJSHandle](./puppeteer.serializableorjshandle.md)<!-- -->\[\] |  |

<b>Returns:</b>

Promise&lt;HandleType&gt;

## Remarks

The only difference between `jsHandle.evaluate` and `jsHandle.evaluateHandle` is that `jsHandle.evaluateHandle` returns an in-page object (JSHandle).

If the function passed to `jsHandle.evaluateHandle` returns a Promise, then `evaluateHandle.evaluateHandle` waits for the promise to resolve and returns its value.

See [Page.evaluateHandle()](./puppeteer.page.evaluatehandle.md) for more details.
chore: commit base new-docs (#5973) This adds the new docs that are generated by API Extractor via TSDoc. They are sparse because we do not yet use TSDoc in the codebase. This is the starting point and from here we can work through all the different classes and improve the documentation. 2020-06-04 14:56:45 +00:00			`<!-- Do not edit this file. It is automatically generated by API Documenter. -->`

			`[Home](./index.md) > [puppeteer](./puppeteer.md) > [JSHandle](./puppeteer.jshandle.md) > [evaluateHandle](./puppeteer.jshandle.evaluatehandle.md)`

			`## JSHandle.evaluateHandle() method`

docs(new): migrate ElementHandle to TSDoc (#6073) * docs(new): migrate ElementHandle to TSDoc Co-authored-by: Alex Rudenko <alexrudenko@chromium.org> 2020-06-22 15:21:57 +00:00			This method passes this handle as the first argument to `pageFunction`<!-- -->.

chore: commit base new-docs (#5973) This adds the new docs that are generated by API Extractor via TSDoc. They are sparse because we do not yet use TSDoc in the codebase. This is the starting point and from here we can work through all the different classes and improve the documentation. 2020-06-04 14:56:45 +00:00			`<b>Signature:</b>`

			```typescript
feat(types): add types for `$eval` (#6135) This pulls in the types (based on the DefinitelyTyped repo) for `page.$eval` (and the `$eval` method on other classes). The `$eval` method is quite hard to type due to the way we wrap and unwrap ElementHandles that are passed to / returned from the `pageFunction` that users provide. Longer term we can improve the types by providing type overloads as DefinitelyTyped does but I've deferred that for now (see the `TODO` in the code for more details). 2020-07-02 09:09:34 +00:00			`evaluateHandle<HandleType extends JSHandle = JSHandle>(pageFunction: EvaluateHandleFn, ...args: SerializableOrJSHandle[]): Promise<HandleType>;`
chore: commit base new-docs (#5973) This adds the new docs that are generated by API Extractor via TSDoc. They are sparse because we do not yet use TSDoc in the codebase. This is the starting point and from here we can work through all the different classes and improve the documentation. 2020-06-04 14:56:45 +00:00			```

			`## Parameters`

			`\| Parameter \| Type \| Description \|`
			`\| --- \| --- \| --- \|`
feat(types): add (and fix) `evaluateHandle` types (#6130) This change started as a small change to pull types from DefinitelyTyped over to Puppeteer for the `evaluateHandle` function but instead ended up also fixing what looks to be a long standing issue with our existing documentation. `evaluateHandle` can in fact return an `ElementHandle` rather than a `JSHandle`. Note that `ElementHandle` extends `JSHandle` so whilst the docs are technically correct (all ElementHandles are JSHandles) it's confusing because JSHandles don't have methods like `click` on them, but ElementHandles do. if you return something that is an HTML element: ``` const button = page.evaluateHandle(() => document.querySelector('button')); // this is an ElementHandle, not a JSHandle ``` Therefore I've updated the original docs and added a large explanation to the TSDoc for `page.evaluateHandle`. In TypeScript land we'll assume the function will return a `JSHandle` but you can tell TS otherwise via the generic argument, which can only be `JSHandle` (the default) or `ElementHandle`: ``` const button = page.evaluateHandle<ElementHandle>(() => document.querySelector('button')); ``` 2020-07-01 11:44:08 +00:00			`\| pageFunction \| [EvaluateHandleFn](./puppeteer.evaluatehandlefn.md) \| \|`
			`\| args \| [SerializableOrJSHandle](./puppeteer.serializableorjshandle.md)<!-- -->\[\] \| \|`
chore: commit base new-docs (#5973) This adds the new docs that are generated by API Extractor via TSDoc. They are sparse because we do not yet use TSDoc in the codebase. This is the starting point and from here we can work through all the different classes and improve the documentation. 2020-06-04 14:56:45 +00:00
			`<b>Returns:</b>`

feat(types): add (and fix) `evaluateHandle` types (#6130) This change started as a small change to pull types from DefinitelyTyped over to Puppeteer for the `evaluateHandle` function but instead ended up also fixing what looks to be a long standing issue with our existing documentation. `evaluateHandle` can in fact return an `ElementHandle` rather than a `JSHandle`. Note that `ElementHandle` extends `JSHandle` so whilst the docs are technically correct (all ElementHandles are JSHandles) it's confusing because JSHandles don't have methods like `click` on them, but ElementHandles do. if you return something that is an HTML element: ``` const button = page.evaluateHandle(() => document.querySelector('button')); // this is an ElementHandle, not a JSHandle ``` Therefore I've updated the original docs and added a large explanation to the TSDoc for `page.evaluateHandle`. In TypeScript land we'll assume the function will return a `JSHandle` but you can tell TS otherwise via the generic argument, which can only be `JSHandle` (the default) or `ElementHandle`: ``` const button = page.evaluateHandle<ElementHandle>(() => document.querySelector('button')); ``` 2020-07-01 11:44:08 +00:00			`Promise<HandleType>`
chore: commit base new-docs (#5973) This adds the new docs that are generated by API Extractor via TSDoc. They are sparse because we do not yet use TSDoc in the codebase. This is the starting point and from here we can work through all the different classes and improve the documentation. 2020-06-04 14:56:45 +00:00
docs(new): migrate ElementHandle to TSDoc (#6073) * docs(new): migrate ElementHandle to TSDoc Co-authored-by: Alex Rudenko <alexrudenko@chromium.org> 2020-06-22 15:21:57 +00:00			`## Remarks`

docs(new): migrate JSHandle docs to TSDoc (#6102) 2020-06-25 14:49:35 +00:00			The only difference between `jsHandle.evaluate` and `jsHandle.evaluateHandle` is that `jsHandle.evaluateHandle` returns an in-page object (JSHandle).
docs(new): migrate ElementHandle to TSDoc (#6073) * docs(new): migrate ElementHandle to TSDoc Co-authored-by: Alex Rudenko <alexrudenko@chromium.org> 2020-06-22 15:21:57 +00:00
docs(new): migrate JSHandle docs to TSDoc (#6102) 2020-06-25 14:49:35 +00:00			If the function passed to `jsHandle.evaluateHandle` returns a Promise, then `evaluateHandle.evaluateHandle` waits for the promise to resolve and returns its value.
docs(new): migrate ElementHandle to TSDoc (#6073) * docs(new): migrate ElementHandle to TSDoc Co-authored-by: Alex Rudenko <alexrudenko@chromium.org> 2020-06-22 15:21:57 +00:00
			`See [Page.evaluateHandle()](./puppeteer.page.evaluatehandle.md) for more details.`