> [!WARNING]
> [Zyte API](../../zyte-api/get-started.md#zyte-api) is replacing Smart Proxy Manager. It is
> no longer possible to sign up to Smart Proxy Manager. If you are an
> existing Smart Proxy Manager user, see spm-migrate.

# Using Smart Proxy Manager with Playwright

> [!WARNING]
> For the code below to work you must first [install the Zyte
> CA certificate](../../misc/ca.md#ca).

> [!NOTE]
> Playwright requires [Node.js](https://nodejs.org/en/download/)
> and [npm](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm) installed and an active Smart Proxy Manager account. [Log in here](https://app.zyte.com/account/login).

> [!NOTE]
> All the code in this documentation has been tested with Node.js v14.15.1 and playwright 1.15.0.

## Option 1 - Plugin for Playwright-Extra

Check out details [here](https://github.com/zytedata/zyte-smartproxy-plugin).

## Option 2 - Zyte SmartProxy Playwright

### Installation

Download and install [Zyte SmartProxy Playwright](https://www.npmjs.com/package/zyte-smartproxy-playwright):

```
$ npm install zyte-smartproxy-playwright
```

### Sample script

Zyte SmartProxy Playwright is a client library that provides Zyte Smart Proxy Manager related functionalities over
Playwright.

1. In order to run the sample code present below save it in a file named `sample.js`:

```javascript
const { chromium } = require('zyte-smartproxy-playwright'); // Or 'firefox' or 'webkit'

(async () => {
    const browser = await chromium.launch({
        spm_apikey: '<Smart Proxy Manager API KEY>',
        headless: false,
    });
    console.log('Before new page');
    const page = await browser.newPage({ignoreHTTPSErrors: true});

    console.log('Opening page ...');
    try {
        await page.goto('https://toscrape.com/', {timeout: 180000});
    } catch(err) {
        console.log(err);
    }

    console.log('Taking a screenshot ...');
    await page.screenshot({path: 'screenshot.png'});
    await browser.close();
})();
```

1. Now run the sample code using Node:

```bash
node sample.js
```

To know more about what you can do with Zyte SmartProxy Playwright, check out the
[API Documentation](https://github.com/zytedata/zyte-smartproxy-playwright#api).

## Option 3 - Zyte SmartProxy Headless Proxy

### Installation

Setup the Zyte SmartProxy (formerly Crawlera) Headless Proxy as described in spm-headless.

Download and install [Playwright](https://www.npmjs.com/package/playwright):

```
$ npm install playwright
```

### Sample script

Here is a sample script you can use to test the integration of Playwright with
Smart Proxy Manager, once you have installed the Headless Proxy.

```javascript
const playwright = require('playwright');

async function main() {
    var browserFirefox = await playwright.firefox.launch({
        proxy: {server: "localhost:3128"}
    });
    var url = "https://toscrape.com/"
    const page = await browserFirefox.newPage({ignoreHTTPSErrors: true});
    await page.goto(url);
    await page.screenshot({path: 'screenshot.png', fullPage: true});
    await browserFirefox.close();
};

main();
```