@serenity-js/web 3.20.0 → 3.21.1
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.
- package/CHANGELOG.md +20 -0
- package/lib/screenplay/models/selectors/By.d.ts +45 -0
- package/lib/screenplay/models/selectors/By.d.ts.map +1 -1
- package/lib/screenplay/models/selectors/By.js +45 -0
- package/lib/screenplay/models/selectors/By.js.map +1 -1
- package/package.json +5 -5
- package/src/screenplay/models/selectors/By.ts +45 -0
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,26 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [3.21.1](https://github.com/serenity-js/serenity-js/compare/v3.21.0...v3.21.1) (2024-03-16)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* **core:** upgraded dependency on tiny-types to 1.22.0 ([2c0bb2a](https://github.com/serenity-js/serenity-js/commit/2c0bb2aeee7df7652853606c1ea10794157eb9fb))
|
|
12
|
+
* **web:** documented By ([69573aa](https://github.com/serenity-js/serenity-js/commit/69573aa6b4d669546af710bcf9683d1a24967a91))
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
# [3.21.0](https://github.com/serenity-js/serenity-js/compare/v3.20.0...v3.21.0) (2024-03-04)
|
|
19
|
+
|
|
20
|
+
**Note:** Version bump only for package @serenity-js/web
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
6
26
|
# [3.20.0](https://github.com/serenity-js/serenity-js/compare/v3.19.0...v3.20.0) (2024-03-02)
|
|
7
27
|
|
|
8
28
|
**Note:** Version bump only for package @serenity-js/web
|
|
@@ -6,6 +6,51 @@ import { ById } from './ById';
|
|
|
6
6
|
import { ByTagName } from './ByTagName';
|
|
7
7
|
import { ByXPath } from './ByXPath';
|
|
8
8
|
/**
|
|
9
|
+
* `By` produces a {@apilink Selector} used to locate a {@apilink PageElement} or {@apilink PageElements} on a web page.
|
|
10
|
+
* Selectors can be defined using a static value or a {@link Question} to be resolved at runtime.
|
|
11
|
+
*
|
|
12
|
+
* ### Defining a selector using a static value
|
|
13
|
+
*
|
|
14
|
+
* ```typescript
|
|
15
|
+
* import { PageElement, By } from '@serenity-js/web'
|
|
16
|
+
*
|
|
17
|
+
* class LoginForm {
|
|
18
|
+
* static usernameField = () =>
|
|
19
|
+
* PageElement.located(By.id('username')) // locate element by its id
|
|
20
|
+
* .describedAs('username field')
|
|
21
|
+
*
|
|
22
|
+
* static passwordField = () =>
|
|
23
|
+
* PageElement.of(By.css('[data-test="password"]')) // locate element using a CSS selector
|
|
24
|
+
* .describedAs('password field')
|
|
25
|
+
* }
|
|
26
|
+
* ```
|
|
27
|
+
*
|
|
28
|
+
* ### Defining a selector using a Question
|
|
29
|
+
*
|
|
30
|
+
* Each method on this class accepts an {@link Answerable} to allow for dynamic resolution of the selector.
|
|
31
|
+
* This can be useful when the selector is not known at the time of writing the test, or when the selector
|
|
32
|
+
* needs to be calculated based on the state of the system under test.
|
|
33
|
+
*
|
|
34
|
+
* The example below demonstrates how to use {@link q} to define a selector that includes a dynamic value.
|
|
35
|
+
*
|
|
36
|
+
* ```typescript
|
|
37
|
+
* import { q } from '@serenity-js/core'
|
|
38
|
+
* import { PageElement, By } from '@serenity-js/web'
|
|
39
|
+
*
|
|
40
|
+
* class FormField {
|
|
41
|
+
* static withTestId = (id: Answerable<string>) =>
|
|
42
|
+
* PageElement.of(By.css(q`input[data-test-id="${ id }"]`))
|
|
43
|
+
* .describedAs('form field')
|
|
44
|
+
* }
|
|
45
|
+
*
|
|
46
|
+
* ```
|
|
47
|
+
*
|
|
48
|
+
* ### Learn more
|
|
49
|
+
* - [Page Element Query Language](/handbook/web-testing/page-element-query-language)
|
|
50
|
+
* - {@apilink PageElement}
|
|
51
|
+
* - {@apilink PageElements}
|
|
52
|
+
* - {@apilink q}
|
|
53
|
+
*
|
|
9
54
|
* @group Models
|
|
10
55
|
*/
|
|
11
56
|
export declare class By {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"By.d.ts","sourceRoot":"","sources":["../../../../src/screenplay/models/selectors/By.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAK,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC
|
|
1
|
+
{"version":3,"file":"By.d.ts","sourceRoot":"","sources":["../../../../src/screenplay/models/selectors/By.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAK,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AACH,qBAAa,EAAE;IAEX;;;;OAIG;IACH,MAAM,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAU,CAAC,MAAM,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAOlE;;;;;;OAMG;IACH,MAAM,CAAC,iBAAiB,CAAC,QAAQ,EAAE,UAAU,CAAC,MAAM,CAAC,EAAE,IAAI,EAAE,UAAU,CAAC,MAAM,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,mBAAmB,CAAC,CAAC;IAQxH;;;;;OAKG;IACH,MAAM,CAAC,OAAO,CAAC,QAAQ,EAAE,UAAU,CAAC,MAAM,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAOtE;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,UAAU,CAAC,MAAM,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;IAOhE;;;;OAIG;IACH,MAAM,CAAC,OAAO,CAAC,QAAQ,EAAE,UAAU,CAAC,MAAM,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;IAO1E;;;;OAIG;IACH,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE,UAAU,CAAC,MAAM,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;CAMzE"}
|
|
@@ -9,6 +9,51 @@ const ById_1 = require("./ById");
|
|
|
9
9
|
const ByTagName_1 = require("./ByTagName");
|
|
10
10
|
const ByXPath_1 = require("./ByXPath");
|
|
11
11
|
/**
|
|
12
|
+
* `By` produces a {@apilink Selector} used to locate a {@apilink PageElement} or {@apilink PageElements} on a web page.
|
|
13
|
+
* Selectors can be defined using a static value or a {@link Question} to be resolved at runtime.
|
|
14
|
+
*
|
|
15
|
+
* ### Defining a selector using a static value
|
|
16
|
+
*
|
|
17
|
+
* ```typescript
|
|
18
|
+
* import { PageElement, By } from '@serenity-js/web'
|
|
19
|
+
*
|
|
20
|
+
* class LoginForm {
|
|
21
|
+
* static usernameField = () =>
|
|
22
|
+
* PageElement.located(By.id('username')) // locate element by its id
|
|
23
|
+
* .describedAs('username field')
|
|
24
|
+
*
|
|
25
|
+
* static passwordField = () =>
|
|
26
|
+
* PageElement.of(By.css('[data-test="password"]')) // locate element using a CSS selector
|
|
27
|
+
* .describedAs('password field')
|
|
28
|
+
* }
|
|
29
|
+
* ```
|
|
30
|
+
*
|
|
31
|
+
* ### Defining a selector using a Question
|
|
32
|
+
*
|
|
33
|
+
* Each method on this class accepts an {@link Answerable} to allow for dynamic resolution of the selector.
|
|
34
|
+
* This can be useful when the selector is not known at the time of writing the test, or when the selector
|
|
35
|
+
* needs to be calculated based on the state of the system under test.
|
|
36
|
+
*
|
|
37
|
+
* The example below demonstrates how to use {@link q} to define a selector that includes a dynamic value.
|
|
38
|
+
*
|
|
39
|
+
* ```typescript
|
|
40
|
+
* import { q } from '@serenity-js/core'
|
|
41
|
+
* import { PageElement, By } from '@serenity-js/web'
|
|
42
|
+
*
|
|
43
|
+
* class FormField {
|
|
44
|
+
* static withTestId = (id: Answerable<string>) =>
|
|
45
|
+
* PageElement.of(By.css(q`input[data-test-id="${ id }"]`))
|
|
46
|
+
* .describedAs('form field')
|
|
47
|
+
* }
|
|
48
|
+
*
|
|
49
|
+
* ```
|
|
50
|
+
*
|
|
51
|
+
* ### Learn more
|
|
52
|
+
* - [Page Element Query Language](/handbook/web-testing/page-element-query-language)
|
|
53
|
+
* - {@apilink PageElement}
|
|
54
|
+
* - {@apilink PageElements}
|
|
55
|
+
* - {@apilink q}
|
|
56
|
+
*
|
|
12
57
|
* @group Models
|
|
13
58
|
*/
|
|
14
59
|
class By {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"By.js","sourceRoot":"","sources":["../../../../src/screenplay/models/selectors/By.ts"],"names":[],"mappings":";;;AACA,4CAAgD;AAEhD,mCAAgC;AAChC,+DAA4D;AAC5D,2CAAwC;AACxC,iCAA8B;AAC9B,2CAAwC;AACxC,uCAAoC;AAEpC
|
|
1
|
+
{"version":3,"file":"By.js","sourceRoot":"","sources":["../../../../src/screenplay/models/selectors/By.ts"],"names":[],"mappings":";;;AACA,4CAAgD;AAEhD,mCAAgC;AAChC,+DAA4D;AAC5D,2CAAwC;AACxC,iCAA8B;AAC9B,2CAAwC;AACxC,uCAAoC;AAEpC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AACH,MAAa,EAAE;IAEX;;;;OAIG;IACH,MAAM,CAAC,GAAG,CAAC,QAA4B;QACnC,OAAO,eAAQ,CAAC,KAAK,CAAC,IAAA,QAAC,EAAA,WAAW,QAAQ,GAAG,EAAE,KAAK,EAAC,KAAK,EAAC,EAAE;YACzD,MAAM,UAAU,GAAG,MAAM,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;YAChD,OAAO,IAAI,aAAK,CAAC,UAAU,CAAC,CAAC;QACjC,CAAC,CAAC,CAAC;IACP,CAAC;IAED;;;;;;OAMG;IACH,MAAM,CAAC,iBAAiB,CAAC,QAA4B,EAAE,IAAwB;QAC3E,OAAO,eAAQ,CAAC,KAAK,CAAC,IAAA,QAAC,EAAA,WAAW,QAAQ,qBAAsB,IAAK,EAAE,EAAE,KAAK,EAAC,KAAK,EAAC,EAAE;YACnF,MAAM,UAAU,GAAG,MAAM,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;YAChD,MAAM,YAAY,GAAG,MAAM,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;YAC9C,OAAO,IAAI,yCAAmB,CAAC,UAAU,EAAE,YAAY,CAAC,CAAC;QAC7D,CAAC,CAAC,CAAC;IACP,CAAC;IAED;;;;;OAKG;IACH,MAAM,CAAC,OAAO,CAAC,QAA4B;QACvC,OAAO,eAAQ,CAAC,KAAK,CAAC,IAAA,QAAC,EAAA,gBAAgB,QAAQ,GAAG,EAAE,KAAK,EAAC,KAAK,EAAC,EAAE;YAC9D,MAAM,UAAU,GAAG,MAAM,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;YAChD,OAAO,IAAI,qBAAS,CAAC,UAAU,CAAC,CAAC;QACrC,CAAC,CAAC,CAAC;IACP,CAAC;IAED;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,QAA4B;QAClC,OAAO,eAAQ,CAAC,KAAK,CAAC,IAAA,QAAC,EAAA,UAAU,QAAQ,GAAG,EAAE,KAAK,EAAC,KAAK,EAAC,EAAE;YACxD,MAAM,UAAU,GAAG,MAAM,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;YAChD,OAAO,IAAI,WAAI,CAAC,UAAU,CAAC,CAAC;QAChC,CAAC,CAAC,CAAC;IACP,CAAC;IAED;;;;OAIG;IACH,MAAM,CAAC,OAAO,CAAC,QAA4B;QACvC,OAAO,eAAQ,CAAC,KAAK,CAAC,IAAA,QAAC,EAAA,gBAAgB,QAAQ,GAAG,EAAE,KAAK,EAAC,KAAK,EAAC,EAAE;YAC9D,MAAM,UAAU,GAAG,MAAM,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;YAChD,OAAO,IAAI,qBAAS,CAAC,UAAU,CAAC,CAAC;QACrC,CAAC,CAAC,CAAC;IACP,CAAC;IAED;;;;OAIG;IACH,MAAM,CAAC,KAAK,CAAC,QAA4B;QACrC,OAAO,eAAQ,CAAC,KAAK,CAAC,IAAA,QAAC,EAAA,aAAa,QAAQ,GAAG,EAAE,KAAK,EAAC,KAAK,EAAC,EAAE;YAC3D,MAAM,UAAU,GAAG,MAAM,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;YAChD,OAAO,IAAI,iBAAO,CAAC,UAAU,CAAC,CAAC;QACnC,CAAC,CAAC,CAAC;IACP,CAAC;CACJ;AA7ED,gBA6EC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@serenity-js/web",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.21.1",
|
|
4
4
|
"description": "Serenity/JS Screenplay Pattern APIs for the Web",
|
|
5
5
|
"author": {
|
|
6
6
|
"name": "Jan Molak",
|
|
@@ -45,9 +45,9 @@
|
|
|
45
45
|
"node": "^16.13 || ^18.12 || ^20"
|
|
46
46
|
},
|
|
47
47
|
"dependencies": {
|
|
48
|
-
"@serenity-js/assertions": "3.
|
|
49
|
-
"@serenity-js/core": "3.
|
|
50
|
-
"tiny-types": "1.
|
|
48
|
+
"@serenity-js/assertions": "3.21.1",
|
|
49
|
+
"@serenity-js/core": "3.21.1",
|
|
50
|
+
"tiny-types": "1.22.0"
|
|
51
51
|
},
|
|
52
52
|
"devDependencies": {
|
|
53
53
|
"@integration/testing-tools": "3.0.0",
|
|
@@ -59,5 +59,5 @@
|
|
|
59
59
|
"ts-node": "10.9.2",
|
|
60
60
|
"typescript": "5.2.2"
|
|
61
61
|
},
|
|
62
|
-
"gitHead": "
|
|
62
|
+
"gitHead": "34d2e43c9e6d504eea7c774ea8e872395cd94b98"
|
|
63
63
|
}
|
|
@@ -9,6 +9,51 @@ import { ByTagName } from './ByTagName';
|
|
|
9
9
|
import { ByXPath } from './ByXPath';
|
|
10
10
|
|
|
11
11
|
/**
|
|
12
|
+
* `By` produces a {@apilink Selector} used to locate a {@apilink PageElement} or {@apilink PageElements} on a web page.
|
|
13
|
+
* Selectors can be defined using a static value or a {@link Question} to be resolved at runtime.
|
|
14
|
+
*
|
|
15
|
+
* ### Defining a selector using a static value
|
|
16
|
+
*
|
|
17
|
+
* ```typescript
|
|
18
|
+
* import { PageElement, By } from '@serenity-js/web'
|
|
19
|
+
*
|
|
20
|
+
* class LoginForm {
|
|
21
|
+
* static usernameField = () =>
|
|
22
|
+
* PageElement.located(By.id('username')) // locate element by its id
|
|
23
|
+
* .describedAs('username field')
|
|
24
|
+
*
|
|
25
|
+
* static passwordField = () =>
|
|
26
|
+
* PageElement.of(By.css('[data-test="password"]')) // locate element using a CSS selector
|
|
27
|
+
* .describedAs('password field')
|
|
28
|
+
* }
|
|
29
|
+
* ```
|
|
30
|
+
*
|
|
31
|
+
* ### Defining a selector using a Question
|
|
32
|
+
*
|
|
33
|
+
* Each method on this class accepts an {@link Answerable} to allow for dynamic resolution of the selector.
|
|
34
|
+
* This can be useful when the selector is not known at the time of writing the test, or when the selector
|
|
35
|
+
* needs to be calculated based on the state of the system under test.
|
|
36
|
+
*
|
|
37
|
+
* The example below demonstrates how to use {@link q} to define a selector that includes a dynamic value.
|
|
38
|
+
*
|
|
39
|
+
* ```typescript
|
|
40
|
+
* import { q } from '@serenity-js/core'
|
|
41
|
+
* import { PageElement, By } from '@serenity-js/web'
|
|
42
|
+
*
|
|
43
|
+
* class FormField {
|
|
44
|
+
* static withTestId = (id: Answerable<string>) =>
|
|
45
|
+
* PageElement.of(By.css(q`input[data-test-id="${ id }"]`))
|
|
46
|
+
* .describedAs('form field')
|
|
47
|
+
* }
|
|
48
|
+
*
|
|
49
|
+
* ```
|
|
50
|
+
*
|
|
51
|
+
* ### Learn more
|
|
52
|
+
* - [Page Element Query Language](/handbook/web-testing/page-element-query-language)
|
|
53
|
+
* - {@apilink PageElement}
|
|
54
|
+
* - {@apilink PageElements}
|
|
55
|
+
* - {@apilink q}
|
|
56
|
+
*
|
|
12
57
|
* @group Models
|
|
13
58
|
*/
|
|
14
59
|
export class By {
|