Using Kameleo with Playwright framework

  • Created

When you are working with Kameleo and Playwright:

  1. You will use Kameleo Local API to manage your virtual browser profiles and launch Kameleo's built-in browsers.
  2. You will use a Playwright client library to drive the browser using a modified version of Chrome DevTools Protocol.

Automate any browsing activity with Playwright. We'll help with keeping your scripts undetected by the sites you're visiting so that they won't see automation tools in use. Let's see how.

Before reading this article, we recommend reading the Getting started with Kameleo Automation article.

Known limitations

  • Do not use multiple browser contexts when working with Playwright, as it can cause unexpected behavior. If you would like to use several contexts, please utilize Kameleo's virtual browser profiles.
  • Do not open any incognito window as Kameleo is not yet fully functional in incognito mode.

Best practices

Do not use any other browser fingerprint modifier tool besides Kameleo (such as playwright-extra-plugin-stealth, Canvas Fingerprint Defender, etc.) because those tools may interfere with Kameleo's ability to spoof correctly.

Install Playwright

  • To work with Playwright, you need to install its official library.

    npm i playwright
  • To work with Playwright, you need to install its official library.

    Install-Package Microsoft.Playwright
  • To work with Playwright, you need to install its official library.

    pip install playwright

Connect Playwright to a Kameleo profile

  1. Follow this guide for starting a profile from your script. Once the profile is up and running, you can move on to the next step to control it with Puppeteer commands.
  2. You need to connect to the browser through a WebSocket URL through the Kameleo.CLI component's /playwright/{profileId} endpoint. It is a little different for Firefox and for Chromium-based browsers.

    Chromium-based browsers

    • const playwright = require('playwright');
      
      const browserWSEndpoint = `ws://localhost:${kameleoPort}/playwright/${profile.id}`;
      const browser = await playwright.chromium.connectOverCDP(browserWSEndpoint);
    • using Microsoft.Playwright;
      
      var browserWsEndpoint = $"ws://localhost:{KameleoPort}/playwright/{profile.Id}";
      var playwright = await Playwright.CreateAsync();
      var browser = await playwright.Chromium.ConnectOverCDPAsync(browserWsEndpoint);
    • from playwright.sync_api import sync_playwright
      
      browser_ws_endpoint = f'ws://localhost:{kameleo_port}/playwright/{profile.id}'
      with sync_playwright() as playwright:
        browser = playwright.chromium.connect_over_cdp(endpoint_url=browser_ws_endpoint)

    Firefox

    The Playwright framework is not designed to connect to already running browsers. To overcome this limitation, a tool bundled with Kameleo, named pw-bridge.exe will bridge the communication gap between the running Firefox instance and this playwright script.

    • const playwright = require('playwright');
      
      const browserWSEndpoint = `ws://localhost:${kameleoPort}/playwright/${profile.id}`;
      const browser = await playwright.firefox.launch({
        executablePath: '<PATH_TO_KAMELEO_FOLDER>\\pw-bridge.exe',
        args: [`-target ${browserWSEndpoint}`],
      });
    • using Microsoft.Playwright;
      
      var browserWsEndpoint = $"ws://localhost:{KameleoPort}/playwright/{profile.Id}";
      var playwright = await Playwright.CreateAsync();
        var browser = await playwright.Firefox.LaunchAsync(new BrowserTypeLaunchOptions
        {
          ExecutablePath = "<PATH_TO_KAMELEO_FOLDER>\\pw-bridge.exe",
          Args = new List<string> { $"-target {browserWsEndpoint}" },
        });
    • from playwright.sync_api import sync_playwright
      
      browser_ws_endpoint = f'ws://localhost:{kameleo_port}/playwright/{profile.id}'
      with sync_playwright() as playwright:
        browser = playwright.firefox.launch(
          executable_path='<PATH_TO_KAMELEO_FOLDER>\\pw-bridge.exe',
          args=[f'-target {browser_ws_endpoint}'])
  3. We recommend that you always work in the default browser context.

    Chromium-based browers

    • const context = browser.contexts()[0];
      const page = await context.newPage();
    • var context = browser.Contexts[0];
      var page = await context.NewPageAsync();
    • context = browser.contexts[0]
      page = context.new_page()

    Firefox

    Kameleo will open the new page in the default browser context.

    • const page = await browser.newPage();
    • var page = await browser.NewPageAsync();
    • page = browser.new_page()
  4. Then you can use any Playwright command to drive the browser, for example:
    • await page.goto('https://google.com');
    • webdriver.Navigate().GoToUrl("https://google.com");
    • driver.get('https://google.com')
  5. Make sure to stop the browser and save the profile to a .kameleo file, so you can load it later. It's also essential to remove the profile from Kameleo once you don't need it anymore. This way, you can keep your resource usage low.
    • await client.stopProfile(profile.id);
      await client.saveProfile(profile.id, { body: { path: `${__dirname}\\test.kameleo` } });
      await client.deleteProfile(profile.id);
    • await client.StopProfileAsync(profile.Id);
      await client.SaveProfileAsync(profile.Id, new SaveProfileRequest(
        Path.Combine(Environment.CurrentDirectory,"test.kameleo")));
      await client.DeleteProfileAsync(profile.Id);
    • client.stop_profile(profile.id)
      path = f'{os.path.dirname(os.path.realpath(__file__))}\\test.kameleo'
      result = client.save_profile(profile.id, body=SaveProfileRequest(path=path))
      client.delete_profile(profile.id);

If you want to see the full example code, click any of the links below:

Chromium-based:

Firefox:

Was this article helpful?

0 out of 0 found this helpful