From 883417ebaff7428fb59a4d55bfb4dcf53c4d214a Mon Sep 17 00:00:00 2001
From: ankur22 <ankur.agarwal@grafana.com>
Date: Mon, 7 Oct 2024 09:33:46 +0100
Subject: [PATCH] Update queryAll example for v0.52

---
 .../k6-browser/page/doubledollar.md           | 28 ++++++++++++++-----
 1 file changed, 21 insertions(+), 7 deletions(-)

diff --git a/docs/sources/v0.52.x/javascript-api/k6-browser/page/doubledollar.md b/docs/sources/v0.52.x/javascript-api/k6-browser/page/doubledollar.md
index f83637685a..1d62609440 100644
--- a/docs/sources/v0.52.x/javascript-api/k6-browser/page/doubledollar.md
+++ b/docs/sources/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/<K6_VERSION>/javascript-api/k6-browser/page/locator/) instead.
+When possible, use locator-based [`page.locator(selector)`](https://grafana.com/docs/k6/<K6_VERSION>/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<ElementHandle[]>` | A Promise that fulfills with the [ElementHandle](https://grafana.com/docs/k6/<K6_VERSION>/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();
 }
 ```