From cd8e3c8854a592b726af85d3d2f170f3ca0b5b35 Mon Sep 17 00:00:00 2001
From: Gabriel Zayas <g-zayas@hotmail.com>
Date: Tue, 27 Jun 2023 19:12:55 +0900
Subject: [PATCH 1/2] Clean up JavaScript

---
 app/views/magic_test/_context_menu.html.erb   |  7 ++--
 app/views/magic_test/_finders.html            | 15 ++++----
 app/views/magic_test/_javascript_helpers.html | 34 +++++++++----------
 app/views/magic_test/_key_codes.html          |  3 +-
 app/views/magic_test/_mutation_observer.html  | 16 +++------
 app/views/magic_test/_storage.html            |  4 +--
 6 files changed, 34 insertions(+), 45 deletions(-)

diff --git a/app/views/magic_test/_context_menu.html.erb b/app/views/magic_test/_context_menu.html.erb
index 40370ca..9467937 100644
--- a/app/views/magic_test/_context_menu.html.erb
+++ b/app/views/magic_test/_context_menu.html.erb
@@ -11,9 +11,8 @@
     enableKeyboardShortcuts();
   });
 
-
   function enableKeyboardShortcuts() {
-    // Ctrl+A to generate an assertion
+    // Ctrl+A to generate an assertion.
     function keydown(event) {
       if (event.ctrlKey && event.shiftKey && event.key === 'A') {
         event.preventDefault();
@@ -31,6 +30,8 @@
         var target = "";
         var options = "";
         var accept = "You selected:\n\r" + text + "\n\rOk: Type `flush` into debugger console to add to test.\nCancel: To select new text."
+
+        // TODO: We should use try...catch here.
         if (window.confirm(accept)) {
           testingOutput.push({action: action, target: target, options: options});
           sessionStorage.setItem("testingOutput", JSON.stringify(testingOutput));
@@ -59,6 +60,8 @@
         var target = "";
         var options = "";
         var accept = "You selected:\n\r" + text + "\n\rOk: Type `flush` into debugger console to add to test.\nCancel: To select new text."
+
+        // TODO: We should use try...catch here.
         if (window.confirm(accept)) {
           testingOutput.push({action: action, target: target, options: options});
           sessionStorage.setItem("testingOutput", JSON.stringify(testingOutput));
diff --git a/app/views/magic_test/_finders.html b/app/views/magic_test/_finders.html
index eeb9eea..8e7c197 100644
--- a/app/views/magic_test/_finders.html
+++ b/app/views/magic_test/_finders.html
@@ -1,20 +1,19 @@
 <script>
-
   function getPathTo(element) {
     if (element.tagName === 'HTML') {
       return '/HTML[1]';
     }
-    if (element===document.body) {
+    if (element === document.body) {
       return '/HTML[1]/BODY[1]';
     }
     var ix = 0;
     var siblings = element.parentNode.childNodes;
-    for (var i= 0; i<siblings.length; i++) {
-      var sibling= siblings[i];
-      if (sibling===element) {
-        return getPathTo(element.parentNode)+'/'+element.tagName+'['+(ix+1)+']';
+    for (var i = 0; i < siblings.length; i++) {
+      var sibling = siblings[i];
+      if (sibling === element) {
+        return getPathTo(element.parentNode) + '/' + element.tagName + '[' + (ix + 1) + ']';
       }
-      if (sibling.nodeType===1 && sibling.tagName===element.tagName) {
+      if (sibling.nodeType === 1 && sibling.tagName === element.tagName) {
         ix++;
       }
     }
@@ -49,6 +48,4 @@
     // use the xpath to the element
     return `find(:xpath, '${getPathTo(element)}')`;
   }
-
-
 </script>
diff --git a/app/views/magic_test/_javascript_helpers.html b/app/views/magic_test/_javascript_helpers.html
index d9ff750..a0f89f4 100644
--- a/app/views/magic_test/_javascript_helpers.html
+++ b/app/views/magic_test/_javascript_helpers.html
@@ -1,31 +1,30 @@
 <script text="text/javascript">
-
   ready(function() {
-    console.log("🪄 Magic Test activated in the browser!")
+    console.log("🪄 Magic Test activated in the browser!");
     initializeStorage();
     initializeMutationObserver();
   });
 
   function clickFunction(event) {
-    var element = event.target
-    var tagName = element.tagName
-    var action = ""
-    var target = ""
-    var options = ""
+    var element = event.target;
+    var tagName = element.tagName;
+    var action = "";
+    var target = "";
+    var options = "";
     if (tagName == "BUTTON" || tagName == "A" || (tagName == "INPUT" && element.type == 'submit')) {
-      action = "click_on"
+      action = "click_on";
       target = element.value || element.text
       if (!target) {
         return;
       }
-      target = "\'" + target.trim().replace("'", "\\\'") + "\'"
+      target = "\'" + target.trim().replace("'", "\\\'") + "\'";
     } else if (tagName == "INPUT") {
-      let ignoreType = ['text', 'password', 'date', 'email', 'month', 'number', 'search']
+      let ignoreType = ['text', 'password', 'date', 'email', 'month', 'number', 'search'];
       if (ignoreType.includes(element.type)) {
         return;
       }
-      var path = getPathTo(element)
-      action = `find(:xpath, '${path}').click`
+      var path = getPathTo(element);
+      action = `find(:xpath, '${path}').click`;
     } else {
       return;
     }
@@ -65,8 +64,8 @@
     var charStr = capybaraFromCharCode(charCode);
     var letter = evt.key == "'" ? "\\\'" : evt.key;
     var tagName = evt.target.tagName.toLowerCase();
-    var action = finderForElement(evt.target) + "." // `find('${tagName}').`;
-    var target = ""
+    var action = finderForElement(evt.target) + "."; // `find('${tagName}').`;
+    var target = "";
     if (charStr) {
       target = `send_keys(${charStr})`;
     } else {
@@ -109,7 +108,7 @@
     var letter = String.fromCharCode(charCode);
     var tagName = evt.target.tagName.toLowerCase();
     var action = `find('${tagName}').`;
-    var target = ""
+    var target = "";
     if (charStr) {
       target = `send_keys(${charStr})`;
     } else {
@@ -120,14 +119,13 @@
     var lastAction = testingOutput[testingOutput.length - 1];
     if (lastAction && lastAction.action == action && lastAction.target.substr(0,9) == 'send_keys') {
       if (charStr) {
-        lastAction.target = lastAction.target.substr(0, lastAction.target.length - 1) + ', ' + charStr + '' + ')'
+        lastAction.target = lastAction.target.substr(0, lastAction.target.length - 1) + ', ' + charStr + '' + ')';
       } else {
-        lastAction.target = lastAction.target.substr(0, lastAction.target.length - 1) + ', \'' + letter + '\'' + ')'
+        lastAction.target = lastAction.target.substr(0, lastAction.target.length - 1) + ', \'' + letter + '\'' + ')';
       }
     } else {
       testingOutput.push({action: action, target: target, options: options});
     }
     sessionStorage.setItem("testingOutput", JSON.stringify(testingOutput));
   }
-
 </script>
diff --git a/app/views/magic_test/_key_codes.html b/app/views/magic_test/_key_codes.html
index ea99b4f..f867050 100644
--- a/app/views/magic_test/_key_codes.html
+++ b/app/views/magic_test/_key_codes.html
@@ -46,5 +46,4 @@
       }
       return codes[charCode];
     }
-
-</script>
\ No newline at end of file
+</script>
diff --git a/app/views/magic_test/_mutation_observer.html b/app/views/magic_test/_mutation_observer.html
index 9bf22eb..ea85bfd 100644
--- a/app/views/magic_test/_mutation_observer.html
+++ b/app/views/magic_test/_mutation_observer.html
@@ -1,15 +1,14 @@
 <script>
-
   function initializeMutationObserver(){
     window.mutationObserver = new MutationObserver(function(mutations) {
-      console.log("Mutation observed")
+      console.log("Mutation observed");
       if (!window.target) {
-        console.log("There is no window.target element. Quitting the mutation callback function");
+        console.log("There is no window.target element. Quitting the mutation callback function.");
         return;
       }
       var options = "";
-      var targetClass = window.target.classList[0] ? `.${window.target.classList[0]}` : ""
-      var text = window.target.innerText ? `', text: '${window.target.innerText}` : ""
+      var targetClass = window.target.classList[0] ? `.${window.target.classList[0]}` : "";
+      var text = window.target.innerText ? `', text: '${window.target.innerText}` : "";
       var action = `${finderForElement(window.target)}.hover`;
       // var action = `find('${window.target.localName}${targetClass}${text}').hover`;
       var target = "";
@@ -17,9 +16,6 @@
       testingOutput.push({action: action, target: target, options: options});
       sessionStorage.setItem("testingOutput", JSON.stringify(testingOutput));
     });
-    
-    
-    
   }
 
   function mutationStart(evt) {
@@ -31,6 +27,4 @@
   function mutationEnd () {
     window.mutationObserver.disconnect();
   }
-
-
-</script>
\ No newline at end of file
+</script>
diff --git a/app/views/magic_test/_storage.html b/app/views/magic_test/_storage.html
index ae85b24..dbbeb02 100644
--- a/app/views/magic_test/_storage.html
+++ b/app/views/magic_test/_storage.html
@@ -4,6 +4,4 @@
       sessionStorage.setItem("testingOutput", JSON.stringify([]));
     }
   }
-
-
-</script>
\ No newline at end of file
+</script>

From 30e05b36d8189d4397d12d7d8b21c614c82ee9ef Mon Sep 17 00:00:00 2001
From: Gabriel Zayas <g-zayas@hotmail.com>
Date: Tue, 27 Jun 2023 19:30:53 +0900
Subject: [PATCH 2/2] Remove TODOs about try...catch

---
 app/views/magic_test/_context_menu.html.erb | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/app/views/magic_test/_context_menu.html.erb b/app/views/magic_test/_context_menu.html.erb
index 9467937..81e01de 100644
--- a/app/views/magic_test/_context_menu.html.erb
+++ b/app/views/magic_test/_context_menu.html.erb
@@ -30,8 +30,6 @@
         var target = "";
         var options = "";
         var accept = "You selected:\n\r" + text + "\n\rOk: Type `flush` into debugger console to add to test.\nCancel: To select new text."
-
-        // TODO: We should use try...catch here.
         if (window.confirm(accept)) {
           testingOutput.push({action: action, target: target, options: options});
           sessionStorage.setItem("testingOutput", JSON.stringify(testingOutput));
@@ -60,8 +58,6 @@
         var target = "";
         var options = "";
         var accept = "You selected:\n\r" + text + "\n\rOk: Type `flush` into debugger console to add to test.\nCancel: To select new text."
-
-        // TODO: We should use try...catch here.
         if (window.confirm(accept)) {
           testingOutput.push({action: action, target: target, options: options});
           sessionStorage.setItem("testingOutput", JSON.stringify(testingOutput));