feat: rename createWorkerFixture to createNetworkFixture (#8)

Author: kettanaito

README.md

@@ -13,7 +13,7 @@ await page.evaluate(() => {
   // functions from the `msw` package you want to use since
   // you cannot reference them in `page.evaluate` directly.
   const { worker, http, graphql } = window.msw
-  worker.use(...)
+  worker.use(...overrides)
 })
 ```
 
@@ -30,16 +30,16 @@ npm i msw @msw/playwright
 ```ts
 // playwright.setup.ts
 import { test as testBase } from '@playwright/test'
-import { createWorkerFixture, type WorkerFixture } from '@msw/playwright'
+import { createNetworkFixture, type NetworkFixture } from '@msw/playwright'
 import { handlers } from '../mocks/handlers.js'
 
 interface Fixtures {
-  worker: WorkerFixture
+  network: NetworkFixture
 }
 
 export const test = testBase.extend<Fixtures>({
-  // Create your worker fixture to access in tests.
-  worker: createWorkerFixture({
+  // Create a fixture that will control the network in your tests.
+  network: createNetworkFixture({
     initialHandlers: handlers,
   }),
 })
@@ -49,10 +49,10 @@ export const test = testBase.extend<Fixtures>({
 import { http, HttpResponse } from 'msw'
 import { test } from './playwright.setup.js'
 
-test('displays the user dashboard', async ({ worker, page }) => {
-  // Access and use the worker as you normally would!
+test('displays the user dashboard', async ({ network, page }) => {
+  // Access the network fixture and use it as the `setupWorker()` API.
   // No more disrupted context between processes.
-  worker.use(
+  network.use(
     http.get('/user', () => {
       return HttpResponse.json({
         id: 'abc-123',

src/index.ts

@@ -17,17 +17,36 @@ import {
   WebSocketServerConnectionProtocol,
 } from '@mswjs/interceptors/WebSocket'
 
-export interface CreateWorkerFixtureArgs {
+export interface CreateNetworkFixtureArgs {
   initialHandlers: Array<RequestHandler | WebSocketHandler>
 }
 
-export function createWorkerFixture(
-  args?: CreateWorkerFixtureArgs,
+/**
+ * Creates a fixture that controls the network in your tests.
+ *
+ * @note The returned fixture already has the `auto` option set to `true`.
+ *
+ * **Usage**
+ * ```ts
+ * import { test as testBase } from '@playwright/test'
+ * import { createNetworkFixture, type WorkerFixture } from '@msw/playwright'
+ *
+ * interface Fixtures {
+ *  network: WorkerFixture
+ * }
+ *
+ * export const test = testBase.extend<Fixtures>({
+ *   network: createNetworkFixture()
+ * })
+ * ```
+ */
+export function createNetworkFixture(
+  args?: CreateNetworkFixtureArgs,
   /** @todo `onUnhandledRequest`? */
-): [TestFixture<WorkerFixture, any>, { auto: boolean }] {
+): [TestFixture<NetworkFixture, any>, { auto: boolean }] {
   return [
     async ({ page }, use) => {
-      const worker = new WorkerFixture({
+      const worker = new NetworkFixture({
         page,
         initialHandlers: args?.initialHandlers || [],
       })
@@ -40,7 +59,7 @@ export function createWorkerFixture(
   ]
 }
 
-export class WorkerFixture extends SetupApi<LifeCycleEventsMap> {
+export class NetworkFixture extends SetupApi<LifeCycleEventsMap> {
   #page: Page
 
   constructor(args: {

tests/auto.test.ts

@@ -1,13 +1,13 @@
 import { test as testBase, expect } from '@playwright/test'
 import { http } from 'msw'
-import { createWorkerFixture, type WorkerFixture } from '../src/index.js'
+import { createNetworkFixture, type NetworkFixture } from '../src/index.js'
 
 interface Fixtures {
-  worker: WorkerFixture
+  worker: NetworkFixture
 }
 
 const test = testBase.extend<Fixtures>({
-  worker: createWorkerFixture({
+  worker: createNetworkFixture({
     initialHandlers: [
       http.get('*/resource', () => {
         return new Response('hello world')

tests/overrides.test.ts

@@ -1,13 +1,13 @@
 import { test as testBase, expect } from '@playwright/test'
 import { http } from 'msw'
-import { createWorkerFixture, type WorkerFixture } from '../src/index.js'
+import { createNetworkFixture, type NetworkFixture } from '../src/index.js'
 
 interface Fixtures {
-  worker: WorkerFixture
+  worker: NetworkFixture
 }
 
 const test = testBase.extend<Fixtures>({
-  worker: createWorkerFixture(),
+  worker: createNetworkFixture(),
 })
 
 test.beforeEach(({ worker }) => {

tests/requests.test.ts

@@ -1,13 +1,13 @@
 import { test as testBase, expect } from '@playwright/test'
 import { http } from 'msw'
-import { createWorkerFixture, type WorkerFixture } from '../src/index.js'
+import { createNetworkFixture, type NetworkFixture } from '../src/index.js'
 
 interface Fixtures {
-  worker: WorkerFixture
+  worker: NetworkFixture
 }
 
 const test = testBase.extend<Fixtures>({
-  worker: createWorkerFixture(),
+  worker: createNetworkFixture(),
 })
 
 test('intercepts a GET request', async ({ worker, page }) => {

tests/responses.test.ts

@@ -1,13 +1,13 @@
 import { test as testBase, expect } from '@playwright/test'
 import { http, HttpResponse } from 'msw'
-import { createWorkerFixture, type WorkerFixture } from '../src/index.js'
+import { createNetworkFixture, type NetworkFixture } from '../src/index.js'
 
 interface Fixtures {
-  worker: WorkerFixture
+  worker: NetworkFixture
 }
 
 const test = testBase.extend<Fixtures>({
-  worker: createWorkerFixture(),
+  worker: createNetworkFixture(),
 })
 
 test('mocks a response without any body', async ({ worker, page }) => {

tests/websockets.test.ts

@@ -2,14 +2,14 @@ import { test as testBase, expect } from '@playwright/test'
 import { createTestHttpServer } from '@epic-web/test-server/http'
 import { createWebSocketMiddleware } from '@epic-web/test-server/ws'
 import { ws } from 'msw'
-import { createWorkerFixture, type WorkerFixture } from '../src/index.js'
+import { createNetworkFixture, type NetworkFixture } from '../src/index.js'
 
 interface Fixtures {
-  worker: WorkerFixture
+  worker: NetworkFixture
 }
 
 const test = testBase.extend<Fixtures>({
-  worker: createWorkerFixture(),
+  worker: createNetworkFixture(),
 })
 
 const api = ws.link('ws://localhost/api')