Skip to content

Commit 69bcf32

Browse files
christian-bromannchristian-bromann
committed
add example for dollar commands
1 parent d54b501 commit 69bcf32

File tree

5 files changed

+26
-122
lines changed

5 files changed

+26
-122
lines changed

‎packages/webdriverio/src/commands/browser/$$.ts‎

Lines changed: 4 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -20,42 +20,13 @@ import type { Selector, ElementArray } from '../../types.js'
2020
*
2121
* :::
2222
*
23-
* <example>
24-
:index.html
25-
<ul id="menu">
26-
<li><a href="/">Home</a></li>
27-
<li><a href="/">Developer Guide</a></li>
28-
<li><a href="/">API</a></li>
29-
<li><a href="/">Contribute</a></li>
30-
</ul>
31-
:$.js
32-
it('should get text a menu link', async () => {
33-
const text = await $$('#menu')[0];
34-
console.log(await text.$$('li')[2].$('a').getText()); // outputs: "API"
35-
});
36-
37-
it('should get text a menu link - JS Function', async () => {
38-
const text = await $$(function() { // Arrow function is not allowed here.
39-
// this is Window https://developer.mozilla.org/en-US/docs/Web/API/Window
40-
// TypeScript users may do something like this
41-
// return (this as Window).document.querySelectorAll('#menu')
42-
return this.document.querySelectorAll('#menu'); // Element[]
43-
})[0];
44-
console.log(await text.$$('li')[2].$('a').getText()); // outputs: "API"
45-
});
46-
47-
it('can create element array out of single elements', async () => {
48-
const red = await $('.red');
49-
const green = await $('.green');
50-
const elems = $$([red, green]);
51-
console.log(await elems.map((e) => e.getAttribute('class')));
52-
// returns "[ 'box red ui-droppable', 'box green' ]"
53-
});
54-
* </example>
55-
*
5623
* @alias $$
5724
* @param {String|Function} selector selector or JS Function to fetch multiple elements
5825
* @return {ElementArray}
26+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/example.html
27+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/multipleElements.js#L6-L7
28+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/multipleElements.js#L15-L24
29+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/multipleElements.js#L32-L39
5930
* @type utility
6031
*
6132
*/

‎packages/webdriverio/src/commands/browser/$.ts‎

Lines changed: 4 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -28,34 +28,7 @@ import type { ElementReference } from '@wdio/protocols'
2828
* :::
2929
*
3030
* <example>
31-
:index.html
32-
<ul id="menu">
33-
<li><a href="/">Home</a></li>
34-
<li><a href="/">Developer Guide</a></li>
35-
<li><a href="/">API</a></li>
36-
<li><a href="/">Contribute</a></li>
37-
</ul>
3831
:$.js
39-
it('should get text a menu link', async () => {
40-
const text = await $('#menu');
41-
console.log(await text.$$('li')[2].$('a').getText()); // outputs: "API"
42-
});
43-
44-
it('should get text a menu link - JS Function', async () => {
45-
const text = await $(function() { // Arrow function is not allowed here.
46-
// this is Window https://developer.mozilla.org/en-US/docs/Web/API/Window
47-
// TypeScript users may do something like this
48-
// return (this as Window).document.querySelector('#menu')
49-
return this.document.querySelector('#menu'); // Element
50-
});
51-
console.log(await text.$$('li')[2].$('a').getText()); // outputs: "API"
52-
});
53-
54-
it('should allow to convert protocol result of an element into a WebdriverIO element', async () => {
55-
const activeElement = await browser.getActiveElement();
56-
console.log(await $(activeElement).getTagName()); // outputs active element
57-
});
58-
5932
it('should use Androids DataMatcher or ViewMatcher selector', async () => {
6033
const menuItem = await $({
6134
"name": "hasEntry",
@@ -75,6 +48,10 @@ import type { ElementReference } from '@wdio/protocols'
7548
* @alias $
7649
* @param {String|Function|Matcher} selector selector, JS Function, or Matcher object to fetch a certain element
7750
* @return {Element}
51+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/example.html
52+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/singleElements.js#L9-L10
53+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/singleElements.js#L16-L25
54+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/singleElements.js#L42-L46
7855
* @type utility
7956
*
8057
*/

‎packages/webdriverio/src/commands/element/$$.ts‎

Lines changed: 4 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -9,35 +9,13 @@
99
*
1010
* :::
1111
*
12-
* <example>
13-
:index.html
14-
<ul id="menu">
15-
<li><a href="/">Home</a></li>
16-
<li><a href="/">Developer Guide</a></li>
17-
<li><a href="/">API</a></li>
18-
<li><a href="/">Contribute</a></li>
19-
</ul>
20-
:$.js
21-
it('should get text a menu link', async () => {
22-
const text = await $('#menu');
23-
console.log(await text.$$('li')[2].$('a').getText()); // outputs: "API"
24-
});
25-
26-
it('should get text a menu link - JS Function', async () => {
27-
const text = await $('#menu');
28-
console.log(await text.$$(function() { // Arrow function is not allowed here.
29-
// this is Element https://developer.mozilla.org/en-US/docs/Web/API/Element
30-
// in this particular example it is HTMLUListElement
31-
// TypeScript users may do something like this
32-
// return (this as Element).querySelectorAll('li')
33-
return this.querySelectorAll('li'); // Element[]
34-
})[2].$('a').getText()); // outputs: "API"
35-
});
36-
* </example>
37-
*
3812
* @alias $$
3913
* @param {String|Function|Matcher} selector selector, JS Function, or Matcher object to fetch multiple elements
4014
* @return {ElementArray}
15+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/example.html
16+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/multipleElements.js#L6-L7
17+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/multipleElements.js#L15-L24
18+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/multipleElements.js#L32-L39
4119
* @type utility
4220
*
4321
*/

‎packages/webdriverio/src/commands/element/$.ts‎

Lines changed: 4 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -16,35 +16,7 @@
1616
* :::
1717
*
1818
* <example>
19-
:index.html
20-
<ul id="menu">
21-
<li><a href="/">Home</a></li>
22-
<li><a href="/">Developer Guide</a></li>
23-
<li><a href="/">API</a></li>
24-
<li><a href="/">Contribute</a></li>
25-
</ul>
2619
:$.js
27-
it('should get text a menu link', async () => {
28-
const text = await $('#menu');
29-
console.log(await text.$$('li')[2].$('a').getText()); // outputs: "API"
30-
});
31-
32-
it('should get text a menu link - JS Function', async () => {
33-
const text = await $('#menu');
34-
console.log(await text.$$('li')[2].$(function() { // Arrow function is not allowed here.
35-
// this is Element https://developer.mozilla.org/en-US/docs/Web/API/Element
36-
// in this particular example it is HTMLLIElement
37-
// TypeScript users may do something like this
38-
// return (this as Element).querySelector('a')
39-
return this.querySelector('a'); // Element
40-
}).getText()); // outputs: "API"
41-
});
42-
43-
it('should allow to convert protocol result of an element into a WebdriverIO element', async () => {
44-
const activeElement = await browser.getActiveElement();
45-
console.log(await $(activeElement).getTagName()); // outputs active element
46-
});
47-
4820
it('should use Androids DataMatcher or ViewMatcher selector', async () => {
4921
const menuItem = await $({
5022
"name": "hasEntry",
@@ -64,6 +36,10 @@
6436
* @alias $
6537
* @param {String|Function|Matcher} selector selector, JS Function, or Matcher object to fetch a certain element
6638
* @return {Element}
39+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/example.html
40+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/singleElements.js#L9-L10
41+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/singleElements.js#L16-L25
42+
* @example https://github.com/webdriverio/example-recipes/blob/59c122c809d44d343c231bde2af7e8456c8f086c/queryElements/singleElements.js#L42-L46
6743
* @type utility
6844
*
6945
*/

‎scripts/templates/api.tpl.ejs‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -50,14 +50,10 @@ method.alternativeCommands
5050
<? }) ?>
5151
<? } ?>
5252

53-
<? if (method.examples.length || method.exampleReferences.length) { ?>
54-
##### Example<? if (method.examples.length > 1) { ?>s<? } ?>
55-
56-
<? method.examples.forEach(function(example) { ?>
57-
```<?= example.format ?><? if (example.file) { ?> title="<?= example.file ?>"<? } ?>
58-
<?- example.code ?>
59-
```
60-
<? }); ?>
53+
<?
54+
const allExamples = [...method.examples, ...method.exampleReferences]
55+
if (method.examples.length || method.exampleReferences.length) { ?>
56+
##### Example<? if (allExamples.length > 1) { ?>s<? } ?>
6157

6258
<? method.exampleReferences.forEach(function(ref) {
6359
var filename = path.basename(ref.split('#')[0])
@@ -68,6 +64,12 @@ method.alternativeCommands
6864
```
6965
<? }); ?>
7066

67+
<? method.examples.forEach(function(example) { ?>
68+
```<?= example.format ?><? if (example.file) { ?> title="<?= example.file ?>"<? } ?>
69+
<?- example.code ?>
70+
```
71+
<? }); ?>
72+
7173
<? } ?>
7274

7375
<? if (method.returns) { ?>

0 commit comments

Comments
 (0)