npm - @vardot/varbase-e2e - Versions diffs - 2.0.0 - Mend

@vardot/varbase-e2e 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (301) hide show

package/AGENTS.md +148 -0
package/CLAUDE.md +544 -0
package/README.md +22 -0
package/bin/generate-reports.js +363 -0
package/bin/init-varbase-e2e.js +330 -0
package/bin/postinstall.js +26 -0
package/cucumber.js +125 -0
package/docs/00-quick-start.md +102 -0
package/docs/01-getting-started.md +102 -0
package/docs/02-bbr-smart-waits.md +77 -0
package/docs/03-selector-registry.md +95 -0
package/docs/04-step-reference.md +801 -0
package/docs/05-web-first-assertions.md +91 -0
package/docs/06-network-and-dialogs.md +83 -0
package/docs/07-auth-state.md +75 -0
package/docs/08-clock-mocking.md +59 -0
package/docs/09-api-testing.md +114 -0
package/docs/10-accessibility.md +167 -0
package/docs/11-debugging.md +129 -0
package/docs/12-ai-agent-guide.md +338 -0
package/docs/13-faq.md +236 -0
package/docs/14-recipes-cookbook.md +255 -0
package/docs/15-tag-conventions.md +76 -0
package/docs/16-ci-cd.md +90 -0
package/docs/README.md +125 -0
package/docs/advanced-screenshots/then-i-save-fullscreen-screenshot.md +36 -0
package/docs/advanced-screenshots/then-i-save-width-x-height-screenshot.md +34 -0
package/docs/advanced-screenshots/when-i-save-screenshot-name-filename.md +45 -0
package/docs/advanced-screenshots.md +52 -0
package/docs/advanced-selectors.md +18 -0
package/docs/api-step-definitions.md +45 -0
package/docs/global-settings.md +267 -0
package/docs/install-varbase-e2e/ddev-varbase-e2e.md +52 -0
package/docs/install-varbase-e2e.md +34 -0
package/docs/overview.md +40 -0
package/docs/step-definitions/given-i-am-anonymous-user.md +67 -0
package/docs/step-definitions/given-i-am-homepage.md +68 -0
package/docs/step-definitions/given-i-am-specific-page.md +72 -0
package/docs/step-definitions/then-i-should-be.md +56 -0
package/docs/step-definitions/then-i-should-see.md +62 -0
package/docs/step-definitions/then-item-checkbox.md +54 -0
package/docs/step-definitions/then-item-link-should-contain-url.md +84 -0
package/docs/step-definitions/then-item-should-contain.md +67 -0
package/docs/step-definitions/then-radio-button-value-should-be-selected.md +68 -0
package/docs/step-definitions/then-response-status-code-should-be-number.md +69 -0
package/docs/step-definitions/then-value-radio-button-selected.md +62 -0
package/docs/step-definitions/when-i-attach-file-file-name-element.md +71 -0
package/docs/step-definitions/when-i-check-checkbox.md +60 -0
package/docs/step-definitions/when-i-click-link.md +51 -0
package/docs/step-definitions/when-i-click-operation-text-row.md +71 -0
package/docs/step-definitions/when-i-fill.md +59 -0
package/docs/step-definitions/when-i-go-homepage.md +60 -0
package/docs/step-definitions/when-i-go-specific-page.md +67 -0
package/docs/step-definitions/when-i-move-backward-one-page.md +49 -0
package/docs/step-definitions/when-i-move-forward-one-page.md +58 -0
package/docs/step-definitions/when-i-press-button.md +58 -0
package/docs/step-definitions/when-i-reload-page.md +51 -0
package/docs/step-definitions/when-i-scroll.md +73 -0
package/docs/step-definitions/when-i-select-option-select-list.md +53 -0
package/docs/step-definitions/when-i-select-radio-button-value.md +62 -0
package/docs/step-definitions/when-i-uncheck-checkbox.md +57 -0
package/docs/step-definitions/when-i-wait-ajax-finish.md +64 -0
package/docs/step-definitions/when-i-wait.md +62 -0
package/docs/step-definitions.md +82 -0
package/docs/steps/README.md +137 -0
package/docs/steps/a11y.md +731 -0
package/docs/steps/action.md +181 -0
package/docs/steps/api.md +679 -0
package/docs/steps/assertion.md +328 -0
package/docs/steps/auth.md +108 -0
package/docs/steps/clock.md +171 -0
package/docs/steps/cookie.md +293 -0
package/docs/steps/debug.md +52 -0
package/docs/steps/dialog.md +226 -0
package/docs/steps/drupal-canvas.md +414 -0
package/docs/steps/drupal-ckeditor.md +118 -0
package/docs/steps/drupal-core.md +688 -0
package/docs/steps/drupal-layout-builder.md +437 -0
package/docs/steps/drupal-media.md +107 -0
package/docs/steps/drupal-moderation.md +81 -0
package/docs/steps/drupal-paragraphs.md +36 -0
package/docs/steps/element.md +455 -0
package/docs/steps/field.md +648 -0
package/docs/steps/file-download.md +235 -0
package/docs/steps/form.md +344 -0
package/docs/steps/iframe.md +248 -0
package/docs/steps/input.md +220 -0
package/docs/steps/javascript.md +111 -0
package/docs/steps/keyboard.md +107 -0
package/docs/steps/link.md +217 -0
package/docs/steps/metatag.md +99 -0
package/docs/steps/modal.md +232 -0
package/docs/steps/navigation.md +275 -0
package/docs/steps/network.md +284 -0
package/docs/steps/path.md +203 -0
package/docs/steps/response.md +102 -0
package/docs/steps/responsive.md +139 -0
package/docs/steps/rest.md +140 -0
package/docs/steps/screenshot.md +211 -0
package/docs/steps/scroll.md +266 -0
package/docs/steps/selectors.md +848 -0
package/docs/steps/storage.md +254 -0
package/docs/steps/table.md +216 -0
package/docs/steps/varbase.md +391 -0
package/docs/steps/video.md +111 -0
package/docs/steps/wait.md +553 -0
package/docs/steps/web-first.md +289 -0
package/docs/steps/xml.md +505 -0
package/docs/steps/yaml.md +951 -0
package/examples/a11y.html +31 -0
package/examples/about-us.html +11 -0
package/examples/account.html +32 -0
package/examples/ajax-wait-examples.html +147 -0
package/examples/contact-us.html +10 -0
package/examples/cookies.html +10 -0
package/examples/date.html +12 -0
package/examples/dynamic-examples.html +498 -0
package/examples/element.html +11 -0
package/examples/example-api.json +28 -0
package/examples/existing-page.html +11 -0
package/examples/field.html +24 -0
package/examples/index.html +37 -0
package/examples/keyboard.html +11 -0
package/examples/links.html +9 -0
package/examples/modal.html +14 -0
package/examples/path.html +3 -0
package/examples/table.html +13 -0
package/examples/test--modal-dialogs.html +252 -0
package/examples/test--then--i-should--not--see-text-in-element.html +48 -0
package/examples/test--then--i-should--see-text-in-element.html +48 -0
package/examples/test--then--i-should--see-text-matching-pattern.html +31 -0
package/examples/test--then--i-should-see-text-in-table-row.html +232 -0
package/examples/test--then--the-checkbox-checked.html +68 -0
package/examples/test--then--the-element-should_not-contain-cssproperty.html +47 -0
package/examples/test--then--the-link-should-contain.html +21 -0
package/examples/test--when--i-additionally-select.html +27 -0
package/examples/test--when--i-attach-file-to-feild.html +50 -0
package/examples/test--when--i-check-uncheck-checkbox.html +47 -0
package/examples/test--when--i-click-link.html +18 -0
package/examples/test--when--i-click-text-in-table-row.html +178 -0
package/examples/test--when--i-fill-in.html +48 -0
package/examples/test--when--i-press-button.html +31 -0
package/examples/test--when--i-reload-page.html +27 -0
package/examples/test--when--i-scroll-functionality.html +177 -0
package/examples/test--when--i-scroll-left-right-functionality.html +149 -0
package/examples/test--when--i-select-option-from-dropdownlist.html +35 -0
package/examples/test--when--i-select-radio-button.html +95 -0
package/examples/test--when-i-wait-max-of-time.html +39 -0
package/examples/test--when-i-wait-page-until-is-loaded.html +47 -0
package/examples/test--when-i-wait-specific-time.html +39 -0
package/examples/test-acceptable-url-path.html +11 -0
package/examples/video-demo.html +43 -0
package/package.json +56 -0
package/playwright.config.ts +39 -0
package/tests/assets/test-document.pdf +14 -0
package/tests/assets/vardot.png +0 -0
package/tests/features/a11y.feature +39 -0
package/tests/features/ajax-wait-examples.feature +24 -0
package/tests/features/api-step-definitions-individual.feature +185 -0
package/tests/features/complete-api-testing-examples.feature +205 -0
package/tests/features/cookie.feature +13 -0
package/tests/features/date.feature +11 -0
package/tests/features/dynamic-content-examples.feature +156 -0
package/tests/features/element.feature +16 -0
package/tests/features/field.feature +25 -0
package/tests/features/keyboard.feature +10 -0
package/tests/features/link.feature +11 -0
package/tests/features/modal-advanced-example.feature +54 -0
package/tests/features/modal-basic-example.feature +42 -0
package/tests/features/modal-error-handling-example.feature +37 -0
package/tests/features/modal.feature +11 -0
package/tests/features/path.feature +16 -0
package/tests/features/response.feature +8 -0
package/tests/features/responsive.feature +10 -0
package/tests/features/table.feature +18 -0
package/tests/features/test--given--i-am-an-anonymous-user.feature +10 -0
package/tests/features/test--given--i-am-on-homepage.feature +16 -0
package/tests/features/test--then--i-save-screenshot.feature +33 -0
package/tests/features/test--then--i-see-locator.feature +320 -0
package/tests/features/test--then--i-should--not--see-text-in-element.feature +13 -0
package/tests/features/test--then--i-should--see-text-in-element-by-attr.feature +10 -0
package/tests/features/test--then--i-should--see-text-in-element.feature +10 -0
package/tests/features/test--then--i-should--see-text-matching-pattern-in-element.feature +13 -0
package/tests/features/test--then--i-should--see-text-matching-pattern.feature +18 -0
package/tests/features/test--then--i-should-be-on-page.feature +10 -0
package/tests/features/test--then--i-should-be-on-the-homepage.feature +10 -0
package/tests/features/test--then--i-should-not-see-an-element-by-attr.feature +8 -0
package/tests/features/test--then--i-should-not-see-an-element.feature +8 -0
package/tests/features/test--then--i-should-see-an-element-by-attr.feature +8 -0
package/tests/features/test--then--i-should-see-an-element.feature +8 -0
package/tests/features/test--then--i-should-see-n-elements.feature +24 -0
package/tests/features/test--then--i-should-see-text-in-table-row.feature +96 -0
package/tests/features/test--then--print-current-url-and-response.feature +21 -0
package/tests/features/test--then--the-checkbox-is-checked.feature +18 -0
package/tests/features/test--then--the-checkbox-should-be-checked.feature +16 -0
package/tests/features/test--then--the-element-should-contain-cssproperty.feature +9 -0
package/tests/features/test--then--the-element-should-not-contain-cssproperty.feature +10 -0
package/tests/features/test--then--the-field-should-contain-value.feature +11 -0
package/tests/features/test--then--the-response-should-contain.feature +11 -0
package/tests/features/test--then--the-response-status-code-should-be.feature +31 -0
package/tests/features/test--then--the-url-should-match.feature +7 -0
package/tests/features/test--then-the-link-should-contain-by-attribute.feature +18 -0
package/tests/features/test--then-the-link-should-contain.feature +7 -0
package/tests/features/test--when--i-additionally-select.feature +30 -0
package/tests/features/test--when--i-attach-file-to-feild.feature +9 -0
package/tests/features/test--when--i-check-checkbox.feature +21 -0
package/tests/features/test--when--i-click-link-by-attribute.feature +21 -0
package/tests/features/test--when--i-click-link.feature +9 -0
package/tests/features/test--when--i-click-text-in-table-row.feature +37 -0
package/tests/features/test--when--i-fill-in-by-attr.feature +31 -0
package/tests/features/test--when--i-fill-in-table-by-attr.feature +19 -0
package/tests/features/test--when--i-fill-in.feature +32 -0
package/tests/features/test--when--i-follow.feature +22 -0
package/tests/features/test--when--i-go-to-homepage.feature +9 -0
package/tests/features/test--when--i-move-forward-backward-one-page.feature +14 -0
package/tests/features/test--when--i-press-button-by-attribute.feature +18 -0
package/tests/features/test--when--i-press-button.feature +13 -0
package/tests/features/test--when--i-reload-page.feature +11 -0
package/tests/features/test--when--i-scroll-left-right.feature +48 -0
package/tests/features/test--when--i-scroll.feature +48 -0
package/tests/features/test--when--i-select-option-from-dropdownlist.feature +21 -0
package/tests/features/test--when--i-select-radio-button.feature +37 -0
package/tests/features/test--when--i-wait-page-is-loaded.feature +8 -0
package/tests/features/test--when--i-wait-time.feature +21 -0
package/tests/features/video.feature +18 -0
package/tests/features/wait.feature +7 -0
package/tests/features/yaml.feature +102 -0
package/tests/selectors/_canonical-keys.json +113 -0
package/tests/selectors/back-end-selectors.json +19 -0
package/tests/selectors/cms-contentful-admin.json +35 -0
package/tests/selectors/cms-craft-admin.json +39 -0
package/tests/selectors/cms-drupal-cms-gin.json +56 -0
package/tests/selectors/cms-drupal-core-claro.json +50 -0
package/tests/selectors/cms-generic-admin.json +34 -0
package/tests/selectors/cms-ghost-admin.json +34 -0
package/tests/selectors/cms-joomla-admin.json +41 -0
package/tests/selectors/cms-magento2-admin.json +32 -0
package/tests/selectors/cms-prestashop-admin.json +38 -0
package/tests/selectors/cms-shopify-admin.json +25 -0
package/tests/selectors/cms-strapi-admin.json +42 -0
package/tests/selectors/cms-typo3-admin.json +41 -0
package/tests/selectors/cms-woocommerce-front.json +50 -0
package/tests/selectors/cms-wordpress-admin.json +31 -0
package/tests/selectors/framework-ant-design.json +80 -0
package/tests/selectors/framework-bootstrap.json +86 -0
package/tests/selectors/framework-bulma.json +74 -0
package/tests/selectors/framework-chakra.json +58 -0
package/tests/selectors/framework-foundation.json +51 -0
package/tests/selectors/framework-material-ui.json +72 -0
package/tests/selectors/framework-shadcn.json +51 -0
package/tests/selectors/framework-tailwind.json +40 -0
package/tests/selectors/framework-vuetify.json +61 -0
package/tests/selectors/front-end-selectors.json +16 -0
package/tests/selectors/homepage-selectors.json +13 -0
package/tests/step-definitions/a11y.steps.js +800 -0
package/tests/step-definitions/action.steps.js +167 -0
package/tests/step-definitions/api.steps.js +732 -0
package/tests/step-definitions/assertion.steps.js +352 -0
package/tests/step-definitions/auth.steps.js +126 -0
package/tests/step-definitions/clock.steps.js +128 -0
package/tests/step-definitions/cookie.steps.js +216 -0
package/tests/step-definitions/debug.steps.js +39 -0
package/tests/step-definitions/dialog.steps.js +193 -0
package/tests/step-definitions/drupal-canvas.steps.js +764 -0
package/tests/step-definitions/drupal-ckeditor.steps.js +108 -0
package/tests/step-definitions/drupal-core.steps.js +665 -0
package/tests/step-definitions/drupal-helpers.js +371 -0
package/tests/step-definitions/drupal-layout-builder.steps.js +466 -0
package/tests/step-definitions/drupal-media.steps.js +99 -0
package/tests/step-definitions/drupal-moderation.steps.js +71 -0
package/tests/step-definitions/drupal-paragraphs.steps.js +50 -0
package/tests/step-definitions/element.steps.js +356 -0
package/tests/step-definitions/field.steps.js +653 -0
package/tests/step-definitions/file-download.steps.js +211 -0
package/tests/step-definitions/form.steps.js +333 -0
package/tests/step-definitions/iframe.steps.js +228 -0
package/tests/step-definitions/input.steps.js +202 -0
package/tests/step-definitions/javascript.steps.js +232 -0
package/tests/step-definitions/keyboard.steps.js +112 -0
package/tests/step-definitions/link.steps.js +142 -0
package/tests/step-definitions/metatag.steps.js +91 -0
package/tests/step-definitions/modal.steps.js +244 -0
package/tests/step-definitions/navigation.steps.js +218 -0
package/tests/step-definitions/network.steps.js +280 -0
package/tests/step-definitions/path.steps.js +141 -0
package/tests/step-definitions/response.steps.js +98 -0
package/tests/step-definitions/responsive.steps.js +125 -0
package/tests/step-definitions/rest.steps.js +111 -0
package/tests/step-definitions/screenshot.steps.js +423 -0
package/tests/step-definitions/scroll.steps.js +189 -0
package/tests/step-definitions/selectors.steps.js +1003 -0
package/tests/step-definitions/storage.steps.js +194 -0
package/tests/step-definitions/table.steps.js +181 -0
package/tests/step-definitions/varbase-e2e.js +897 -0
package/tests/step-definitions/varbase.steps.js +458 -0
package/tests/step-definitions/video.steps.js +178 -0
package/tests/step-definitions/wait.steps.js +400 -0
package/tests/step-definitions/web-first.steps.js +298 -0
package/tests/step-definitions/xml.steps.js +411 -0
package/tests/step-definitions/yaml.steps.js +913 -0
package/tsconfig.json +26 -0

package/examples/test--then--the-element-should_not-contain-cssproperty.html ADDED Viewed

@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset='utf-8'>
+  <title>Press Button</title>
+  <style>
+    .container,
+    .container input,
+    .container button{
+      font-size: 26px;
+    }
+    body{
+      background-color: lightcoral;
+    }
+    .unamecss{
+      border: solid 5px red;
+    }
+  </style>
+<script>
+  function onClick(){
+    const username = document.getElementById("uname");
+    username.style.borderColor = "green";
+    document.body.style.backgroundColor = "white";
+  }
+</script>
+</head>
+<body>
+  <h1>Login</h1>
+  <div class="container">
+    <p><label for="uname">Username</label></p>
+    <p><input id="uname" class="unamecss" type="text" placeholder="Enter Username" name="username"></p>
+    <p><label for="pword">Password</label></p>
+    <p><input id="pword" class="pwordcss" type="password" placeholder="Enter Password" name="password"></p>
+    <p><input id="btnLogin" class="btnLogin" name="btnLogin" type="button" value="Submit" onclick="onClick()"></p>
+  </div>
+  <div id="result" class="style"></div><br/>
+</body>
+</html>

package/examples/test--then--the-link-should-contain.html ADDED Viewed

@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset='utf-8'>
+  <title>Click Link</title>
+  <style>
+    .style {
+      font-size: 26px;
+    }
+  </style>
+</head>
+<body>
+  <h1>Click Link</h1>
+  <div id="result" class="style">
+    <ul>
+      <li><a id="aboutUsid" class="aboutUs" title="aboutUsTitle" href="about-us.html">About us</a></li>
+      <li><a id="contactUsid" class="contactUs" href="contact-us.html">Contact us</a></li>
+    </ul>
+  </div>
+</body>
+</html>

package/examples/test--when--i-additionally-select.html ADDED Viewed

@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset='utf-8'>
+  <title>Multi Select</title>
+</head>
+<body>
+  <h1>Multi Select</h1>
+  <label for="Colors">Colors:</label>
+  <select name="Colors" id="Colors" multiple size="5">
+    <option value="red">Red</option>
+    <option value="blue">Blue</option>
+    <option value="green">Green</option>
+    <option value="yellow">Yellow</option>
+    <option value="black">Black</option>
+  </select>
+  <label for="Roles">Roles:</label>
+  <select name="Roles" id="Roles" multiple size="4">
+    <option value="admin">Admin</option>
+    <option value="editor">Editor</option>
+    <option value="viewer">Viewer</option>
+    <option value="guest">Guest</option>
+  </select>
+</body>
+</html>

package/examples/test--when--i-attach-file-to-feild.html ADDED Viewed

@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset='utf-8'>
+  <title>Press Button</title>
+  <style>
+    .style {
+      font-size: 26px;
+    }
+  </style>
+  <script>
+    function onClick() {
+      const imageUpload = document.getElementById("fileUpload");
+      const element = document.getElementById("result");
+      const filePathArr = imageUpload.value.split('\\');
+      element.innerText = filePathArr[filePathArr.length - 1];
+      const file = imageUpload.files[0];
+      // Create a FileReader object
+      const reader = new FileReader();
+      // Set up the reader's onload event handler
+      reader.onload = function(e) {
+        // Get the image data URL
+        const imageDataUrl = e.target.result;
+        // Display the uploaded image
+        const imagePreview = document.getElementById('imagePreview');
+        imagePreview.src = imageDataUrl;
+      };
+      // Read the selected file as Data URL
+      reader.readAsDataURL(file);
+    }
+  </script>
+</head>
+<body>
+  <label for="myfile">Select a file:</label>
+  <input type="file" id="fileUpload" name="fileUpload"><br><br>
+  <img id="imagePreview" src="#" width="150" height="150" />
+  <div id="result" class="style"></div><br />
+  <input type="submit" value="Submit" onclick="onClick()">
+</body>
+</html>

package/examples/test--when--i-check-uncheck-checkbox.html ADDED Viewed

@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset='utf-8'>
+  <title>Check Item</title>
+  <style>
+    .style {
+      height: 50px;
+      font-size: 26px;
+      line-height: 50px;
+    }
+  </style>
+  <script>
+    function onClick() {
+      var vehicle = document.forms[0];
+      var txt = "";
+      var i;
+      for (i = 0; i < vehicle.length; i++) {
+        if (vehicle[i].checked) {
+          txt = txt + vehicle[i].value + " ";
+        }
+      }
+      const element = document.getElementById("result");
+      element.innerText = "You have a " + txt;
+    }
+  </script>
+</head>
+<body>
+  <h1>Check Option</h1>
+  <form>
+    <input type="checkbox" id="bike" name="bike" value="Bike">
+    <label for="vehicle1"> I have a bike</label><br>
+    <input type="checkbox" id="car" name="car" value="Car">
+    <label for="vehicle2"> I have a car</label><br>
+    <input type="checkbox" id="boat" name="boat" value="Boat">
+    <label for="vehicle3"> I have a boat</label><br>
+    <input type="checkbox" id="van" name="van" value="Van">
+    <label for="vehicle4"> I have a van</label><br>
+  </form>
+  <input id="btnClick" class="btnClick" name="btnClick" type="button" value="Submit" onclick="onClick()">
+  <div id="result" class="style"></div><br />
+</body>
+</html>

package/examples/test--when--i-click-link.html ADDED Viewed

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset='utf-8'>
+  <title>Click Link</title>
+  <style>
+    .style{
+      font-size: 26px;
+    }
+  </style>
+</head>
+<body>
+  <h1>Click Link</h1>
+  <div id="result" class="style">
+      Please click <a id="aboutUsid" class="aboutUs" href="about-us.html">About us link</a> for more information.
+  </div>
+</body>
+</html>

package/examples/test--when--i-click-text-in-table-row.html ADDED Viewed

@@ -0,0 +1,178 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Table Row Click Test</title>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            margin: 20px;
+        }
+        table {
+            border-collapse: collapse;
+            width: 100%;
+            margin: 20px 0;
+        }
+        th, td {
+            border: 1px solid #ddd;
+            padding: 8px;
+            text-align: left;
+        }
+        th {
+            background-color: #f2f2f2;
+        }
+        .action-btn {
+            background-color: #007bff;
+            color: white;
+            border: none;
+            padding: 5px 10px;
+            cursor: pointer;
+            border-radius: 3px;
+            margin: 2px;
+        }
+        .action-btn:hover {
+            background-color: #0056b3;
+        }
+        .edit-btn { background-color: #28a745; }
+        .delete-btn { background-color: #dc3545; }
+        .view-btn { background-color: #17a2b8; }
+        #result {
+            margin-top: 20px;
+            padding: 10px;
+            background-color: #f8f9fa;
+            border: 1px solid #dee2e6;
+            border-radius: 4px;
+        }
+    </style>
+</head>
+<body>
+    <h1>Table Row Click Test Page</h1>
+    <p>This page demonstrates clicking specific text within table rows for automated testing.</p>
+    <h2>Users Table</h2>
+    <table id="users-table">
+        <thead>
+            <tr>
+                <th>Name</th>
+                <th>Email</th>
+                <th>Role</th>
+                <th>Actions</th>
+            </tr>
+        </thead>
+        <tbody>
+            <tr>
+                <td>John Smith</td>
+                <td>john.smith@example.com</td>
+                <td>Admin</td>
+                <td>
+                    <button class="action-btn edit-btn" onclick="performAction('edit', 'John Smith')">Edit</button>
+                    <button class="action-btn view-btn" onclick="performAction('view', 'John Smith')">View Details</button>
+                    <button class="action-btn delete-btn" onclick="performAction('delete', 'John Smith')">Delete</button>
+                </td>
+            </tr>
+            <tr>
+                <td>Jane Doe</td>
+                <td>jane.doe@example.com</td>
+                <td>User</td>
+                <td>
+                    <button class="action-btn edit-btn" onclick="performAction('edit', 'Jane Doe')">Edit</button>
+                    <button class="action-btn view-btn" onclick="performAction('view', 'Jane Doe')">View Details</button>
+                    <button class="action-btn delete-btn" onclick="performAction('delete', 'Jane Doe')">Delete</button>
+                </td>
+            </tr>
+            <tr>
+                <td>Bob Johnson</td>
+                <td>bob.johnson@example.com</td>
+                <td>Manager</td>
+                <td>
+                    <button class="action-btn edit-btn" onclick="performAction('edit', 'Bob Johnson')">Edit</button>
+                    <button class="action-btn view-btn" onclick="performAction('view', 'Bob Johnson')">View Details</button>
+                    <button class="action-btn delete-btn" onclick="performAction('delete', 'Bob Johnson')">Delete</button>
+                </td>
+            </tr>
+        </tbody>
+    </table>
+    <h2>Products Table</h2>
+    <table id="products-table">
+        <thead>
+            <tr>
+                <th>Product Name</th>
+                <th>Price</th>
+                <th>Stock</th>
+                <th>Actions</th>
+            </tr>
+        </thead>
+        <tbody>
+            <tr>
+                <td>Product A</td>
+                <td>$29.99</td>
+                <td>150</td>
+                <td>
+                    <a href="#" class="action-btn" onclick="performAction('edit', 'Product A')">Edit</a>
+                    <a href="#" class="action-btn" onclick="performAction('download', 'Product A')">Download</a>
+                </td>
+            </tr>
+            <tr>
+                <td>Product B</td>
+                <td>$49.99</td>
+                <td>75</td>
+                <td>
+                    <a href="#" class="action-btn" onclick="performAction('edit', 'Product B')">Edit</a>
+                    <a href="#" class="action-btn" onclick="performAction('download', 'Product B')">Download</a>
+                </td>
+            </tr>
+        </tbody>
+    </table>
+    <h2>Orders Table</h2>
+    <table id="orders-table">
+        <thead>
+            <tr>
+                <th>Order ID</th>
+                <th>Customer</th>
+                <th>Status</th>
+                <th>Actions</th>
+            </tr>
+        </thead>
+        <tbody>
+            <tr>
+                <td>Order #12345</td>
+                <td>Alice Cooper</td>
+                <td>Processing</td>
+                <td>
+                    <span class="action-btn" onclick="performAction('view', 'Order #12345')">View Details</span>
+                    <span class="action-btn" onclick="performAction('cancel', 'Order #12345')">Cancel</span>
+                </td>
+            </tr>
+            <tr>
+                <td>Order #67890</td>
+                <td>David Wilson</td>
+                <td>Shipped</td>
+                <td>
+                    <span class="action-btn" onclick="performAction('view', 'Order #67890')">View Details</span>
+                    <span class="action-btn" onclick="performAction('track', 'Order #67890')">Track</span>
+                </td>
+            </tr>
+        </tbody>
+    </table>
+    <div id="result">
+        <h3>Action Result:</h3>
+        <p id="action-message">No action performed yet.</p>
+    </div>
+    <script>
+        function performAction(action, identifier) {
+            const resultElement = document.getElementById('action-message');
+            const timestamp = new Date().toLocaleTimeString();
+            resultElement.innerHTML = `Performed (${action}) action on (${identifier})`;
+            // Prevent default link behavior
+            event.preventDefault();
+            return false;
+        }
+    </script>
+</body>
+</html>

package/examples/test--when--i-fill-in.html ADDED Viewed

@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset='utf-8'>
+  <title>Press Button</title>
+  <style>
+    .container,
+    .container input,
+    .container button{
+      font-size: 26px;
+    }
+    .style{
+      width: 400px;
+      height: 50px;
+      font-size: 18px;
+      line-height: 50px;
+      text-align: center;
+    }
+  </style>
+<script>
+  function onClick(){
+    const username = document.getElementById("uname");
+    const password = document.getElementById("pword");
+    const element = document.getElementById("result");
+    element.innerText = "You enter Username: " + username.value + " and Password: " + password.value;
+  }
+</script>
+</head>
+<body>
+  <h1>Login</h1>
+  <div class="container">
+    <p><label for="uname">Username</label></p>
+    <p><input id="uname" class="unamecss" type="text" placeholder="Your full name" name="username"></p>
+    <p><label for="pword">Password</label></p>
+    <p><input id="pword" class="pwordcss" type="password" placeholder="Your Password" name="password"></p>
+    <p><input id="btnLogin" class="btnLogin" name="btnLogin" type="button" value="Login" onclick="onClick()"></p>
+  </div>
+  <div id="result" class="style"></div><br/>
+</body>
+</html>

package/examples/test--when--i-press-button.html ADDED Viewed

@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset='utf-8'>
+  <title>Press Button</title>
+  <style>
+    .style{
+      width: 400px;
+      height: 50px;
+      font-size: 26px;
+      line-height: 50px;
+      text-align: center;
+    }
+  </style>
+  <script>
+    function onClick(){
+      const element = document.getElementById("result");
+      element.innerText = "Button Pressed Successfully";
+    }
+  </script>
+</head>
+<body>
+  <h1>Press Button</h1>
+  <div id="result" class="style"></div><br/>
+  <label for="btn-pressid">Press button</label>
+  <button id="btn-pressid" class="btn-pressclass" name="btn-pressname"  onclick="onClick()">Button</button>
+  <input type="submit" id="submit-pressid" class="submit-pressclass" name="submit-pressname" value="Submit"  onclick="onClick()" />
+</body>
+</html>

package/examples/test--when--i-reload-page.html ADDED Viewed

@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset='utf-8'>
+  <title>Press Button</title>
+  <style>
+    .style{
+      width: 400px;
+      height: 50px;
+      font-size: 26px;
+      line-height: 50px;
+      text-align: center;
+    }
+  </style>
+  <script>
+    function onClick(){
+      const element = document.getElementById("result");
+      element.innerText = "Button Pressed Successfully";
+    }
+  </script>
+</head>
+<body>
+  <h1>Press Button</h1>
+  <div id="result" class="style"></div><br/>
+  <input id="btnClick" class="btnClick" name="btnClick" type="button" value="Submit" onclick="onClick()">
+</body>
+</html>

package/examples/test--when--i-scroll-functionality.html ADDED Viewed

@@ -0,0 +1,177 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset='utf-8'>
+  <title>Complete Scroll Functionality Test</title>
+  <style>
+    body {
+      margin: 0;
+      padding: 20px;
+      font-family: Arial, sans-serif;
+    }
+    .container,
+    .container input,
+    .container button {
+      font-size: 26px;
+    }
+    .style {
+      font-size: 22px;
+      line-height: 30px;
+      border: 1px solid #ccc;
+      padding: 10px;
+      margin: 5px 0;
+      background-color: #f9f9f9;
+    }
+    .indicator {
+      font-size: 28px;
+      font-weight: bold;
+      color: #007bff;
+      padding: 15px;
+      margin: 10px 0;
+      border: 2px solid #007bff;
+      background-color: #e7f3ff;
+      display: none;
+    }
+    #scrollable-container {
+      height: 300px;
+      overflow-y: auto;
+      border: 2px solid #333;
+      margin: 20px 0;
+      padding: 10px;
+      background-color: #f0f0f0;
+    }
+    .scrollable-content {
+      height: 800px;
+      background: linear-gradient(to bottom, #ff9999, #99ff99, #9999ff);
+      padding: 20px;
+      position: relative;
+    }
+    .scroll-marker {
+      position: absolute;
+      font-size: 18px;
+      font-weight: bold;
+      background-color: rgba(255, 255, 255, 0.8);
+      padding: 5px 10px;
+      border-radius: 5px;
+    }
+    .scroll-marker.top {
+      top: 10px;
+      left: 10px;
+    }
+    .scroll-marker.bottom {
+      bottom: 10px;
+      right: 10px;
+    }
+    #complete {
+      font-size: 32px;
+      line-height: 40px;
+      color: #28a745;
+      font-weight: bold;
+      text-align: center;
+      padding: 20px;
+      border: 3px solid #28a745;
+      background-color: #d4edda;
+      margin: 20px 0;
+    }
+  </style>
+</head>
+<body>
+  <h1>Complete Scrolling Functionality Test Page</h1>
+  <!-- Indicators for different scroll actions -->
+  <div id="basic-scroll-down" class="indicator">Basic scroll down works</div>
+  <div id="basic-scroll-up" class="indicator">Basic scroll up works</div>
+  <div id="custom-scroll-down" class="indicator">Custom scroll down works</div>
+  <div id="custom-scroll-up" class="indicator">Custom scroll up works</div>
+  <div id="scroll-to-top" class="indicator">Scroll to top works</div>
+  <!-- Main content container -->
+  <div id="container">
+    <p class="style">This is the starting content of the page</p>
+  </div>
+  <!-- Scrollable element container -->
+  <h2>Scrollable Container Test</h2>
+  <div id="scrollable-container">
+    <div class="scrollable-content">
+      <div class="scroll-marker top">Element scroll to top works</div>
+      <p>This is a scrollable container with a lot of content inside.</p>
+      <p>You can scroll within this container independently of the main page.</p>
+      <p>This content demonstrates element-specific scrolling functionality.</p>
+      <div class="scroll-marker bottom">Element scroll to bottom works</div>
+    </div>
+  </div>
+  <!-- Bottom completion message -->
+  <div id="complete">Scroll to bottom works</div>
+</body>
+<script>
+  // Generate content to make the page long enough for scrolling
+  const container = document.getElementById("container");
+  for(var i = 1; i <= 30; i++){
+    container.innerHTML += '<p class="style">Container content section #' + i + ' - This adds height to test scrolling</p>';
+  }
+  // Add scroll event listeners to show appropriate indicators
+  var wasAtBottom = false;
+  var everScrolledDown = false;
+  var lastScrollY = 0;
+  window.addEventListener('scroll', function () {
+    var scrollY = window.scrollY;
+    var docHeight = document.documentElement.scrollHeight;
+    var winHeight = window.innerHeight;
+    var maxScroll = docHeight - winHeight;
+    var atBottom = scrollY >= maxScroll - 10;
+    var atTop = scrollY <= 0;
+    var goingDown = scrollY > lastScrollY;
+    document.querySelectorAll('.indicator').forEach(function (el) { el.style.display = 'none'; });
+    if (atTop && everScrolledDown) {
+      document.getElementById('scroll-to-top').style.display = 'block';
+    } else if (atBottom) {
+      wasAtBottom = true;
+      everScrolledDown = true;
+    } else if (wasAtBottom && !goingDown) {
+      var distFromBottom = maxScroll - scrollY;
+      if (distFromBottom >= 340) {
+        document.getElementById('basic-scroll-up').style.display = 'block';
+      } else {
+        document.getElementById('custom-scroll-up').style.display = 'block';
+      }
+    } else if (scrollY >= 450) {
+      document.getElementById('custom-scroll-down').style.display = 'block';
+      everScrolledDown = true;
+    } else if (scrollY > 0) {
+      document.getElementById('basic-scroll-down').style.display = 'block';
+      everScrolledDown = true;
+    }
+    lastScrollY = scrollY;
+  });
+  // Add scroll event listener for the scrollable container
+  const scrollableContainer = document.getElementById('scrollable-container');
+  scrollableContainer.addEventListener('scroll', function() {
+    // This helps test element-specific scrolling
+    console.log('Scrollable container scrolled to:', this.scrollTop);
+  });
+</script>
+</html>