artes 1.0.87 → 1.0.88

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/README.md +367 -366
  2. package/cucumber.config.js +136 -120
  3. package/docs/functionDefinitions.md +2401 -2401
  4. package/docs/stepDefinitions.md +352 -352
  5. package/executer.js +108 -106
  6. package/index.js +46 -46
  7. package/package.json +50 -50
  8. package/src/helper/contextManager/browserManager.js +71 -70
  9. package/src/helper/contextManager/requestManager.js +30 -30
  10. package/src/helper/executers/cleaner.js +19 -19
  11. package/src/helper/executers/exporter.js +15 -15
  12. package/src/helper/executers/helper.js +77 -74
  13. package/src/helper/executers/projectCreator.js +164 -163
  14. package/src/helper/executers/reportGenerator.js +25 -25
  15. package/src/helper/executers/testRunner.js +30 -30
  16. package/src/helper/executers/versionChecker.js +14 -13
  17. package/src/helper/imports/commons.js +52 -52
  18. package/src/helper/pomController/elementController.js +144 -144
  19. package/src/helper/pomController/pomCollector.js +20 -20
  20. package/src/helper/stepFunctions/APIActions.js +313 -313
  21. package/src/helper/stepFunctions/assertions.js +523 -523
  22. package/src/helper/stepFunctions/browserActions.js +21 -21
  23. package/src/helper/stepFunctions/elementInteractions.js +38 -38
  24. package/src/helper/stepFunctions/exporter.js +19 -19
  25. package/src/helper/stepFunctions/frameActions.js +50 -50
  26. package/src/helper/stepFunctions/keyboardActions.js +41 -41
  27. package/src/helper/stepFunctions/mouseActions.js +145 -145
  28. package/src/helper/stepFunctions/pageActions.js +27 -27
  29. package/src/hooks/context.js +15 -15
  30. package/src/hooks/hooks.js +157 -157
  31. package/src/stepDefinitions/API.steps.js +252 -252
  32. package/src/stepDefinitions/assertions.steps.js +826 -826
  33. package/src/stepDefinitions/browser.steps.js +7 -7
  34. package/src/stepDefinitions/frameActions.steps.js +76 -76
  35. package/src/stepDefinitions/keyboardActions.steps.js +95 -87
  36. package/src/stepDefinitions/mouseActions.steps.js +256 -256
  37. package/src/stepDefinitions/page.steps.js +71 -71
  38. package/src/stepDefinitions/random.steps.js +31 -31
package/README.md CHANGED
@@ -1,366 +1,367 @@
1
- <p align="center">
2
- <img alt="artesLogo" src="https://github.com/user-attachments/assets/e0641011-0e96-4330-8ad5-935b395b0838" width="280">
3
- </p>
4
-
5
- <h1 align="center">Artes</h1>
6
-
7
- ## 🚀 Summary
8
-
9
- Artes is a test runner for Playwright that executes [predefined Cucumber tests](./docs/stepDefinitions.md) and can generate Allure reports for test results. It simplifies setting up Playwright with Cucumber in your automation workflow. With Artes, you can easily run tests without writing step definitions, generate reports, and customize your testing environment.
10
-
11
- ![artes demonstration](https://github.com/user-attachments/assets/c46172f7-103d-45d1-a37d-8d4267df0967)
12
-
13
- ## 🧑‍💻 Installation
14
-
15
- You can install **Artes** via npm. To install it globally**(RECOMMENDED)**, run the following command:
16
-
17
- ```bash
18
- npm install -g artes
19
- ```
20
-
21
- To install it locally in your project, run:
22
-
23
- ```bash
24
- npm install artes
25
- ```
26
-
27
- Once installed, you can run **Artes** using:
28
-
29
- ```bash
30
- npx artes [options]
31
- ```
32
-
33
- ---
34
-
35
- ## 💡 Usage
36
-
37
- **Artes** has following CLI options:
38
-
39
- ```bash
40
- npx artes [options]
41
- ```
42
-
43
- ### Options
44
-
45
- | Option | Description | Usage Example |
46
- | ------------------- | -------------------------------------------------------------------------- | --------------------------------------------------------------------- |
47
- | 🆘 `-h, --help` | Show the usage options | `artes -h` or `artes --help` |
48
- | 🏷️ `-v, --version` | Show the current version of Artes | `artes -v` or `artes --version` |
49
- | 🏗️ `-c, --create` | Create an example project with Artes | `artes -c` or `artes --create` |
50
- | ✅ `-y, --yes` | Skip the confirmation prompt when creating an example project | `artes -c -y` or `artes --create --yes` |
51
- | 📊 `-r, --report` | Run tests and generate Allure report | `artes -r` or `artes --report` |
52
- | 📁 `--features` | Specify one or more feature files' relative paths to run (comma-separated) | `artes --features "tests/features/Alma,tests/features/Banan.feature"` |
53
- | 🔖 `--tags` | Run tests with specified Cucumber tags | `artes --tags "@smoke or @wip"` |
54
- | 🌐 `--env` | Set the environment for the test run | `artes --env "dev"` |
55
- | 🕶️ `--headless` | Run browser in headless mode | `artes --headless` |
56
- | ⚡ `--parallel` | Run tests in parallel mode | `artes --parallel 2` |
57
- | 🔁 `--retry` | Retry failed tests | `artes --retry 3` |
58
- | 🎭 `--dryrun` | Perform a dry run without executing tests | `artes --dryrun` |
59
- | 📈 `--percentage` | Set minimum success percentage to pass test run (default is 0) | `artes --percentage 85` |
60
- | 🌍 `--browser` | Specify browser to use (`chromium`, `firefox`, or `webkit`) | `artes --browser chromium` |
61
- | 🔗 `--baseURL` | Set base URL for the tests | `artes --baseURL "https://example.com"` |
62
- | 🖥️ `--maxScreen` | Maximize browser window on launch | `artes --maxScreen` |
63
- | 📏 `--width` | Set browser width (default is 1280) | `artes --width 1920` |
64
- | 📐 `--height` | Set browser height (default is 720) | `artes --height 1080` |
65
- | ⏱️ `--timeout` | Set timeout for each test step in seconds (default is 30) | `artes --timeout 10` |
66
-
67
- \*\* To just run the tests: <br>
68
- Globally: artes <br>
69
- Locally: npx artes
70
-
71
- ---
72
-
73
- ## 🎯 Best Practices
74
-
75
- - **Global Installation:**
76
- For ease of use, it's recommended that Artes be installed globally. You can do this by running the following command:
77
-
78
- ```bash
79
- npm install -g artes
80
- ```
81
-
82
- - **Project Creation (Recommended):**
83
- To create a new project with Artes, use the `-c` flag. This will automatically set up the folder structure and configuration for you. Run the command:
84
-
85
- ```bash
86
- artes -c
87
- ```
88
-
89
- 🗂️ Example Project Structure: <br/>
90
- After running the `-c` flag to create a new project, the structure will look like this:
91
-
92
- ```
93
- /artes (Project Name)
94
- /tests
95
- /features
96
- (Your feature files here)
97
- /POMs // Optional
98
- (POM JSON file here)
99
- /steps // For custom steps
100
- (Your step definition JS files here)
101
- artes.config.js
102
- /report
103
- (Generated Allure report HTML here)
104
- ```
105
-
106
- **If you choose not to use the `-c` flag**, you can still download Artes to your testing project and use the prepared steps by running:
107
-
108
- ```bash
109
- npx artes
110
- ```
111
-
112
- You must customize the paths of features, steps, and other configurations by editing the `artes.config.js` file located inside your project folder (or create it).
113
-
114
- For example:
115
-
116
- ```javascript
117
- module.exports = {
118
- paths: ["tests/features/"], // Custom path for feature files
119
- require: ["tests/steps/*.js"], // Custom path for step definitions files
120
- pomPath: "tests/POMS/*.js", // Custom path for POM files
121
- };
122
- ```
123
-
124
- ---
125
-
126
- ## 📝 Writing Feature Files and POM Files
127
-
128
- Artes simplifies your test writing with structured feature files and organized Page Object Models (POM). Here’s how you can create them:
129
-
130
- ### 1. 📄 Feature File Structure
131
-
132
- ```gherkin
133
- Feature: Searching on Google 🔍
134
- Scenario Outline: Search for a term on Google
135
- Given User is on "https://www.google.com/" page
136
- When User types "alma" in "google_search_input"
137
- And User clicks "google_search_button"
138
- And User waits 10 seconds
139
- Then "google_text" should have "Alma" text
140
- ```
141
-
142
- - **Feature**: Describes the main feature being tested (e.g., Google search).
143
- - **Scenario Outline**: Defines a test case with steps.
144
- - **Steps**: Use `Given`, `When`, `And`, `Then` keywords to describe actions and expectations.
145
- - **Selectors**: The element names (e.g., `google_search_input`, `google_search_button`) map to the POM file or can be defined directly.
146
-
147
- ### 2. 📂 POM File Example
148
-
149
- ```json
150
- {
151
- "google_search_input": { "selector": "#APjFqb" },
152
- "google_search_button": {
153
- "selector": "input.gNO89b"
154
- },
155
- "google_text": {
156
- "selector": "#rso div h3",
157
- "waitTime": 5 //seconds
158
- }
159
- }
160
- ```
161
-
162
- - 📑 Using POM File is optional but it is **RECOMMENDED**
163
- - 🔗 Using Selector in Feature File is possible
164
- ```gherkin
165
- When User types "alma" in "#APjFqb"
166
- ```
167
- - 🐍 It is good to use snake_case for element names
168
- - "waitTime" is to define custom wait for elements, but the feature currently under development
169
- "selector" must be used if "waitTime" is used, but when using only selector is not needed mention in "selector"
170
-
171
- ---
172
-
173
- ## 🛠️ Customization
174
-
175
- ## ✍️ Writing Custom Step Definitions
176
-
177
- Artes allows you to extend its functionality by writing custom step definitions. Here's how you can do it:
178
-
179
- ### Import Required APIs
180
-
181
- ```javascript
182
- const {
183
- expect,
184
- Given,
185
- When,
186
- Then,
187
- element,
188
- context,
189
- keyboard,
190
- mouse,
191
- frame,
192
- assert,
193
- elementInteractions,
194
- } = require("artes"); // Common JS
195
- import { expect, Given, When, Then, element, context } from "artes"; // ES Modules (Do not RECOMMENDED)
196
- ```
197
-
198
- - **`Given`, `When`, `Then`**: These define your steps in Cucumber syntax. Example:
199
-
200
- ```javascript
201
- Given("User is on the login page", async () => {
202
- await context.page.navigateTo("https://example.com/login");
203
- });
204
- ```
205
-
206
- - **`page`**: Provides higher-level page actions such as navigation and waiting(Same as PlayWright). Examples:
207
- - Navigate to a URL:
208
- ```javascript
209
- await context.page.navigate("https://example.com");
210
- ```
211
- - Wait for a selector:
212
- ```javascript
213
- await context.page.waitForSelector("#loadingSpinner");
214
- ```
215
- - **`request`**: Use for sending HTTP requests. _(Note: This feature is currently under development.)_
216
-
217
- - **`element`**: Use for interacting with elements on the web page. Examples:
218
- - Clicking a button:
219
- ```javascript
220
- await element("#submitButton").click();
221
- ```
222
- - Filling an input:
223
- ```javascript
224
- await element("#username").fill("testUser");
225
- ```
226
- - **`expect`**: Use for assertions in your steps. For example:
227
- ```javascript
228
- expect(actualValue).toBe(expectedValue);
229
- expect(element("Page_Title")).toHaveText(expectedValue);
230
- ```
231
-
232
- ## 📋 Simplified Functions
233
-
234
- If you don't want to deal with Playwright methods directly, you can simply use the following predefined actions methods by import them:
235
-
236
- ```javascript
237
- const { mouse, keyboard, frame, elementInteractions, page } = require("artes");
238
- ```
239
-
240
- - **Mouse Actions:**
241
- `mouse.click(element)`
242
-
243
- - **Keyboard Actions:**
244
- `keyboard.press(key)`
245
-
246
- - **Element Interactions:**
247
- `elementInteractions.isChecked()`
248
-
249
- - **Assertions:**
250
- `assert.shouldBeTruthy(element)`
251
-
252
- - **Frame Actions:**
253
- `frame.first()`
254
-
255
- - **API Actions:**
256
- `api.post(url, payload, requestDataType)`
257
-
258
- ---
259
-
260
- For a detailed explanation of each function, please refer to the [function definitions](./docs/functionDefinitions.md).
261
-
262
- ---
263
-
264
- ### Example of a Custom Step Definition
265
-
266
- ```javascript
267
- const { Given, When, Then, expect, element, page } = require("artes");
268
-
269
- Given("User is on the home page", async () => {
270
- await page.navigate("https://example.com");
271
- });
272
-
273
- When("User clicks the login button", async () => {
274
- await element("#loginButton").click();
275
- });
276
-
277
- Then("User should see the login form", async () => {
278
- expect(element("#loginForm")).toBeVisible(true);
279
- });
280
- ```
281
-
282
- ## ⚙️ Configuration
283
-
284
- You can configure Artes by editing the `artes.config.js` file. Below are the default configuration options with explanations:
285
-
286
- | **Option** | **Default Value** | **Description** |
287
- | ----------------- | ---------------------------------------------------------------------------- | ----------------------------------- |
288
- | `timeout` | `30` | Default timeout in milliseconds. |
289
- | `paths` | `[moduleConfig.featuresPath]` | Paths to feature files. |
290
- | `require` | `[moduleConfig.stepsPath, "src/stepDefinitions/*.js", "src/hooks/hooks.js"]` | Support code paths (CommonJS). |
291
- | `pomPath` | `moduleConfig.pomPath` | Path to Page Object Models. |
292
- | `import` | `[]` | Support code paths. |
293
- | `testPercentage` | `0` | Define test coverage percentage |
294
- | `format` | `["rerun:@rerun.txt", "allure-cucumberjs/reporter"]` | Formatter names/paths. |
295
- | `formatOptions` | `{ "resultsDir": "allure-result" }` | Formatter options. |
296
- | `parallel` | `1` | Number of parallel workers. |
297
- | `dryRun` | `false` | Prepare test run without execution. |
298
- | `failFast` | `false` | Stop on first test failure. |
299
- | `forceExit` | `false` | Force `process.exit()` after tests. |
300
- | `strict` | `true` | Fail on pending steps. |
301
- | `backtrace` | `false` | Show full backtrace for errors. |
302
- | `tags` | `""` | Tag expression to filter scenarios. |
303
- | `name` | `[]` | Run scenarios matching regex. |
304
- | `order` | `"defined"` | Run order (defined/random). |
305
- | `language` | `"en"` | Default feature file language. |
306
- | `loader` | `[]` | Module loader specifications. |
307
- | `requireModule` | `[]` | Transpilation module names. |
308
- | `retry` | `0` | Retry attempts for failing tests. |
309
- | `retryTagFilter` | `""` | Tag expression for retries. |
310
- | `publish` | `false` | Publish to cucumber.io. |
311
- | `worldParameters` | `{}` | Custom world parameters. |
312
-
313
- ### Environment Configuration
314
-
315
- | **Option** | **Default Value** | **Description** |
316
- | ---------- | ----------------- | ------------------------------------------------------------------------------------------------------------ |
317
- | `env` | `""` | Environment configuration. Should match the name with the baseURL object, like "dev" |
318
- | `baseURL` | `""` | Base URL for API requests. Can be object {"dev":"dev-api.com", "pre":"pre-api.com"}, or string "dev-api.com" |
319
-
320
- ---
321
-
322
- ### Browser Configuration
323
-
324
- | Option | Default Value | Description |
325
- | ------------- | ------------------------------ | ------------------------------------------------------ |
326
- | `browserType` | `"chrome"` | Browser type (`"chrome"`, `"firefox"`, or `"webkit"`). |
327
- | `viewport` | `{ width: 1280, height: 720 }` | Browser viewport size. |
328
- | `headless` | `true` | Run browser in headless mode (`true` or `false`). |
329
-
330
- ## 📊 Report Generation
331
-
332
- Artes can generate Allure reports. After running tests with the `-r` flag, the reports will be stored in the `report` folder in HTML format. You can view them in your browser after the tests complete.
333
-
334
- ---
335
-
336
- ## 👍 Good To Use
337
-
338
- If you don't use the -c or --create option that the package offers, save the file below under the `.vscode` folder:
339
-
340
- - Those configurations will help autocomplete both predefined and custom step definitions in your features file
341
-
342
- **extensions.json**
343
-
344
- ```json
345
- {
346
- "recommendations": ["CucumberOpen.cucumber-official"]
347
- }
348
- ```
349
-
350
- **settings.json**
351
-
352
- ```json
353
- {
354
- "cucumber.glue": [
355
- "tests/steps/*.{ts,js}",
356
- "node_modules/artes/src/tests/stepDefinitions/*.{ts,js}"
357
- ],
358
- "cucumber.features": ["tests/features/*.features"],
359
- "cucumberautocomplete.syncfeatures": true,
360
- "cucumberautocomplete.strictGherkinCompletion": true
361
- }
362
- ```
363
-
364
- ---
365
-
366
- ## 🧑‍💻 Have a Good Testing
1
+ <p align="center">
2
+ <img alt="artesLogo" src="https://github.com/user-attachments/assets/e0641011-0e96-4330-8ad5-935b395b0838" width="280">
3
+ </p>
4
+
5
+ <h1 align="center">Artes</h1>
6
+
7
+ ## 🚀 Summary
8
+
9
+ Artes is a test runner for Playwright that executes [predefined Cucumber tests](./docs/stepDefinitions.md) and can generate Allure reports for test results. It simplifies setting up Playwright with Cucumber in your automation workflow. With Artes, you can easily run tests without writing step definitions, generate reports, and customize your testing environment.
10
+
11
+ ![artes demonstration](https://github.com/user-attachments/assets/c46172f7-103d-45d1-a37d-8d4267df0967)
12
+
13
+ ## 🧑‍💻 Installation
14
+
15
+ You can install **Artes** via npm. To install it globally**(RECOMMENDED)**, run the following command:
16
+
17
+ ```bash
18
+ npm install -g artes
19
+ ```
20
+
21
+ To install it locally in your project, run:
22
+
23
+ ```bash
24
+ npm install artes
25
+ ```
26
+
27
+ Once installed, you can run **Artes** using:
28
+
29
+ ```bash
30
+ npx artes [options]
31
+ ```
32
+
33
+ ---
34
+
35
+ ## 💡 Usage
36
+
37
+ **Artes** has following CLI options:
38
+
39
+ ```bash
40
+ npx artes [options]
41
+ ```
42
+
43
+ ### Options
44
+
45
+ | Option | Description | Usage Example |
46
+ | ------------------- | -------------------------------------------------------------------------- | --------------------------------------------------------------------- |
47
+ | 🆘 `-h, --help` | Show the usage options | `artes -h` or `artes --help` |
48
+ | 🏷️ `-v, --version` | Show the current version of Artes | `artes -v` or `artes --version` |
49
+ | 🏗️ `-c, --create` | Create an example project with Artes | `artes -c` or `artes --create` |
50
+ | ✅ `-y, --yes` | Skip the confirmation prompt when creating an example project | `artes -c -y` or `artes --create --yes` |
51
+ | 📊 `-r, --report` | Run tests and generate Allure report | `artes -r` or `artes --report` |
52
+ | 📁 `--features` | Specify one or more feature files' relative paths to run (comma-separated) | `artes --features "tests/features/Alma,tests/features/Banan.feature"` |
53
+ | 🔖 `--tags` | Run tests with specified Cucumber tags | `artes --tags "@smoke or @wip"` |
54
+ | 🌐 `--env` | Set the environment for the test run | `artes --env "dev"` |
55
+ | 🕶️ `--headless` | Run browser in headless mode | `artes --headless` |
56
+ | ⚡ `--parallel` | Run tests in parallel mode | `artes --parallel 2` |
57
+ | 🔁 `--retry` | Retry failed tests | `artes --retry 3` |
58
+ | 🎭 `--dryrun` | Perform a dry run without executing tests | `artes --dryrun` |
59
+ | 📈 `--percentage` | Set minimum success percentage to pass test run (default is 0) | `artes --percentage 85` |
60
+ | 🌍 `--browser` | Specify browser to use (`chromium`, `firefox`, or `webkit`) | `artes --browser chromium` |
61
+ | 🔗 `--baseURL` | Set base URL for the tests | `artes --baseURL "https://example.com"` |
62
+ | 🖥️ `--maxScreen` | Maximize browser window on launch | `artes --maxScreen` |
63
+ | 📏 `--width` | Set browser width (default is 1280) | `artes --width 1920` |
64
+ | 📐 `--height` | Set browser height (default is 720) | `artes --height 1080` |
65
+ | ⏱️ `--timeout` | Set timeout for each test step in seconds (default is 30) | `artes --timeout 10` |
66
+ | 🐢 `--slowmo` | Slow down text execution for clear view (default: 0ms) | `artes --slowmo 1000` |
67
+
68
+ \*\* To just run the tests: <br>
69
+ Globally: artes <br>
70
+ Locally: npx artes
71
+
72
+ ---
73
+
74
+ ## 🎯 Best Practices
75
+
76
+ - **Global Installation:**
77
+ For ease of use, it's recommended that Artes be installed globally. You can do this by running the following command:
78
+
79
+ ```bash
80
+ npm install -g artes
81
+ ```
82
+
83
+ - **Project Creation (Recommended):**
84
+ To create a new project with Artes, use the `-c` flag. This will automatically set up the folder structure and configuration for you. Run the command:
85
+
86
+ ```bash
87
+ artes -c
88
+ ```
89
+
90
+ 🗂️ Example Project Structure: <br/>
91
+ After running the `-c` flag to create a new project, the structure will look like this:
92
+
93
+ ```
94
+ /artes (Project Name)
95
+ /tests
96
+ /features
97
+ (Your feature files here)
98
+ /POMs // Optional
99
+ (POM JSON file here)
100
+ /steps // For custom steps
101
+ (Your step definition JS files here)
102
+ artes.config.js
103
+ /report
104
+ (Generated Allure report HTML here)
105
+ ```
106
+
107
+ **If you choose not to use the `-c` flag**, you can still download Artes to your testing project and use the prepared steps by running:
108
+
109
+ ```bash
110
+ npx artes
111
+ ```
112
+
113
+ You must customize the paths of features, steps, and other configurations by editing the `artes.config.js` file located inside your project folder (or create it).
114
+
115
+ For example:
116
+
117
+ ```javascript
118
+ module.exports = {
119
+ paths: ["tests/features/"], // Custom path for feature files
120
+ require: ["tests/steps/*.js"], // Custom path for step definitions files
121
+ pomPath: "tests/POMS/*.js", // Custom path for POM files
122
+ };
123
+ ```
124
+
125
+ ---
126
+
127
+ ## 📝 Writing Feature Files and POM Files
128
+
129
+ Artes simplifies your test writing with structured feature files and organized Page Object Models (POM). Here’s how you can create them:
130
+
131
+ ### 1. 📄 Feature File Structure
132
+
133
+ ```gherkin
134
+ Feature: Searching on Google 🔍
135
+ Scenario Outline: Search for a term on Google
136
+ Given User is on "https://www.google.com/" page
137
+ When User types "alma" in "google_search_input"
138
+ And User clicks "google_search_button"
139
+ And User waits 10 seconds
140
+ Then "google_text" should have "Alma" text
141
+ ```
142
+
143
+ - **Feature**: Describes the main feature being tested (e.g., Google search).
144
+ - **Scenario Outline**: Defines a test case with steps.
145
+ - **Steps**: Use `Given`, `When`, `And`, `Then` keywords to describe actions and expectations.
146
+ - **Selectors**: The element names (e.g., `google_search_input`, `google_search_button`) map to the POM file or can be defined directly.
147
+
148
+ ### 2. 📂 POM File Example
149
+
150
+ ```json
151
+ {
152
+ "google_search_input": { "selector": "#APjFqb" },
153
+ "google_search_button": {
154
+ "selector": "input.gNO89b"
155
+ },
156
+ "google_text": {
157
+ "selector": "#rso div h3",
158
+ "waitTime": 5 //seconds
159
+ }
160
+ }
161
+ ```
162
+
163
+ - 📑 Using POM File is optional but it is **RECOMMENDED**
164
+ - 🔗 Using Selector in Feature File is possible
165
+ ```gherkin
166
+ When User types "alma" in "#APjFqb"
167
+ ```
168
+ - 🐍 It is good to use snake_case for element names
169
+ - "waitTime" is to define custom wait for elements, but the feature currently under development
170
+ "selector" must be used if "waitTime" is used, but when using only selector is not needed mention in "selector"
171
+
172
+ ---
173
+
174
+ ## 🛠️ Customization
175
+
176
+ ## ✍️ Writing Custom Step Definitions
177
+
178
+ Artes allows you to extend its functionality by writing custom step definitions. Here's how you can do it:
179
+
180
+ ### Import Required APIs
181
+
182
+ ```javascript
183
+ const {
184
+ expect,
185
+ Given,
186
+ When,
187
+ Then,
188
+ element,
189
+ context,
190
+ keyboard,
191
+ mouse,
192
+ frame,
193
+ assert,
194
+ elementInteractions,
195
+ } = require("artes"); // Common JS
196
+ import { expect, Given, When, Then, element, context } from "artes"; // ES Modules (Do not RECOMMENDED)
197
+ ```
198
+
199
+ - **`Given`, `When`, `Then`**: These define your steps in Cucumber syntax. Example:
200
+
201
+ ```javascript
202
+ Given("User is on the login page", async () => {
203
+ await context.page.navigateTo("https://example.com/login");
204
+ });
205
+ ```
206
+
207
+ - **`page`**: Provides higher-level page actions such as navigation and waiting(Same as PlayWright). Examples:
208
+ - Navigate to a URL:
209
+ ```javascript
210
+ await context.page.navigate("https://example.com");
211
+ ```
212
+ - Wait for a selector:
213
+ ```javascript
214
+ await context.page.waitForSelector("#loadingSpinner");
215
+ ```
216
+ - **`request`**: Use for sending HTTP requests. _(Note: This feature is currently under development.)_
217
+
218
+ - **`element`**: Use for interacting with elements on the web page. Examples:
219
+ - Clicking a button:
220
+ ```javascript
221
+ await element("#submitButton").click();
222
+ ```
223
+ - Filling an input:
224
+ ```javascript
225
+ await element("#username").fill("testUser");
226
+ ```
227
+ - **`expect`**: Use for assertions in your steps. For example:
228
+ ```javascript
229
+ expect(actualValue).toBe(expectedValue);
230
+ expect(element("Page_Title")).toHaveText(expectedValue);
231
+ ```
232
+
233
+ ## 📋 Simplified Functions
234
+
235
+ If you don't want to deal with Playwright methods directly, you can simply use the following predefined actions methods by import them:
236
+
237
+ ```javascript
238
+ const { mouse, keyboard, frame, elementInteractions, page } = require("artes");
239
+ ```
240
+
241
+ - **Mouse Actions:**
242
+ `mouse.click(element)`
243
+
244
+ - **Keyboard Actions:**
245
+ `keyboard.press(key)`
246
+
247
+ - **Element Interactions:**
248
+ `elementInteractions.isChecked()`
249
+
250
+ - **Assertions:**
251
+ `assert.shouldBeTruthy(element)`
252
+
253
+ - **Frame Actions:**
254
+ `frame.first()`
255
+
256
+ - **API Actions:**
257
+ `api.post(url, payload, requestDataType)`
258
+
259
+ ---
260
+
261
+ For a detailed explanation of each function, please refer to the [function definitions](./docs/functionDefinitions.md).
262
+
263
+ ---
264
+
265
+ ### Example of a Custom Step Definition
266
+
267
+ ```javascript
268
+ const { Given, When, Then, expect, element, page } = require("artes");
269
+
270
+ Given("User is on the home page", async () => {
271
+ await page.navigate("https://example.com");
272
+ });
273
+
274
+ When("User clicks the login button", async () => {
275
+ await element("#loginButton").click();
276
+ });
277
+
278
+ Then("User should see the login form", async () => {
279
+ expect(element("#loginForm")).toBeVisible(true);
280
+ });
281
+ ```
282
+
283
+ ## ⚙️ Configuration
284
+
285
+ You can configure Artes by editing the `artes.config.js` file. Below are the default configuration options with explanations:
286
+
287
+ | **Option** | **Default Value** | **Description** |
288
+ | ----------------- | ---------------------------------------------------------------------------- | ----------------------------------- |
289
+ | `timeout` | `30` | Default timeout in milliseconds. |
290
+ | `paths` | `[moduleConfig.featuresPath]` | Paths to feature files. |
291
+ | `require` | `[moduleConfig.stepsPath, "src/stepDefinitions/*.js", "src/hooks/hooks.js"]` | Support code paths (CommonJS). |
292
+ | `pomPath` | `moduleConfig.pomPath` | Path to Page Object Models. |
293
+ | `import` | `[]` | Support code paths. |
294
+ | `testPercentage` | `0` | Define test coverage percentage |
295
+ | `format` | `["rerun:@rerun.txt", "allure-cucumberjs/reporter"]` | Formatter names/paths. |
296
+ | `formatOptions` | `{ "resultsDir": "allure-result" }` | Formatter options. |
297
+ | `parallel` | `1` | Number of parallel workers. |
298
+ | `dryRun` | `false` | Prepare test run without execution. |
299
+ | `failFast` | `false` | Stop on first test failure. |
300
+ | `forceExit` | `false` | Force `process.exit()` after tests. |
301
+ | `strict` | `true` | Fail on pending steps. |
302
+ | `backtrace` | `false` | Show full backtrace for errors. |
303
+ | `tags` | `""` | Tag expression to filter scenarios. |
304
+ | `name` | `[]` | Run scenarios matching regex. |
305
+ | `order` | `"defined"` | Run order (defined/random). |
306
+ | `language` | `"en"` | Default feature file language. |
307
+ | `loader` | `[]` | Module loader specifications. |
308
+ | `requireModule` | `[]` | Transpilation module names. |
309
+ | `retry` | `0` | Retry attempts for failing tests. |
310
+ | `retryTagFilter` | `""` | Tag expression for retries. |
311
+ | `publish` | `false` | Publish to cucumber.io. |
312
+ | `worldParameters` | `{}` | Custom world parameters. |
313
+
314
+ ### Environment Configuration
315
+
316
+ | **Option** | **Default Value** | **Description** |
317
+ | ---------- | ----------------- | ------------------------------------------------------------------------------------------------------------ |
318
+ | `env` | `""` | Environment configuration. Should match the name with the baseURL object, like "dev" |
319
+ | `baseURL` | `""` | Base URL for API requests. Can be object {"dev":"dev-api.com", "pre":"pre-api.com"}, or string "dev-api.com" |
320
+
321
+ ---
322
+
323
+ ### Browser Configuration
324
+
325
+ | Option | Default Value | Description |
326
+ | ------------- | ------------------------------ | ------------------------------------------------------ |
327
+ | `browserType` | `"chrome"` | Browser type (`"chrome"`, `"firefox"`, or `"webkit"`). |
328
+ | `viewport` | `{ width: 1280, height: 720 }` | Browser viewport size. |
329
+ | `headless` | `true` | Run browser in headless mode (`true` or `false`). |
330
+
331
+ ## 📊 Report Generation
332
+
333
+ Artes can generate Allure reports. After running tests with the `-r` flag, the reports will be stored in the `report` folder in HTML format. You can view them in your browser after the tests complete.
334
+
335
+ ---
336
+
337
+ ## 👍 Good To Use
338
+
339
+ If you don't use the -c or --create option that the package offers, save the file below under the `.vscode` folder:
340
+
341
+ - Those configurations will help autocomplete both predefined and custom step definitions in your features file
342
+
343
+ **extensions.json**
344
+
345
+ ```json
346
+ {
347
+ "recommendations": ["CucumberOpen.cucumber-official"]
348
+ }
349
+ ```
350
+
351
+ **settings.json**
352
+
353
+ ```json
354
+ {
355
+ "cucumber.glue": [
356
+ "tests/steps/*.{ts,js}",
357
+ "node_modules/artes/src/tests/stepDefinitions/*.{ts,js}"
358
+ ],
359
+ "cucumber.features": ["tests/features/*.features"],
360
+ "cucumberautocomplete.syncfeatures": true,
361
+ "cucumberautocomplete.strictGherkinCompletion": true
362
+ }
363
+ ```
364
+
365
+ ---
366
+
367
+ ## 🧑‍💻 Have a Good Testing