Catch if an element is not clickable (#141)

* Catch if an element is not clickable * rm old todo
drashland · Apr 29, 2024 · 185b471 · 185b471
1 parent 4208bb5
commit 185b471
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 7 deletions.
diff --git a/src/element.ts b/src/element.ts
@@ -260,13 +260,19 @@ export class Element {
     if (!options.button) options.button = "left";
 
     // Scroll into view
-    await this.#page.evaluate(
-      `${this.#method}('${this.#selector}').scrollIntoView({
-      block: 'center',
-      inline: 'center',
-      behavior: 'instant'
-    })`,
-    );
+    try {
+      await this.#page.evaluate(
+        `${this.#method}('${this.#selector}').scrollIntoView({
+        block: 'center',
+        inline: 'center',
+        behavior: 'instant'
+      })`,
+      );
+    } catch (_e) {
+      await this.#page.client.close(
+        `The given element ("${this.#selector}") is no longer present in the DOM`,
+      );
+    }
 
     // Get details we need for dispatching input events on the element
     const result = await this.#protocol.send<
@@ -279,6 +285,12 @@ export class Element {
       null,
       ProtocolTypes.Page.GetLayoutMetricsResponse
     >("Page.getLayoutMetrics");
+    if (!result || !result.quads.length) {
+      await this.#page.client.close(
+        `Node is either not clickable or not an HTMLElement`,
+      );
+    }
+
     // Ignoring because cssLayoutMetrics is present on chrome, but not firefox
     // deno-lint-ignore ban-ts-comment
     // @ts-ignore

diff --git a/tests/unit/element_test.ts b/tests/unit/element_test.ts
@@ -12,6 +12,32 @@ const serverAdd = `http://${
 for (const browserItem of browserList) {
   Deno.test(browserItem.name, async (t) => {
     await t.step("click()", async (t) => {
+      await t.step(
+        "It should fail if the element is no longer present in the DOM",
+        async () => {
+          const { page } = await buildFor(browserItem.name, {
+            remote,
+          });
+          await page.location("https://drash.land");
+          // Need to make the element either not clickable or not a HTMLElement
+          const selector = 'a[href="https://discord.gg/RFsCSaHRWK"]';
+          const elem = await page.querySelector(
+            selector,
+          );
+          await page.location("https://google.com");
+          let errMsg = "";
+          try {
+            await elem.click();
+          } catch (e) {
+            errMsg = e.message;
+          }
+          assertEquals(
+            errMsg,
+            `The given element ("${selector}") is no longer present in the DOM`,
+          );
+        },
+      );
+
       await t.step(
         "It should allow clicking of elements and update location",
         async () => {