fix :: Test.step.location class-test.md for Clarity and Conciseness

This commit is contained in:
osohyun0224 2024-09-17 18:01:20 +09:00
parent 199e29a0e5
commit 4c3dbacd2c
2 changed files with 6 additions and 85 deletions

View file

@ -1579,46 +1579,6 @@ test('test', async ({ page }) => {
});
```
**Custom Step Location**
Allows the specification of a custom location for a test step. This is particularly useful when `test.step` is used within helper functions or other layers of abstraction, enabling more accurate pinpointing of the step's origin in the source code.
```js
import { test, expect } from '@playwright/test';
import { getStepLocation } from './helpers';
test('user login process with custom step location', async ({ page }) => {
const location = getStepLocation();
await test.step(`Navigate to login page`, async () => {
await page.goto('https://example.com/login');
}, { location });
await test.step(`Fill in login credentials and submit`, async () => {
await page.fill('input#username', 'testuser');
await page.fill('input#password', 'testpass');
await page.click('button[type="submit"]');
}, { location });
await test.step(`Check if the profile is visible post-login`, async () => {
const profileVisible = await page.isVisible('.profile');
expect(profileVisible).toBeTruthy();
}, { location });
});
function getStepLocation() {
const error = new Error();
const stackInfo = error.stack.split('\n')[2]; // Adjust based on environment
const match = /at (.+):(\d+):(\d+)/.exec(stackInfo);
return {
file: match[1],
line: parseInt(match[2], 10),
column: parseInt(match[3], 10)
};
}
```
This revised code demonstrates how to track and report the location of each step in a user login process, making debugging and tracing much easier in complex tests. The getStepLocation function is crafted to fetch the exact location where the test step is defined, which can be dynamically adjusted to fit different JavaScript environments.
**Decorator**
You can use TypeScript method decorators to turn a method into a step.
@ -1750,6 +1710,12 @@ Step body.
Whether to box the step in the report. Defaults to `false`. When the step is boxed, errors thrown from the step internals point to the step call site. See below for more details.
### option: Test.step.location
* since: v1.50
- `location` <[Object]>
Specifies a custom location for a test step as { file, line, column }, enabling precise error reporting within user code.
## method: Test.use
* since: v1.10

View file

@ -4584,51 +4584,6 @@ export interface TestType<TestArgs extends KeyValue, WorkerArgs extends KeyValue
* });
* ```
*
* **Custom Step Location**
*
* Allows the specification of a custom location for a test step. This is particularly useful when `test.step` is used
* within helper functions or other layers of abstraction, enabling more accurate pinpointing of the step's origin in
* the source code.
*
* ```js
* import { test, expect } from '@playwright/test';
* import { getStepLocation } from './helpers';
*
* test('user login process with custom step location', async ({ page }) => {
* const location = getStepLocation();
* await test.step(`Navigate to login page`, async () => {
* await page.goto('https://example.com/login');
* }, { location });
*
* await test.step(`Fill in login credentials and submit`, async () => {
* await page.fill('input#username', 'testuser');
* await page.fill('input#password', 'testpass');
* await page.click('button[type="submit"]');
* }, { location });
*
* await test.step(`Check if the profile is visible post-login`, async () => {
* const profileVisible = await page.isVisible('.profile');
* expect(profileVisible).toBeTruthy();
* }, { location });
* });
*
* function getStepLocation() {
* const error = new Error();
* const stackInfo = error.stack.split('\n')[2]; // Adjust based on environment
* const match = /at (.+):(\d+):(\d+)/.exec(stackInfo);
* return {
* file: match[1],
* line: parseInt(match[2], 10),
* column: parseInt(match[3], 10)
* };
* }
* ```
*
* This revised code demonstrates how to track and report the location of each step in a user login process, making
* debugging and tracing much easier in complex tests. The getStepLocation function is crafted to fetch the exact
* location where the test step is defined, which can be dynamically adjusted to fit different JavaScript
* environments.
*
* **Decorator**
*
* You can use TypeScript method decorators to turn a method into a step. Each call to the decorated method will show