mirror of
https://github.com/microsoft/playwright-examples.git
synced 2025-09-08 20:51:48 +00:00
feat: add api mocking tests
This commit is contained in:
parent
d919dbc672
commit
03190c0ea8
27
.github/workflows/playwright.yml
vendored
Normal file
27
.github/workflows/playwright.yml
vendored
Normal file
@ -0,0 +1,27 @@
|
||||
name: Playwright Tests
|
||||
on:
|
||||
push:
|
||||
branches: [ main, master ]
|
||||
pull_request:
|
||||
branches: [ main, master ]
|
||||
jobs:
|
||||
test:
|
||||
timeout-minutes: 60
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v3
|
||||
- uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: 18
|
||||
- name: Install dependencies
|
||||
run: npm ci
|
||||
- name: Install Playwright Browsers
|
||||
run: npx playwright install --with-deps
|
||||
- name: Run Playwright tests
|
||||
run: npx playwright test
|
||||
- uses: actions/upload-artifact@v3
|
||||
if: always()
|
||||
with:
|
||||
name: playwright-report
|
||||
path: playwright-report/
|
||||
retention-days: 30
|
4
.gitignore
vendored
Normal file
4
.gitignore
vendored
Normal file
@ -0,0 +1,4 @@
|
||||
node_modules/
|
||||
/test-results/
|
||||
/playwright-report/
|
||||
/playwright/.cache/
|
16
README.md
16
README.md
@ -1,14 +1,14 @@
|
||||
# Project
|
||||
# 🎭 Playwright Examples
|
||||
|
||||
> This repo has been populated by an initial template to help get you started. Please
|
||||
> make sure to update the content to build a great experience for community-building.
|
||||
This repo is used to demonstrate various testing scenarios with [Playwright](https://playwright.dev/) 🎭, using the official test-runner and scripts authored in TypeScript.
|
||||
|
||||
As the maintainer of this project, please make a few updates:
|
||||
## Run Playwright example tests
|
||||
|
||||
- Improving this README.MD file to provide a great experience
|
||||
- Updating SUPPORT.MD with content about this project's support experience
|
||||
- Understanding the security reporting process in SECURITY.MD
|
||||
- Remove this section from the README
|
||||
Use the VS Code Extension to run the tests in the tests folder or run the following command in the terminal:
|
||||
|
||||
```bash
|
||||
npx playwright test --ui
|
||||
```
|
||||
|
||||
## Contributing
|
||||
|
||||
|
70
hars/25cc30e4a440111abd545551113b7bf2e2cad209.bin
Normal file
70
hars/25cc30e4a440111abd545551113b7bf2e2cad209.bin
Normal file
@ -0,0 +1,70 @@
|
||||
[
|
||||
{
|
||||
"name": "Strawberry",
|
||||
"id": 3
|
||||
},
|
||||
{
|
||||
"name": "Banana",
|
||||
"id": 1
|
||||
},
|
||||
{
|
||||
"name": "Tomato",
|
||||
"id": 5
|
||||
},
|
||||
{
|
||||
"name": "Pear",
|
||||
"id": 4
|
||||
},
|
||||
{
|
||||
"name": "Blackberry",
|
||||
"id": 64
|
||||
},
|
||||
{
|
||||
"name": "Kiwi",
|
||||
"id": 66
|
||||
},
|
||||
{
|
||||
"name": "Pineapple",
|
||||
"id": 10
|
||||
},
|
||||
{
|
||||
"name": "Passionfruit",
|
||||
"id": 70
|
||||
},
|
||||
{
|
||||
"name": "Orange",
|
||||
"id": 2
|
||||
},
|
||||
{
|
||||
"name": "Raspberry",
|
||||
"id": 23
|
||||
},
|
||||
{
|
||||
"name": "Watermelon",
|
||||
"id": 25
|
||||
},
|
||||
{
|
||||
"name": "Lemon",
|
||||
"id": 26
|
||||
},
|
||||
{
|
||||
"name": "Mango",
|
||||
"id": 27
|
||||
},
|
||||
{
|
||||
"name": "Blueberry",
|
||||
"id": 33
|
||||
},
|
||||
{
|
||||
"name": "Apple",
|
||||
"id": 6
|
||||
},
|
||||
{
|
||||
"name": "Melon",
|
||||
"id": 41
|
||||
},
|
||||
{
|
||||
"name": "Lime",
|
||||
"id": 44
|
||||
}
|
||||
]
|
49
hars/fruit.har
Normal file
49
hars/fruit.har
Normal file
@ -0,0 +1,49 @@
|
||||
{
|
||||
"log": {
|
||||
"version": "1.2",
|
||||
"creator": {
|
||||
"name": "Playwright",
|
||||
"version": "1.35.1"
|
||||
},
|
||||
"browser": {
|
||||
"name": "chromium",
|
||||
"version": "115.0.5790.24"
|
||||
},
|
||||
"entries": [
|
||||
{
|
||||
"startedDateTime": "2023-06-29T16:45:06.982Z",
|
||||
"time": -1,
|
||||
"request": {
|
||||
"method": "GET",
|
||||
"url": "https://demo.playwright.dev/api-mocking/api/v1/fruits",
|
||||
"httpVersion": "HTTP/1.1",
|
||||
"cookies": [],
|
||||
"headers": [
|
||||
{ "name": "Accept-Language", "value": "en-US" },
|
||||
{ "name": "Referer", "value": "https://demo.playwright.dev/api-mocking/" },
|
||||
{ "name": "User-Agent", "value": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/115.0.5790.24 Safari/537.36" }
|
||||
],
|
||||
"queryString": [],
|
||||
"headersSize": -1,
|
||||
"bodySize": -1
|
||||
},
|
||||
"response": {
|
||||
"status": -1,
|
||||
"statusText": "",
|
||||
"httpVersion": "HTTP/1.1",
|
||||
"cookies": [],
|
||||
"headers": [],
|
||||
"content": {
|
||||
"size": -1,
|
||||
"mimeType": "x-unknown"
|
||||
},
|
||||
"headersSize": -1,
|
||||
"bodySize": -1,
|
||||
"redirectURL": ""
|
||||
},
|
||||
"cache": {},
|
||||
"timings": { "send": -1, "wait": -1, "receive": -1 }
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
88
package-lock.json
generated
Normal file
88
package-lock.json
generated
Normal file
@ -0,0 +1,88 @@
|
||||
{
|
||||
"name": "playwright-examples",
|
||||
"version": "1.0.0",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "playwright-examples",
|
||||
"version": "1.0.0",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@axe-core/playwright": "^4.7.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@playwright/test": "^1.35.1"
|
||||
}
|
||||
},
|
||||
"node_modules/@axe-core/playwright": {
|
||||
"version": "4.7.3",
|
||||
"resolved": "https://registry.npmjs.org/@axe-core/playwright/-/playwright-4.7.3.tgz",
|
||||
"integrity": "sha512-v2PRgAyGvop7bamrTpNJtc5b1R7giAPnMzZXrS/VDZBCY5+uwVYtCNgDvBsqp5P1QMZxUMoBN+CERJUTMjFN0A==",
|
||||
"dependencies": {
|
||||
"axe-core": "^4.7.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"playwright-core": ">= 1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@playwright/test": {
|
||||
"version": "1.35.1",
|
||||
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.35.1.tgz",
|
||||
"integrity": "sha512-b5YoFe6J9exsMYg0pQAobNDR85T1nLumUYgUTtKm4d21iX2L7WqKq9dW8NGJ+2vX0etZd+Y7UeuqsxDXm9+5ZA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@types/node": "*",
|
||||
"playwright-core": "1.35.1"
|
||||
},
|
||||
"bin": {
|
||||
"playwright": "cli.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=16"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"fsevents": "2.3.2"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/node": {
|
||||
"version": "20.3.2",
|
||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.3.2.tgz",
|
||||
"integrity": "sha512-vOBLVQeCQfIcF/2Y7eKFTqrMnizK5lRNQ7ykML/5RuwVXVWxYkgwS7xbt4B6fKCUPgbSL5FSsjHQpaGQP/dQmw==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/axe-core": {
|
||||
"version": "4.7.2",
|
||||
"resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.7.2.tgz",
|
||||
"integrity": "sha512-zIURGIS1E1Q4pcrMjp+nnEh+16G56eG/MUllJH8yEvw7asDo7Ac9uhC9KIH5jzpITueEZolfYglnCGIuSBz39g==",
|
||||
"engines": {
|
||||
"node": ">=4"
|
||||
}
|
||||
},
|
||||
"node_modules/fsevents": {
|
||||
"version": "2.3.2",
|
||||
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
|
||||
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
|
||||
"dev": true,
|
||||
"hasInstallScript": true,
|
||||
"optional": true,
|
||||
"os": [
|
||||
"darwin"
|
||||
],
|
||||
"engines": {
|
||||
"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/playwright-core": {
|
||||
"version": "1.35.1",
|
||||
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.35.1.tgz",
|
||||
"integrity": "sha512-pNXb6CQ7OqmGDRspEjlxE49w+4YtR6a3X6mT1hZXeJHWmsEz7SunmvZeiG/+y1yyMZdHnnn73WKYdtV1er0Xyg==",
|
||||
"bin": {
|
||||
"playwright-core": "cli.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=16"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
16
package.json
Normal file
16
package.json
Normal file
@ -0,0 +1,16 @@
|
||||
{
|
||||
"name": "playwright-examples",
|
||||
"version": "1.0.0",
|
||||
"description": "This repo is used to demonstrate various testing scenarios with [Playwright](https://playwright.dev/) 🎭, using the official test-runner and scripts authored in TypeScript.",
|
||||
"main": "index.js",
|
||||
"scripts": {},
|
||||
"keywords": [],
|
||||
"author": "",
|
||||
"license": "ISC",
|
||||
"devDependencies": {
|
||||
"@playwright/test": "^1.35.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"@axe-core/playwright": "^4.7.3"
|
||||
}
|
||||
}
|
77
playwright.config.ts
Normal file
77
playwright.config.ts
Normal file
@ -0,0 +1,77 @@
|
||||
import { defineConfig, devices } from '@playwright/test';
|
||||
|
||||
/**
|
||||
* Read environment variables from file.
|
||||
* https://github.com/motdotla/dotenv
|
||||
*/
|
||||
// require('dotenv').config();
|
||||
|
||||
/**
|
||||
* See https://playwright.dev/docs/test-configuration.
|
||||
*/
|
||||
export default defineConfig({
|
||||
testDir: './tests',
|
||||
/* Run tests in files in parallel */
|
||||
fullyParallel: true,
|
||||
/* Fail the build on CI if you accidentally left test.only in the source code. */
|
||||
forbidOnly: !!process.env.CI,
|
||||
/* Retry on CI only */
|
||||
retries: process.env.CI ? 2 : 0,
|
||||
/* Opt out of parallel tests on CI. */
|
||||
workers: process.env.CI ? 1 : undefined,
|
||||
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
|
||||
reporter: 'html',
|
||||
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
|
||||
use: {
|
||||
/* Base URL to use in actions like `await page.goto('/')`. */
|
||||
// baseURL: 'http://127.0.0.1:3000',
|
||||
|
||||
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
|
||||
trace: 'on-first-retry',
|
||||
},
|
||||
|
||||
/* Configure projects for major browsers */
|
||||
projects: [
|
||||
{
|
||||
name: 'chromium',
|
||||
use: { ...devices['Desktop Chrome'] },
|
||||
},
|
||||
|
||||
{
|
||||
name: 'firefox',
|
||||
use: { ...devices['Desktop Firefox'] },
|
||||
},
|
||||
|
||||
{
|
||||
name: 'webkit',
|
||||
use: { ...devices['Desktop Safari'] },
|
||||
},
|
||||
|
||||
/* Test against mobile viewports. */
|
||||
// {
|
||||
// name: 'Mobile Chrome',
|
||||
// use: { ...devices['Pixel 5'] },
|
||||
// },
|
||||
// {
|
||||
// name: 'Mobile Safari',
|
||||
// use: { ...devices['iPhone 12'] },
|
||||
// },
|
||||
|
||||
/* Test against branded browsers. */
|
||||
// {
|
||||
// name: 'Microsoft Edge',
|
||||
// use: { ...devices['Desktop Edge'], channel: 'msedge' },
|
||||
// },
|
||||
// {
|
||||
// name: 'Google Chrome',
|
||||
// use: { ...devices['Desktop Chrome'], channel: 'chrome' },
|
||||
// },
|
||||
],
|
||||
|
||||
/* Run your local dev server before starting the tests */
|
||||
// webServer: {
|
||||
// command: 'npm run start',
|
||||
// url: 'http://127.0.0.1:3000',
|
||||
// reuseExistingServer: !process.env.CI,
|
||||
// },
|
||||
});
|
71
tests/api-mocking.spec.ts
Normal file
71
tests/api-mocking.spec.ts
Normal file
@ -0,0 +1,71 @@
|
||||
import { test, expect, type Page } from '@playwright/test';
|
||||
|
||||
test.describe('Mocking an API call', () => {
|
||||
|
||||
|
||||
test("mocks a fruit and doesn't call api", async ({ page }) => {
|
||||
// Mock the api call before navigating
|
||||
await page.route('*/**/api/v1/fruits', async (route) => {
|
||||
const json = [{ name: 'Strawberry', id: 21 }];
|
||||
await route.fulfill({ json });
|
||||
});
|
||||
// Go to the page
|
||||
await page.goto('https://demo.playwright.dev/api-mocking');
|
||||
|
||||
// Assert that the Strawberry fruit is visible
|
||||
await expect(page.getByText('Strawberry')).toBeVisible();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
test.describe('Intercepting the request and modifying it', () => {
|
||||
|
||||
test('gets the json from api and adds a new fruit', async ({ page }) => {
|
||||
// Get the response and add to it
|
||||
await page.route('*/**/api/v1/fruits', async (route) => {
|
||||
const response = await route.fetch();
|
||||
const json = await response.json();
|
||||
json.push({ name: 'Playwright', id: 100 });
|
||||
// Fulfill using the original response, while patching the response body
|
||||
// with the given JSON object.
|
||||
await route.fulfill({ response, json });
|
||||
});
|
||||
|
||||
// Go to the page
|
||||
await page.goto('https://demo.playwright.dev/api-mocking');
|
||||
|
||||
// Assert that the new fruit is visible
|
||||
await expect(page.getByText('Playwright', { exact: true })).toBeVisible();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
test.describe('Mocking with HAR files', () => {
|
||||
|
||||
test('records or updates the HAR file', async ({ page }) => {
|
||||
// Get the response from the HAR file
|
||||
await page.routeFromHAR('./hars/fruit.har', {
|
||||
url: '*/**/api/v1/fruits',
|
||||
update: true,
|
||||
});
|
||||
|
||||
// Go to the page
|
||||
await page.goto('https://demo.playwright.dev/api-mocking');
|
||||
});
|
||||
|
||||
test('gets the json from HAR and checks the new fruit has been added', async ({ page }) => {
|
||||
// Replay API requests from HAR.
|
||||
// Either use a matching response from the HAR,
|
||||
// or abort the request if nothing matches.
|
||||
await page.routeFromHAR('./hars/fruit.har', {
|
||||
url: '*/**/api/v1/fruits',
|
||||
update: false,
|
||||
});
|
||||
|
||||
// Go to the page
|
||||
await page.goto('https://demo.playwright.dev/api-mocking');
|
||||
|
||||
// Assert that the Playwright fruit is visible
|
||||
await expect(page.getByText('Strawberry')).toBeVisible();
|
||||
});
|
||||
});
|
Loading…
x
Reference in New Issue
Block a user