Interface Browser

  • extends: [EventEmitter]

A Browser is created via browserType.launch([options]). An example of using a Browser to create a Page:

const { firefox } = require('playwright');  // Or 'chromium' or 'webkit'.

(async () => {
  const browser = await firefox.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');
  await browser.close();
})();

Hierarchy

Methods

[captureRejectionSymbol]? addListener browserType close contexts emit eventNames getMaxListeners isConnected listenerCount listeners newBrowserCDPSession newContext newPage off on once prependListener prependOnceListener rawListeners removeAllListeners removeListener setMaxListeners startTracing stopTracing version

Methods

Optional [captureRejectionSymbol]

  • [captureRejectionSymbol]<K>(error, event, ...args): void

  • Type Parameters

    • K

    Parameters

    • error: Error
    • event: string | symbol
    • Rest ...args: AnyRest
      Rest

    Returns void

addListener

  • Emitted when Browser gets disconnected from the browser application. This might happen because of one of the following:

    Parameters

    • event: "disconnected"
    • listener: ((browser) => any)
        • (browser): any

        • Parameters

          Returns any

    Returns Browser

browserType

  • Get the browser type (chromium, firefox or webkit) that the browser belongs to.

    Returns BrowserType<{}>

close

  • In case this browser is obtained using browserType.launch([options]), closes the browser and all of its pages (if any were opened).

    In case this browser is connected to, clears all created contexts belonging to this browser and disconnects from the browser server.

    NOTE This is similar to force quitting the browser. Therefore, you should call browserContext.close([options]) on any BrowserContext's you explicitly created earlier with browser.newContext([options]) before calling browser.close([options]).

    The Browser object itself is considered to be disposed and cannot be used anymore.

    Parameters

    • Optional options: {
          reason?: string;
      }
      Optional
      • Optional reason?: string

        The reason to be reported to the operations interrupted by the browser closure.

    Returns Promise<void>

contexts

  • Returns an array of all open browser contexts. In a newly created browser, this will return zero browser contexts.

    Usage

    const browser = await pw.webkit.launch();
    console.log(browser.contexts().length); // prints `0`

    const context = await browser.newContext();
    console.log(browser.contexts().length); // prints `1`

    Returns BrowserContext[]

emit

  • Synchronously calls each of the listeners registered for the event namedeventName, in the order they were registered, passing the supplied arguments to each.

    Returns true if the event had listeners, false otherwise.

    import EventEmitter from 'node:events';
    const myEmitter = new EventEmitter();

    // First listener
    myEmitter.on('event', function firstListener() {
      console.log('Helloooo! first listener');
    });
    // Second listener
    myEmitter.on('event', function secondListener(arg1, arg2) {
      console.log(`event with parameters ${arg1}, ${arg2} in second listener`);
    });
    // Third listener
    myEmitter.on('event', function thirdListener(...args) {
      const parameters = args.join(', ');
      console.log(`event with parameters ${parameters} in third listener`);
    });

    console.log(myEmitter.listeners('event'));

    myEmitter.emit('event', 1, 2, 3, 4, 5);

    // Prints:
    // [
    //   [Function: firstListener],
    //   [Function: secondListener],
    //   [Function: thirdListener]
    // ]
    // Helloooo! first listener
    // event with parameters 1, 2 in second listener
    // event with parameters 1, 2, 3, 4, 5 in third listener

    Type Parameters

    • K

    Parameters

    • eventName: string | symbol
    • Rest ...args: AnyRest
      Rest

    Returns boolean

    Since

    v0.1.26

eventNames

  • Returns an array listing the events for which the emitter has registered listeners. The values in the array are strings or Symbols.

    import EventEmitter from 'node:events';
    const myEE = new EventEmitter();
    myEE.on('foo', () => {});
    myEE.on('bar', () => {});

    const sym = Symbol('symbol');
    myEE.on(sym, () => {});

    console.log(myEE.eventNames());
    // Prints: [ 'foo', 'bar', Symbol(symbol) ]

    Returns (string | symbol)[]

    Since

    v6.0.0

getMaxListeners

  • Returns the current max listener value for the EventEmitter which is either set by emitter.setMaxListeners(n) or defaults to defaultMaxListeners.

    Returns number

    Since

    v1.0.0

isConnected

  • Indicates that the browser is connected.

    Returns boolean

listenerCount

  • Returns the number of listeners listening to the event named eventName.

    Type Parameters

    • K

    Parameters

    • eventName: string | symbol

      The name of the event being listened for

    • Optional listener: Function
      Optional

    Returns number

    Since

    v3.2.0

listeners

  • Returns a copy of the array of listeners for the event named eventName.

    server.on('connection', (stream) => {
      console.log('someone connected!');
    });
    console.log(util.inspect(server.listeners('connection')));
    // Prints: [ [Function] ]

    Type Parameters

    • K

    Parameters

    • eventName: string | symbol

    Returns Function[]

    Since

    v0.1.26

newBrowserCDPSession

  • NOTE CDP Sessions are only supported on Chromium-based browsers.

    Returns the newly created browser session.

    Returns Promise<CDPSession>

newContext

  • Creates a new browser context. It won't share cookies/cache with other browser contexts.

    NOTE If directly using this method to create BrowserContexts, it is best practice to explicitly close the returned context via browserContext.close([options]) when your code is done with the BrowserContext, and before calling browser.close([options]). This will ensure the context is closed gracefully and any artifacts—like HARs and videos—are fully flushed and saved.

    Usage

    (async () => {
      const browser = await playwright.firefox.launch();  // Or 'chromium' or 'webkit'.
      // Create a new incognito browser context.
      const context = await browser.newContext();
      // Create a new page in a pristine context.
      const page = await context.newPage();
      await page.goto('https://example.com');

      // Gracefully close up everything
      await context.close();
      await browser.close();
    })();

    Parameters

    Returns Promise<BrowserContext>

newPage

  • Creates a new page in a new browser context. Closing this page will close the context as well.

    This is a convenience API that should only be used for the single-page scenarios and short snippets. Production code and testing frameworks should explicitly create browser.newContext([options]) followed by the browserContext.newPage() to control their exact life times.

    Parameters

    • Optional options: {
          acceptDownloads?: boolean;
          baseURL?: string;
          bypassCSP?: boolean;
          colorScheme?: "light" | "dark" | "no-preference";
          deviceScaleFactor?: number;
          extraHTTPHeaders?: {
              [key: string]: string;
          };
          forcedColors?: "active" | "none";
          geolocation?: {
              accuracy?: number;
              latitude: number;
              longitude: number;
          };
          hasTouch?: boolean;
          httpCredentials?: {
              origin?: string;
              password: string;
              username: string;
          };
          ignoreHTTPSErrors?: boolean;
          isMobile?: boolean;
          javaScriptEnabled?: boolean;
          locale?: string;
          logger?: Logger;
          offline?: boolean;
          permissions?: string[];
          proxy?: {
              bypass?: string;
              password?: string;
              server: string;
              username?: string;
          };
          recordHar?: {
              content?: "omit" | "embed" | "attach";
              mode?: "full" | "minimal";
              omitContent?: boolean;
              path: string;
              urlFilter?: string | RegExp;
          };
          recordVideo?: {
              dir: string;
              size?: {
                  height: number;
                  width: number;
              };
          };
          reducedMotion?: "reduce" | "no-preference";
          screen?: {
              height: number;
              width: number;
          };
          serviceWorkers?: "allow" | "block";
          storageState?: string | {
              cookies: {
                  domain: string;
                  expires: number;
                  httpOnly: boolean;
                  name: string;
                  path: string;
                  sameSite: "Strict" | "Lax" | "None";
                  secure: boolean;
                  value: string;
              }[];
              origins: {
                  localStorage: {
                      name: string;
                      value: string;
                  }[];
                  origin: string;
              }[];
          };
          strictSelectors?: boolean;
          timezoneId?: string;
          userAgent?: string;
          videoSize?: {
              height: number;
              width: number;
          };
          videosPath?: string;
          viewport?: {
              height: number;
              width: number;
          };
      }
      Optional
      • Optional acceptDownloads?: boolean

        Whether to automatically download all the attachments. Defaults to true where all the downloads are accepted.

      • Optional baseURL?: string

        When using page.goto(url[, options]), page.route(url, handler[, options]), page.waitForURL(url[, options]), page.waitForRequest(urlOrPredicate[, options]), or page.waitForResponse(urlOrPredicate[, options]) it takes the base URL in consideration by using the URL() constructor for building the corresponding URL. Unset by default. Examples:

        • baseURL: http://localhost:3000 and navigating to /bar.html results in http://localhost:3000/bar.html
        • baseURL: http://localhost:3000/foo/ and navigating to ./bar.html results in http://localhost:3000/foo/bar.html
        • baseURL: http://localhost:3000/foo (without trailing slash) and navigating to ./bar.html results in http://localhost:3000/bar.html
      • Optional bypassCSP?: boolean

        Toggles bypassing page's Content-Security-Policy. Defaults to false.

      • Optional colorScheme?: "light" | "dark" | "no-preference"

        Emulates 'prefers-colors-scheme' media feature, supported values are 'light', 'dark', 'no-preference'. See page.emulateMedia([options]) for more details. Passing null resets emulation to system defaults. Defaults to 'light'.

      • Optional deviceScaleFactor?: number

        Specify device scale factor (can be thought of as dpr). Defaults to 1. Learn more about emulating devices with device scale factor.

      • Optional extraHTTPHeaders?: {
            [key: string]: string;
        }

        An object containing additional HTTP headers to be sent with every request. Defaults to none.

        • [key: string]: string
      • Optional forcedColors?: "active" | "none"

        Emulates 'forced-colors' media feature, supported values are 'active', 'none'. See page.emulateMedia([options]) for more details. Passing null resets emulation to system defaults. Defaults to 'none'.

      • Optional geolocation?: {
            accuracy?: number;
            latitude: number;
            longitude: number;
        }
        • Optional accuracy?: number

          Non-negative accuracy value. Defaults to 0.

        • latitude: number

          Latitude between -90 and 90.

        • longitude: number

          Longitude between -180 and 180.

      • Optional hasTouch?: boolean

        Specifies if viewport supports touch events. Defaults to false. Learn more about mobile emulation.

      • Optional httpCredentials?: {
            origin?: string;
            password: string;
            username: string;
        }

        Credentials for HTTP authentication. If no origin is specified, the username and password are sent to any servers upon unauthorized responses.

        • Optional origin?: string

          Restrain sending http credentials on specific origin (scheme://host:port).

        • password: string
        • username: string
      • Optional ignoreHTTPSErrors?: boolean

        Whether to ignore HTTPS errors when sending network requests. Defaults to false.

      • Optional isMobile?: boolean

        Whether the meta viewport tag is taken into account and touch events are enabled. isMobile is a part of device, so you don't actually need to set it manually. Defaults to false and is not supported in Firefox. Learn more about mobile emulation.

      • Optional javaScriptEnabled?: boolean

        Whether or not to enable JavaScript in the context. Defaults to true. Learn more about disabling JavaScript.

      • Optional locale?: string

        Specify user locale, for example en-GB, de-DE, etc. Locale will affect navigator.language value, Accept-Language request header value as well as number and date formatting rules. Defaults to the system default locale. Learn more about emulation in our emulation guide.

      • Optional logger?: Logger

        Logger sink for Playwright logging.

      • Optional offline?: boolean

        Whether to emulate network being offline. Defaults to false. Learn more about network emulation.

      • Optional permissions?: string[]

        A list of permissions to grant to all pages in this context. See browserContext.grantPermissions(permissions[, options]) for more details. Defaults to none.

      • Optional proxy?: {
            bypass?: string;
            password?: string;
            server: string;
            username?: string;
        }

        Network proxy settings to use with this context. Defaults to none.

        NOTE For Chromium on Windows the browser needs to be launched with the global proxy for this option to work. If all contexts override the proxy, global proxy will be never used and can be any string, for example launch({ proxy: { server: 'http://per-context' } }).

        • Optional bypass?: string

          Optional comma-separated domains to bypass proxy, for example ".com, chromium.org, .domain.com".

        • Optional password?: string

          Optional password to use if HTTP proxy requires authentication.

        • server: string

          Proxy to be used for all requests. HTTP and SOCKS proxies are supported, for example http://myproxy.com:3128 or socks5://myproxy.com:3128. Short form myproxy.com:3128 is considered an HTTP proxy.

        • Optional username?: string

          Optional username to use if HTTP proxy requires authentication.

      • Optional recordHar?: {
            content?: "omit" | "embed" | "attach";
            mode?: "full" | "minimal";
            omitContent?: boolean;
            path: string;
            urlFilter?: string | RegExp;
        }

        Enables HAR recording for all pages into recordHar.path file. If not specified, the HAR is not recorded. Make sure to await browserContext.close([options]) for the HAR to be saved.

        • Optional content?: "omit" | "embed" | "attach"

          Optional setting to control resource content management. If omit is specified, content is not persisted. If attach is specified, resources are persisted as separate files or entries in the ZIP archive. If embed is specified, content is stored inline the HAR file as per HAR specification. Defaults to attach for .zip output files and to embed for all other file extensions.

        • Optional mode?: "full" | "minimal"

          When set to minimal, only record information necessary for routing from HAR. This omits sizes, timing, page, cookies, security and other types of HAR information that are not used when replaying from HAR. Defaults to full.

        • Optional omitContent?: boolean

          Optional setting to control whether to omit request content from the HAR. Defaults to false. Deprecated, use content policy instead.

        • path: string

          Path on the filesystem to write the HAR file to. If the file name ends with .zip, content: 'attach' is used by default.

        • Optional urlFilter?: string | RegExp

          A glob or regex pattern to filter requests that are stored in the HAR. When a baseURL via the context options was provided and the passed URL is a path, it gets merged via the new URL() constructor. Defaults to none.

      • Optional recordVideo?: {
            dir: string;
            size?: {
                height: number;
                width: number;
            };
        }

        Enables video recording for all pages into recordVideo.dir directory. If not specified videos are not recorded. Make sure to await browserContext.close([options]) for videos to be saved.

        • dir: string

          Path to the directory to put videos into.

        • Optional size?: {
              height: number;
              width: number;
          }

          Optional dimensions of the recorded videos. If not specified the size will be equal to viewport scaled down to fit into 800x800. If viewport is not configured explicitly the video size defaults to 800x450. Actual picture of each page will be scaled down if necessary to fit the specified size.

          • height: number

            Video frame height.

          • width: number

            Video frame width.

      • Optional reducedMotion?: "reduce" | "no-preference"

        Emulates 'prefers-reduced-motion' media feature, supported values are 'reduce', 'no-preference'. See page.emulateMedia([options]) for more details. Passing null resets emulation to system defaults. Defaults to 'no-preference'.

      • Optional screen?: {
            height: number;
            width: number;
        }

        Emulates consistent window screen size available inside web page via window.screen. Is only used when the viewport is set.

        • height: number

          page height in pixels.

        • width: number

          page width in pixels.

      • Optional serviceWorkers?: "allow" | "block"

        Whether to allow sites to register Service workers. Defaults to 'allow'.

        • 'allow': Service Workers can be registered.
        • 'block': Playwright will block all registration of Service Workers.
      • Optional storageState?: string | {
            cookies: {
                domain: string;
                expires: number;
                httpOnly: boolean;
                name: string;
                path: string;
                sameSite: "Strict" | "Lax" | "None";
                secure: boolean;
                value: string;
            }[];
            origins: {
                localStorage: {
                    name: string;
                    value: string;
                }[];
                origin: string;
            }[];
        }

        Learn more about storage state and auth.

        Populates context with given storage state. This option can be used to initialize context with logged-in information obtained via browserContext.storageState([options]).

      • Optional strictSelectors?: boolean

        If set to true, enables strict selectors mode for this context. In the strict selectors mode all operations on selectors that imply single target DOM element will throw when more than one element matches the selector. This option does not affect any Locator APIs (Locators are always strict). Defaults to false. See Locator to learn more about the strict mode.

      • Optional timezoneId?: string

        Changes the timezone of the context. See ICU's metaZones.txt for a list of supported timezone IDs. Defaults to the system timezone.

      • Optional userAgent?: string

        Specific user agent to use in this context.

      • Optional videoSize?: {
            height: number;
            width: number;
        }

        Deprecated

        Use recordVideo instead.

        • height: number

          Video frame height.

        • width: number

          Video frame width.

      • Optional videosPath?: string

        Deprecated

        Use recordVideo instead.

      • Optional viewport?: {
            height: number;
            width: number;
        }

        Emulates consistent viewport for each page. Defaults to an 1280x720 viewport. Use null to disable the consistent viewport emulation. Learn more about viewport emulation.

        NOTE The null value opts out from the default presets, makes viewport depend on the host window size defined by the operating system. It makes the execution of the tests non-deterministic.

        • height: number

          page height in pixels.

        • width: number

          page width in pixels.

    Returns Promise<Page>

off

  • Removes an event listener added by on or addListener.

    Parameters

    • event: "disconnected"
    • listener: ((browser) => any)
        • (browser): any

        • Parameters

          Returns any

    Returns Browser

on

  • Emitted when Browser gets disconnected from the browser application. This might happen because of one of the following:

    Parameters

    • event: "disconnected"
    • listener: ((browser) => any)
        • (browser): any

        • Parameters

          Returns any

    Returns Browser

once

  • Adds an event listener that will be automatically removed after it is triggered once. See addListener for more information about this event.

    Parameters

    • event: "disconnected"
    • listener: ((browser) => any)
        • (browser): any

        • Parameters

          Returns any

    Returns Browser

prependListener

  • Emitted when Browser gets disconnected from the browser application. This might happen because of one of the following:

    Parameters

    • event: "disconnected"
    • listener: ((browser) => any)
        • (browser): any

        • Parameters

          Returns any

    Returns Browser

prependOnceListener

  • Adds a one-timelistener function for the event named eventName to the_beginning_ of the listeners array. The next time eventName is triggered, this listener is removed, and then invoked.

    server.prependOnceListener('connection', (stream) => {
      console.log('Ah, we have our first user!');
    });

    Returns a reference to the EventEmitter, so that calls can be chained.

    Type Parameters

    • K

    Parameters

    • eventName: string | symbol

      The name of the event.

    • listener: ((...args) => void)

      The callback function

        • (...args): void

        • Parameters

          • Rest ...args: any[]
            Rest

          Returns void

    Returns Browser

    Since

    v6.0.0

rawListeners

  • Returns a copy of the array of listeners for the event named eventName, including any wrappers (such as those created by .once()).

    const emitter = new EventEmitter();
    emitter.once('log', () => console.log('log once'));

    // Returns a new Array with a function `onceWrapper` which has a property
    // `listener` which contains the original listener bound above
    const listeners = emitter.rawListeners('log');
    const logFnWrapper = listeners[0];

    // Logs "log once" to the console and does not unbind the `once` event
    logFnWrapper.listener();

    // Logs "log once" to the console and removes the listener
    logFnWrapper();

    emitter.on('log', () => console.log('log persistently'));
    // Will return a new Array with a single function bound by `.on()` above
    const newListeners = emitter.rawListeners('log');

    // Logs "log persistently" twice
    newListeners[0]();
    emitter.emit('log');

    Type Parameters

    • K

    Parameters

    • eventName: string | symbol

    Returns Function[]

    Since

    v9.4.0

removeAllListeners

  • Removes all listeners, or those of the specified eventName.

    It is bad practice to remove listeners added elsewhere in the code, particularly when the EventEmitter instance was created by some other component or module (e.g. sockets or file streams).

    Returns a reference to the EventEmitter, so that calls can be chained.

    Parameters

    • Optional event: string | symbol
      Optional

    Returns Browser

    Since

    v0.1.26

removeListener

  • Removes an event listener added by on or addListener.

    Parameters

    • event: "disconnected"
    • listener: ((browser) => any)
        • (browser): any

        • Parameters

          Returns any

    Returns Browser

setMaxListeners

  • By default EventEmitters will print a warning if more than 10 listeners are added for a particular event. This is a useful default that helps finding memory leaks. The emitter.setMaxListeners() method allows the limit to be modified for this specific EventEmitter instance. The value can be set toInfinity (or 0) to indicate an unlimited number of listeners.

    Returns a reference to the EventEmitter, so that calls can be chained.

    Parameters

    • n: number

    Returns Browser

    Since

    v0.3.5

startTracing

  • NOTE This API controls Chromium Tracing which is a low-level chromium-specific debugging tool. API to control Playwright Tracing could be found here.

    You can use browser.startTracing([page, options]) and browser.stopTracing() to create a trace file that can be opened in Chrome DevTools performance panel.

    Usage

    await browser.startTracing(page, { path: 'trace.json' });
    await page.goto('https://www.google.com');
    await browser.stopTracing();

    Parameters

    • Optional page: Page

      Optional, if specified, tracing includes screenshots of the given page.

      Optional
    • Optional options: {
          categories?: string[];
          path?: string;
          screenshots?: boolean;
      }
      Optional
      • Optional categories?: string[]

        specify custom categories to use instead of default.

      • Optional path?: string

        A path to write the trace file to.

      • Optional screenshots?: boolean

        captures screenshots in the trace.

    Returns Promise<void>

stopTracing

  • NOTE This API controls Chromium Tracing which is a low-level chromium-specific debugging tool. API to control Playwright Tracing could be found here.

    Returns the buffer with trace data.

    Returns Promise<Buffer>

version

  • Returns the browser version.

    Returns string

Settings

Member Visibility

Theme

On This Page

Generated using TypeDoc