Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Why is MSW http added to test fixtures in doc examples? #100

Open
iulspop opened this issue Jul 18, 2024 · 0 comments
Open

Why is MSW http added to test fixtures in doc examples? #100

iulspop opened this issue Jul 18, 2024 · 0 comments

Comments

@iulspop
Copy link

iulspop commented Jul 18, 2024

Is MSW http added simply for convenience of not having to re-import from MSW in tests files?

Here's an example from the docs:

import { test as base, expect } from '@playwright/test';
import { http } from 'msw';
import type { MockServiceWorker } from 'playwright-msw';
import { createWorkerFixture } from 'playwright-msw';

import handlers from './handlers';

const test = base.extend<{
  worker: MockServiceWorker;
  http: typeof http;
}>({
  worker: createWorkerFixture(handlers),
  http
});

export { expect, test };
  test.only('should allow mocks to be overridden on a per test basis', async ({
    page,
    worker,
    http
  }) => {
    await worker.use(
      http.get('/api/users', async () => {
        await delay(250);
        return new HttpResponse(null, {
          status: 403,
        });
      }),
    );
    ...

I decided to go more with an API like this so I don't add http to the test fixtures, instead I import a handler with defaults I overwrite for specific tests:

import { faker } from '@faker-js/faker'
import { getUser } from './handlers'
import { expect, test } from './test'

test.describe('developer dashboard page', () => {
  test('given user is not logged in', async ({ page, worker, loginPage, devDashboardPage }) => {
    await test.step('then navigate to dashboard', async () => {
      await devDashboardPage.goto()
      await expect(page, 'should redirect to /login').toHaveURL(/login/)
    })

    await test.step('then sign in', async () => {
      const login = faker.internet.userName()
      await worker.use(getUser({ login }))
      await loginPage.signInLink().click()
      await expect.soft(page, 'should redirect to /').toHaveURL(/\//)
      await expect(devDashboardPage.userProfileLogin(login), 'should load user info').toBeVisible()
    })

    await test.step('then sign out', async () => {
      await devDashboardPage.userProfileImage().click()
      await devDashboardPage.signOutButton().click()
      await expect(page, 'should redirect to /login').toHaveURL(/login/)
    })
  })
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant