use playwright.local

docs/src/api/params.md

@@ -529,6 +529,11 @@ An array of client certificates to be used. Each certificate object must have `c
 Using Client Certificates in combination with Proxy Servers is not supported.
 :::
 
+:::note
+When using WebKit on macOS, accessing `localhost` might not work as expected.
+Instead, use `playwright.local` as the hostname.
+:::
+
 ## context-option-useragent
 - `userAgent` <[string]>
 

packages/playwright-core/src/server/socksClientCertificatesInterceptor.ts

@@ -21,7 +21,7 @@ import fs from 'fs';
 import tls from 'tls';
 import stream from 'stream';
 import { createSocket } from '../utils/happy-eyeballs';
-import { globToRegex, isUnderTest } from '../utils';
+import { globToRegex } from '../utils';
 import type { SocksSocketClosedPayload, SocksSocketDataPayload, SocksSocketRequestedPayload } from '../common/socksProxy';
 import { SocksProxy } from '../common/socksProxy';
 import type * as channels from '@protocol/channels';
@@ -30,7 +30,7 @@ class SocksConnectionDuplex extends stream.Duplex {
   constructor(private readonly writeCallback: (data: Buffer) => void) {
     super();
   }
-  override _read(): void {}
+  override _read(): void { }
   override _write(chunk: Buffer, encoding: BufferEncoding, callback: (error?: Error | null | undefined) => void): void {
     this.writeCallback(chunk);
     callback();
@@ -56,7 +56,7 @@ class SocksProxyConnection {
   }
 
   async connect() {
-    this.target = await createSocket(isUnderTest() ? 'localhost' : this.host, this.port);
+    this.target = await createSocket(this.host === 'local.playwright' ? 'localhost' : this.host, this.port);
     this.target.on('close', () => this.socksProxy._socksProxy.sendSocketEnd({ uid: this.uid }));
     this.target.on('error', error => this.socksProxy._socksProxy.sendSocketError({ uid: this.uid, error: error.message }));
     this.socksProxy._socksProxy.socketConnected({

packages/playwright-core/types/types.d.ts

@@ -13229,6 +13229,9 @@ export interface BrowserType<Unused = {}> {
      * URLs that the certificate is valid for.
      *
      * **NOTE** Using Client Certificates in combination with Proxy Servers is not supported.
+     *
+     * **NOTE** When using WebKit on macOS, accessing `localhost` might not work as expected. Instead, use
+     * `playwright.local` as the hostname.
      */
     clientCertificates?: Array<{
       /**
@@ -15639,6 +15642,9 @@ export interface APIRequest {
      * URLs that the certificate is valid for.
      *
      * **NOTE** Using Client Certificates in combination with Proxy Servers is not supported.
+     *
+     * **NOTE** When using WebKit on macOS, accessing `localhost` might not work as expected. Instead, use
+     * `playwright.local` as the hostname.
      */
     clientCertificates?: Array<{
       /**
@@ -16831,6 +16837,9 @@ export interface Browser extends EventEmitter {
      * URLs that the certificate is valid for.
      *
      * **NOTE** Using Client Certificates in combination with Proxy Servers is not supported.
+     *
+     * **NOTE** When using WebKit on macOS, accessing `localhost` might not work as expected. Instead, use
+     * `playwright.local` as the hostname.
      */
     clientCertificates?: Array<{
       /**
@@ -20304,6 +20313,9 @@ export interface BrowserContextOptions {
    * URLs that the certificate is valid for.
    *
    * **NOTE** Using Client Certificates in combination with Proxy Servers is not supported.
+   *
+   * **NOTE** When using WebKit on macOS, accessing `localhost` might not work as expected. Instead, use
+   * `playwright.local` as the hostname.
    */
   clientCertificates?: Array<{
     /**

packages/playwright/types/test.d.ts

@@ -5210,6 +5210,9 @@ export interface PlaywrightTestOptions {
    *
    * **NOTE** Using Client Certificates in combination with Proxy Servers is not supported.
    *
+   * **NOTE** When using WebKit on macOS, accessing `localhost` might not work as expected. Instead, use
+   * `playwright.local` as the hostname.
+   *
    * **Usage**
    *
    * ```js

tests/library/client-certificates.spec.ts

@@ -49,7 +49,7 @@ const test = base.extend<{ serverURL: string, serverURLRewrittenToLocalhost: str
   },
   serverURLRewrittenToLocalhost: async ({ serverURL, browserName }, use) => {
     const parsed = new URL(serverURL);
-    parsed.hostname = 'i-get-rewritten-to-localhost-on-the-server-side';
+    parsed.hostname = 'local.playwright';
     const shouldRewriteToLocalhost = browserName === 'webkit' && process.platform === 'darwin';
     await use(shouldRewriteToLocalhost ? parsed.toString() : serverURL);
   }