From 114ec695ab46af96177d899425998dfade3d81d3 Mon Sep 17 00:00:00 2001 From: ankur22 Date: Mon, 7 Oct 2024 09:29:03 +0100 Subject: [PATCH 1/7] Update the example in query all. After some feedback from the community, the new example is more valuable than the previous one. Added some more text to help the reader understand when it might be ok to work with this API. --- .../k6-browser/page/doubledollar.md | 28 ++++++++++++++----- 1 file changed, 21 insertions(+), 7 deletions(-) diff --git a/docs/sources/k6/next/javascript-api/k6-browser/page/doubledollar.md b/docs/sources/k6/next/javascript-api/k6-browser/page/doubledollar.md index f83637685a..1d62609440 100644 --- a/docs/sources/k6/next/javascript-api/k6-browser/page/doubledollar.md +++ b/docs/sources/k6/next/javascript-api/k6-browser/page/doubledollar.md @@ -8,16 +8,18 @@ description: 'Browser module: page.$$(selector) method' {{< admonition type="warning" >}} -Use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. +When possible, use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. + +However, working with `locator`s might not be possible when trying to select an element from a list or table if it's difficult to find a stable and unique way to identify the element. {{< /admonition >}} -The method finds all elements matching the specified selector within the page. If no elements match the selector, the return value resolves to `[]`. +The method finds all elements matching the specified selector within the page. If no elements match the selector, the return value resolves to `[]`. This is particularly useful when you want to retrieve a list of elements, and iterate through them to find the one that you need for your test case. ### Returns -| Type | Description | -| -------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| Type | Description | +| -------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `Promise` | A Promise that fulfills with the [ElementHandle](https://grafana.com/docs/k6//javascript-api/k6-browser/elementhandle/) array of the selector when matching elements are found. | ### Example @@ -43,9 +45,21 @@ export const options = { export default async function () { const page = await browser.newPage(); - await page.goto('https://test.k6.io/browser.php'); - const text = await page.$$('#text1')[0]; - await text.type('hello world'); + await page.goto('https://test.k6.io/'); + + // Retrieve all the td elements. + const cells = await page.$$('td'); + for (let i = 0; i < cells.length; i++) { + if ((await cells[i].innerText()) == '/pi.php?decimals=3') { + // When the element is found, click on it and + // wait for the navigation. + await Promise.all([page.waitForNavigation(), cells[i].click()]); + break; + } + } + + // Wait for an important element to load. + await page.locator('//pre[text()="3.141"]').waitFor(); } ``` From c2e4d34aad33a924a0adda2b95bf0f244ceb90a9 Mon Sep 17 00:00:00 2001 From: ankur22 Date: Mon, 7 Oct 2024 09:31:40 +0100 Subject: [PATCH 2/7] Update queryAll example in v0.54 docs --- .../k6-browser/page/doubledollar.md | 24 +++++++++++++++---- 1 file changed, 19 insertions(+), 5 deletions(-) diff --git a/docs/sources/k6/v0.53.x/javascript-api/k6-browser/page/doubledollar.md b/docs/sources/k6/v0.53.x/javascript-api/k6-browser/page/doubledollar.md index 9f56c791f0..1d62609440 100644 --- a/docs/sources/k6/v0.53.x/javascript-api/k6-browser/page/doubledollar.md +++ b/docs/sources/k6/v0.53.x/javascript-api/k6-browser/page/doubledollar.md @@ -8,11 +8,13 @@ description: 'Browser module: page.$$(selector) method' {{< admonition type="warning" >}} -Use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. +When possible, use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. + +However, working with `locator`s might not be possible when trying to select an element from a list or table if it's difficult to find a stable and unique way to identify the element. {{< /admonition >}} -The method finds all elements matching the specified selector within the page. If no elements match the selector, the return value resolves to `[]`. +The method finds all elements matching the specified selector within the page. If no elements match the selector, the return value resolves to `[]`. This is particularly useful when you want to retrieve a list of elements, and iterate through them to find the one that you need for your test case. ### Returns @@ -43,9 +45,21 @@ export const options = { export default async function () { const page = await browser.newPage(); - await page.goto('https://test.k6.io/browser.php'); - const text = await page.$$('#text1')[0]; - await text.type('hello world'); + await page.goto('https://test.k6.io/'); + + // Retrieve all the td elements. + const cells = await page.$$('td'); + for (let i = 0; i < cells.length; i++) { + if ((await cells[i].innerText()) == '/pi.php?decimals=3') { + // When the element is found, click on it and + // wait for the navigation. + await Promise.all([page.waitForNavigation(), cells[i].click()]); + break; + } + } + + // Wait for an important element to load. + await page.locator('//pre[text()="3.141"]').waitFor(); } ``` From 4fdc7af04e34985768e03f6a7e51c14f1c9238ee Mon Sep 17 00:00:00 2001 From: ankur22 Date: Mon, 7 Oct 2024 09:33:46 +0100 Subject: [PATCH 3/7] Update queryAll example for v0.52 --- .../k6-browser/page/doubledollar.md | 28 ++++++++++++++----- 1 file changed, 21 insertions(+), 7 deletions(-) diff --git a/docs/sources/k6/v0.52.x/javascript-api/k6-browser/page/doubledollar.md b/docs/sources/k6/v0.52.x/javascript-api/k6-browser/page/doubledollar.md index f83637685a..1d62609440 100644 --- a/docs/sources/k6/v0.52.x/javascript-api/k6-browser/page/doubledollar.md +++ b/docs/sources/k6/v0.52.x/javascript-api/k6-browser/page/doubledollar.md @@ -8,16 +8,18 @@ description: 'Browser module: page.$$(selector) method' {{< admonition type="warning" >}} -Use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. +When possible, use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. + +However, working with `locator`s might not be possible when trying to select an element from a list or table if it's difficult to find a stable and unique way to identify the element. {{< /admonition >}} -The method finds all elements matching the specified selector within the page. If no elements match the selector, the return value resolves to `[]`. +The method finds all elements matching the specified selector within the page. If no elements match the selector, the return value resolves to `[]`. This is particularly useful when you want to retrieve a list of elements, and iterate through them to find the one that you need for your test case. ### Returns -| Type | Description | -| -------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| Type | Description | +| -------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `Promise` | A Promise that fulfills with the [ElementHandle](https://grafana.com/docs/k6//javascript-api/k6-browser/elementhandle/) array of the selector when matching elements are found. | ### Example @@ -43,9 +45,21 @@ export const options = { export default async function () { const page = await browser.newPage(); - await page.goto('https://test.k6.io/browser.php'); - const text = await page.$$('#text1')[0]; - await text.type('hello world'); + await page.goto('https://test.k6.io/'); + + // Retrieve all the td elements. + const cells = await page.$$('td'); + for (let i = 0; i < cells.length; i++) { + if ((await cells[i].innerText()) == '/pi.php?decimals=3') { + // When the element is found, click on it and + // wait for the navigation. + await Promise.all([page.waitForNavigation(), cells[i].click()]); + break; + } + } + + // Wait for an important element to load. + await page.locator('//pre[text()="3.141"]').waitFor(); } ``` From 84b200543ccf5535c5716d3797aabef79d0db9a0 Mon Sep 17 00:00:00 2001 From: ankur22 Date: Mon, 7 Oct 2024 09:34:06 +0100 Subject: [PATCH 4/7] Update queryAll example for v0.53 --- .../k6-browser/page/doubledollar.md | 24 +++++++++++++++---- 1 file changed, 19 insertions(+), 5 deletions(-) diff --git a/docs/sources/k6/v0.54.x/javascript-api/k6-browser/page/doubledollar.md b/docs/sources/k6/v0.54.x/javascript-api/k6-browser/page/doubledollar.md index 9f56c791f0..1d62609440 100644 --- a/docs/sources/k6/v0.54.x/javascript-api/k6-browser/page/doubledollar.md +++ b/docs/sources/k6/v0.54.x/javascript-api/k6-browser/page/doubledollar.md @@ -8,11 +8,13 @@ description: 'Browser module: page.$$(selector) method' {{< admonition type="warning" >}} -Use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. +When possible, use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. + +However, working with `locator`s might not be possible when trying to select an element from a list or table if it's difficult to find a stable and unique way to identify the element. {{< /admonition >}} -The method finds all elements matching the specified selector within the page. If no elements match the selector, the return value resolves to `[]`. +The method finds all elements matching the specified selector within the page. If no elements match the selector, the return value resolves to `[]`. This is particularly useful when you want to retrieve a list of elements, and iterate through them to find the one that you need for your test case. ### Returns @@ -43,9 +45,21 @@ export const options = { export default async function () { const page = await browser.newPage(); - await page.goto('https://test.k6.io/browser.php'); - const text = await page.$$('#text1')[0]; - await text.type('hello world'); + await page.goto('https://test.k6.io/'); + + // Retrieve all the td elements. + const cells = await page.$$('td'); + for (let i = 0; i < cells.length; i++) { + if ((await cells[i].innerText()) == '/pi.php?decimals=3') { + // When the element is found, click on it and + // wait for the navigation. + await Promise.all([page.waitForNavigation(), cells[i].click()]); + break; + } + } + + // Wait for an important element to load. + await page.locator('//pre[text()="3.141"]').waitFor(); } ``` From 75adfe57b49f7a7b2e9a1b235159cda0270be75a Mon Sep 17 00:00:00 2001 From: Ankur Date: Tue, 8 Oct 2024 14:34:23 +0100 Subject: [PATCH 5/7] Update docs/sources/next/javascript-api/k6-browser/page/doubledollar.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: İnanç Gümüş --- .../k6/next/javascript-api/k6-browser/page/doubledollar.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/sources/k6/next/javascript-api/k6-browser/page/doubledollar.md b/docs/sources/k6/next/javascript-api/k6-browser/page/doubledollar.md index 1d62609440..70f7ee194e 100644 --- a/docs/sources/k6/next/javascript-api/k6-browser/page/doubledollar.md +++ b/docs/sources/k6/next/javascript-api/k6-browser/page/doubledollar.md @@ -10,7 +10,7 @@ description: 'Browser module: page.$$(selector) method' When possible, use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. -However, working with `locator`s might not be possible when trying to select an element from a list or table if it's difficult to find a stable and unique way to identify the element. +However, using `locator`s may not always work when selecting an element from a list or table, especially if there isn't a reliable way to consistently identify a single element (e.g., due to changing or similar attributes). In such cases, $$ remains useful. {{< /admonition >}} From bbf3887cdef31d02e9cf37d6071f211efc71ad27 Mon Sep 17 00:00:00 2001 From: ankur22 Date: Wed, 11 Dec 2024 11:19:11 +0000 Subject: [PATCH 6/7] Update copy for page.queryAll --- .../k6/next/javascript-api/k6-browser/page/doubledollar.md | 2 +- .../k6/v0.52.x/javascript-api/k6-browser/page/doubledollar.md | 2 +- .../k6/v0.53.x/javascript-api/k6-browser/page/doubledollar.md | 2 +- .../k6/v0.54.x/javascript-api/k6-browser/page/doubledollar.md | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/docs/sources/k6/next/javascript-api/k6-browser/page/doubledollar.md b/docs/sources/k6/next/javascript-api/k6-browser/page/doubledollar.md index 70f7ee194e..7ef2c70d2c 100644 --- a/docs/sources/k6/next/javascript-api/k6-browser/page/doubledollar.md +++ b/docs/sources/k6/next/javascript-api/k6-browser/page/doubledollar.md @@ -10,7 +10,7 @@ description: 'Browser module: page.$$(selector) method' When possible, use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. -However, using `locator`s may not always work when selecting an element from a list or table, especially if there isn't a reliable way to consistently identify a single element (e.g., due to changing or similar attributes). In such cases, $$ remains useful. +However, using `locator`s may not always work when selecting an element from a list or table, especially if there isn't a reliable way to consistently identify a single element (for example, due to changing or non-unique attributes). In such cases, `$$` remains useful. {{< /admonition >}} diff --git a/docs/sources/k6/v0.52.x/javascript-api/k6-browser/page/doubledollar.md b/docs/sources/k6/v0.52.x/javascript-api/k6-browser/page/doubledollar.md index 1d62609440..7ef2c70d2c 100644 --- a/docs/sources/k6/v0.52.x/javascript-api/k6-browser/page/doubledollar.md +++ b/docs/sources/k6/v0.52.x/javascript-api/k6-browser/page/doubledollar.md @@ -10,7 +10,7 @@ description: 'Browser module: page.$$(selector) method' When possible, use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. -However, working with `locator`s might not be possible when trying to select an element from a list or table if it's difficult to find a stable and unique way to identify the element. +However, using `locator`s may not always work when selecting an element from a list or table, especially if there isn't a reliable way to consistently identify a single element (for example, due to changing or non-unique attributes). In such cases, `$$` remains useful. {{< /admonition >}} diff --git a/docs/sources/k6/v0.53.x/javascript-api/k6-browser/page/doubledollar.md b/docs/sources/k6/v0.53.x/javascript-api/k6-browser/page/doubledollar.md index 1d62609440..7ef2c70d2c 100644 --- a/docs/sources/k6/v0.53.x/javascript-api/k6-browser/page/doubledollar.md +++ b/docs/sources/k6/v0.53.x/javascript-api/k6-browser/page/doubledollar.md @@ -10,7 +10,7 @@ description: 'Browser module: page.$$(selector) method' When possible, use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. -However, working with `locator`s might not be possible when trying to select an element from a list or table if it's difficult to find a stable and unique way to identify the element. +However, using `locator`s may not always work when selecting an element from a list or table, especially if there isn't a reliable way to consistently identify a single element (for example, due to changing or non-unique attributes). In such cases, `$$` remains useful. {{< /admonition >}} diff --git a/docs/sources/k6/v0.54.x/javascript-api/k6-browser/page/doubledollar.md b/docs/sources/k6/v0.54.x/javascript-api/k6-browser/page/doubledollar.md index 1d62609440..7ef2c70d2c 100644 --- a/docs/sources/k6/v0.54.x/javascript-api/k6-browser/page/doubledollar.md +++ b/docs/sources/k6/v0.54.x/javascript-api/k6-browser/page/doubledollar.md @@ -10,7 +10,7 @@ description: 'Browser module: page.$$(selector) method' When possible, use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. -However, working with `locator`s might not be possible when trying to select an element from a list or table if it's difficult to find a stable and unique way to identify the element. +However, using `locator`s may not always work when selecting an element from a list or table, especially if there isn't a reliable way to consistently identify a single element (for example, due to changing or non-unique attributes). In such cases, `$$` remains useful. {{< /admonition >}} From ba0f317588ee805e26a346789d885032267b68f5 Mon Sep 17 00:00:00 2001 From: ankur22 Date: Wed, 11 Dec 2024 11:20:23 +0000 Subject: [PATCH 7/7] Update page.queryAll for v0.55 --- .../k6-browser/page/doubledollar.md | 28 ++++++++++++++----- 1 file changed, 21 insertions(+), 7 deletions(-) diff --git a/docs/sources/k6/v0.55.x/javascript-api/k6-browser/page/doubledollar.md b/docs/sources/k6/v0.55.x/javascript-api/k6-browser/page/doubledollar.md index f83637685a..7ef2c70d2c 100644 --- a/docs/sources/k6/v0.55.x/javascript-api/k6-browser/page/doubledollar.md +++ b/docs/sources/k6/v0.55.x/javascript-api/k6-browser/page/doubledollar.md @@ -8,16 +8,18 @@ description: 'Browser module: page.$$(selector) method' {{< admonition type="warning" >}} -Use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. +When possible, use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6//javascript-api/k6-browser/page/locator/) instead. + +However, using `locator`s may not always work when selecting an element from a list or table, especially if there isn't a reliable way to consistently identify a single element (for example, due to changing or non-unique attributes). In such cases, `$$` remains useful. {{< /admonition >}} -The method finds all elements matching the specified selector within the page. If no elements match the selector, the return value resolves to `[]`. +The method finds all elements matching the specified selector within the page. If no elements match the selector, the return value resolves to `[]`. This is particularly useful when you want to retrieve a list of elements, and iterate through them to find the one that you need for your test case. ### Returns -| Type | Description | -| -------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| Type | Description | +| -------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `Promise` | A Promise that fulfills with the [ElementHandle](https://grafana.com/docs/k6//javascript-api/k6-browser/elementhandle/) array of the selector when matching elements are found. | ### Example @@ -43,9 +45,21 @@ export const options = { export default async function () { const page = await browser.newPage(); - await page.goto('https://test.k6.io/browser.php'); - const text = await page.$$('#text1')[0]; - await text.type('hello world'); + await page.goto('https://test.k6.io/'); + + // Retrieve all the td elements. + const cells = await page.$$('td'); + for (let i = 0; i < cells.length; i++) { + if ((await cells[i].innerText()) == '/pi.php?decimals=3') { + // When the element is found, click on it and + // wait for the navigation. + await Promise.all([page.waitForNavigation(), cells[i].click()]); + break; + } + } + + // Wait for an important element to load. + await page.locator('//pre[text()="3.141"]').waitFor(); } ```