or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

Files

docs

browser-control.mdindex.mdmobile-device.mdnetwork-api.mdpage-interaction.mdtesting-framework.mdvisual-debugging.md

index.mddocs/

0

# Playwright

1

2

Playwright is a comprehensive framework for web testing and automation that enables cross-browser testing across Chromium, Firefox, and WebKit with a single API. It provides both a high-level testing framework (Playwright Test) and low-level automation capabilities, featuring headless execution support, reliable element interactions, automatic waiting mechanisms, and powerful debugging tools.

3

4

## Package Information

5

6

- **Package Name**: playwright

7

- **Package Type**: npm

8

- **Language**: TypeScript/JavaScript

9

- **Installation**: `npm install playwright`

10

11

## Core Imports

12

13

```typescript

14

import { chromium, firefox, webkit, devices } from 'playwright';

15

```

16

17

For testing framework:

18

19

```typescript

20

import { test, expect } from 'playwright/test';

21

```

22

23

CommonJS:

24

25

```javascript

26

const { chromium, firefox, webkit } = require('playwright');

27

const { test, expect } = require('playwright/test');

28

```

29

30

## Basic Usage

31

32

### Browser Automation

33

34

```typescript

35

import { chromium } from 'playwright';

36

37

(async () => {

38

const browser = await chromium.launch();

39

const context = await browser.newContext();

40

const page = await context.newPage();

41

42

await page.goto('https://example.com');

43

await page.click('button');

44

await page.fill('input[name="email"]', 'user@example.com');

45

await page.screenshot({ path: 'screenshot.png' });

46

47

await browser.close();

48

})();

49

```

50

51

### Testing Framework

52

53

```typescript

54

import { test, expect } from 'playwright/test';

55

56

test('basic test', async ({ page }) => {

57

await page.goto('https://example.com');

58

await expect(page.locator('h1')).toHaveText('Welcome');

59

await page.click('button');

60

await expect(page.locator('.result')).toBeVisible();

61

});

62

```

63

64

## Architecture

65

66

Playwright is structured around several key components:

67

68

- **Browser Types**: Entry points for launching different browsers (Chromium, Firefox, WebKit)

69

- **Browser Management**: Browser instances, contexts for isolation, and page management

70

- **Element Interaction**: Locators with auto-waiting, element handles, and input simulation

71

- **Network Control**: Request/response interception, API testing, and mocking capabilities

72

- **Testing Framework**: Full-featured test runner with fixtures, assertions, and reporting

73

- **Mobile & Desktop**: Device emulation, mobile testing, and Electron app automation

74

- **Debugging Tools**: Tracing, video recording, screenshots, and inspector integration

75

76

## Capabilities

77

78

### Browser Control

79

80

Core browser automation functionality for launching browsers, managing contexts, and controlling pages across Chromium, Firefox, and WebKit.

81

82

```typescript { .api }

83

const chromium: BrowserType;

84

const firefox: BrowserType;

85

const webkit: BrowserType;

86

87

interface BrowserType {

88

launch(options?: LaunchOptions): Promise<Browser>;

89

launchPersistentContext(userDataDir: string, options?: BrowserContextOptions & LaunchOptions): Promise<BrowserContext>;

90

connect(wsEndpoint: string, options?: ConnectOptions): Promise<Browser>;

91

}

92

```

93

94

[Browser Control](./browser-control.md)

95

96

### Page Interaction

97

98

Page navigation, element interaction, and content manipulation with automatic waiting and cross-frame support.

99

100

```typescript { .api }

101

interface Page {

102

goto(url: string, options?: PageGotoOptions): Promise<Response | null>;

103

locator(selector: string): Locator;

104

click(selector: string, options?: PageClickOptions): Promise<void>;

105

fill(selector: string, value: string, options?: PageFillOptions): Promise<void>;

106

screenshot(options?: PageScreenshotOptions): Promise<Buffer>;

107

}

108

109

interface Locator {

110

click(options?: LocatorClickOptions): Promise<void>;

111

fill(value: string, options?: LocatorFillOptions): Promise<void>;

112

textContent(): Promise<string | null>;

113

isVisible(): Promise<boolean>;

114

}

115

```

116

117

[Page Interaction](./page-interaction.md)

118

119

### Network & API Testing

120

121

HTTP request interception, response mocking, and API testing capabilities with full request/response control.

122

123

```typescript { .api }

124

const request: APIRequest;

125

126

interface APIRequestContext {

127

get(url: string, options?: APIRequestContextOptions): Promise<APIResponse>;

128

post(url: string, options?: APIRequestContextOptions): Promise<APIResponse>;

129

put(url: string, options?: APIRequestContextOptions): Promise<APIResponse>;

130

delete(url: string, options?: APIRequestContextOptions): Promise<APIResponse>;

131

}

132

133

interface Route {

134

fulfill(response: RouteResponse): Promise<void>;

135

abort(errorCode?: string): Promise<void>;

136

continue(overrides?: RouteContinueOptions): Promise<void>;

137

}

138

```

139

140

[Network & API Testing](./network-api.md)

141

142

### Testing Framework

143

144

Comprehensive test framework with fixtures for browser automation, parallel execution, and extensive assertion library.

145

146

```typescript { .api }

147

const test: TestType<PlaywrightTestArgs & PlaywrightTestOptions, PlaywrightWorkerArgs & PlaywrightWorkerOptions>;

148

const expect: Expect<{}>;

149

150

interface PlaywrightTestArgs {

151

page: Page;

152

context: BrowserContext;

153

}

154

155

interface PlaywrightWorkerArgs {

156

browser: Browser;

157

browserName: string;

158

playwright: typeof import('playwright-core');

159

}

160

161

function defineConfig(config: PlaywrightTestConfig): PlaywrightTestConfig;

162

```

163

164

[Testing Framework](./testing-framework.md)

165

166

### Mobile & Device Testing

167

168

Mobile browser emulation, device-specific testing, and Android automation for comprehensive cross-platform testing.

169

170

```typescript { .api }

171

const devices: Devices;

172

const _android: Android;

173

174

interface Devices {

175

[key: string]: DeviceDescriptor;

176

}

177

178

interface DeviceDescriptor {

179

userAgent: string;

180

viewport: ViewportSize;

181

deviceScaleFactor: number;

182

isMobile: boolean;

183

hasTouch: boolean;

184

}

185

186

interface Android {

187

devices(): Promise<AndroidDevice[]>;

188

connect(wsEndpoint: string): Promise<AndroidDevice>;

189

}

190

```

191

192

[Mobile & Device Testing](./mobile-device.md)

193

194

### Visual Testing & Debugging

195

196

Screenshot comparison, video recording, tracing, and debugging tools for test development and maintenance.

197

198

```typescript { .api }

199

interface Page {

200

screenshot(options?: PageScreenshotOptions): Promise<Buffer>;

201

}

202

203

interface Tracing {

204

start(options?: TracingStartOptions): Promise<void>;

205

stop(options?: TracingStopOptions): Promise<void>;

206

}

207

208

interface Video {

209

path(): Promise<string>;

210

delete(): Promise<void>;

211

}

212

```

213

214

[Visual Testing & Debugging](./visual-debugging.md)

215

216

## Types

217

218

### Core Configuration Types

219

220

```typescript { .api }

221

interface LaunchOptions {

222

headless?: boolean;

223

executablePath?: string;

224

args?: string[];

225

ignoreDefaultArgs?: boolean | string[];

226

proxy?: ProxySettings;

227

downloadsPath?: string;

228

chromiumSandbox?: boolean;

229

}

230

231

interface BrowserContextOptions {

232

viewport?: ViewportSize | null;

233

userAgent?: string;

234

locale?: string;

235

timezoneId?: string;

236

geolocation?: Geolocation;

237

permissions?: string[];

238

httpCredentials?: HTTPCredentials;

239

offline?: boolean;

240

ignoreHTTPSErrors?: boolean;

241

}

242

243

interface ViewportSize {

244

width: number;

245

height: number;

246

}

247

248

interface Geolocation {

249

latitude: number;

250

longitude: number;

251

accuracy?: number;

252

}

253

254

interface HTTPCredentials {

255

username: string;

256

password: string;

257

}

258

```