Improve the NodeJS Python test launcher

mdmintz · mdmintz · commit 6ed86175c698 · 2020-08-08T00:57:05.000-04:00
diff --git a/integrations/node_js/ReadMe.md b/integrations/node_js/ReadMe.md
@@ -1,6 +1,8 @@
-## Creating a SeleniumBase Test Launcher using NodeJS
+<h2><img src="https://seleniumbase.io/img/sb_icon.png" title="SeleniumBase" width="30" /> Creating a SeleniumBase Test Launcher by using NodeJS</h2>
 
-Great news: It's really easy to create a customized web app for kicking off SeleniumBase jobs using NodeJS. This tutorial will walk you through all the steps that you need. (I'll assume that you've already installed SeleniumBase by following the instructions from the [top-level ReadMe](https://github.com/seleniumbase/SeleniumBase/blob/master/README.md) file.) 
+You can create a customized web app for running SeleniumBase tests by using NodeJS. (This tutorial assumes that you've already installed SeleniumBase by following the instructions from the [top-level ReadMe](https://github.com/seleniumbase/SeleniumBase/blob/master/README.md) file.)
+
+<img src="https://seleniumbase.io/other/node_runner.png" title="Node Runner" />
 
 #### 1. Install NodeJS
 
@@ -35,8 +37,8 @@ node server.js
 
 #### 6. Run an example test
 
-Click on one of the buttons to run a SeleniumBase example test
+Click on a button to run a SeleniumBase example test.
 
-#### 7. Enjoy your web app
+#### 7. Expand your web app
 
-Congratulations! You now have a web app for kicking off SeleniumBase tests! NodeJS makes it easy!
+Now that you have a web app for launching SeleniumBase tests, you can expand it to run any script that you want after pressing a button.
diff --git a/integrations/node_js/index.html b/integrations/node_js/index.html
@@ -1,6 +1,6 @@
 <html>
   <head>
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" crossorigin="anonymous">
     <style>
       body {font-family: Arial, Helvetica, sans-serif;}
       h1 {color:#3366CC; font-size: 32px;}
@@ -9,19 +9,20 @@
     </style>
   </head>
   <body>
+    <script>0</script>
     <div class="container">
-    <h1>Select an option:</h1>
-    <form method="put" action="/run_my_first_test_in_chrome">
-      <input type="submit" value="Run Test in Chrome">
+    <h1>Select a script to run:</h1>
+    <form method="put" action="/run_my_first_test">
+      <input type="submit" value="pytest my_first_test.py">
     </form>
-    <form method="put" action="/run_my_first_test_in_firefox">
-      <input type="submit" value="Run Test in Firefox">
+    <form method="put" action="/run_test_demo_site">
+      <input type="submit" value="pytest test_demo_site.py">
     </form>
-    <form method="put" action="/run_my_first_test_in_chrome_with_demo_mode">
-      <input type="submit" value="Run Test in Chrome (Demo Mode)">
+    <form method="put" action="/run_my_first_test_with_demo_mode">
+      <input type="submit" value="pytest my_first_test.py --demo">
     </form>
-    <form method="put" action="/run_my_first_test_in_firefox_with_demo_mode">
-      <input type="submit" value="Run Test in Firefox (Demo Mode)">
+    <form method="put" action="/run_test_demo_site_with_demo_mode">
+      <input type="submit" value="pytest test_demo_site.py --demo">
     </form>
     </div>
   </body>
diff --git a/integrations/node_js/server.js b/integrations/node_js/server.js
@@ -4,48 +4,48 @@ var path = require('path');
 var app = express();
 var exec = require('child_process').exec;
 
-function run_my_first_test_in_chrome() {
-    exec("pytest my_first_test.py --browser=chrome -s");
+function run_my_first_test() {
+    exec("pytest my_first_test.py");
 }
 
-function run_my_first_test_in_firefox() {
-    exec("pytest my_first_test.py --browser=firefox -s");
+function run_test_demo_site() {
+    exec("pytest test_demo_site.py");
 }
 
-function run_my_first_test_in_chrome_with_demo_mode() {
-    exec("pytest my_first_test.py --browser=chrome --demo_mode -s");
+function run_my_first_test_with_demo_mode() {
+    exec("pytest my_first_test.py --demo_mode");
 }
 
-function run_my_first_test_in_firefox_with_demo_mode() {
-    exec("pytest my_first_test.py --browser=firefox --demo_mode -s");
+function run_test_demo_site_with_demo_mode() {
+    exec("pytest test_demo_site.py --demo_mode");
 }
 
 app.get('/', function(req, res) {
     res.sendFile(path.join(__dirname + '/index.html'));
 })
 
-app.get('/run_my_first_test_in_firefox', function(req, res) {
+app.get('/run_my_first_test', function(req, res) {
     res.sendFile(path.join(__dirname + '/index.html'));
     res.redirect('/');
-    run_my_first_test_in_firefox()
+    run_my_first_test()
 })
 
-app.get('/run_my_first_test_in_chrome', function(req, res) {
+app.get('/run_test_demo_site', function(req, res) {
     res.sendFile(path.join(__dirname + '/index.html'));
     res.redirect('/');
-    run_my_first_test_in_chrome()
+    run_test_demo_site()
 })
 
-app.get('/run_my_first_test_in_firefox_with_demo_mode', function(req, res) {
+app.get('/run_my_first_test_with_demo_mode', function(req, res) {
     res.sendFile(path.join(__dirname + '/index.html'));
     res.redirect('/');
-    run_my_first_test_in_firefox_with_demo_mode()
+    run_my_first_test_with_demo_mode()
 })
 
-app.get('/run_my_first_test_in_chrome_with_demo_mode', function(req, res) {
+app.get('/run_test_demo_site_with_demo_mode', function(req, res) {
     res.sendFile(path.join(__dirname + '/index.html'));
     res.redirect('/');
-    run_my_first_test_in_chrome_with_demo_mode()
+    run_test_demo_site_with_demo_mode()
 })
 
 app.listen(3000, "127.0.0.1", function() {
diff --git a/integrations/node_js/test_demo_site.py b/integrations/node_js/test_demo_site.py
@@ -0,0 +1,101 @@
+from seleniumbase import BaseCase
+
+
+class MyTestClass(BaseCase):
+
+    def test_demo_site(self):
+        self.open("https://seleniumbase.io/demo_page")
+
+        # Assert the title of the current web page
+        self.assert_title("Web Testing Page")
+
+        # Assert that the element is visible on the page
+        self.assert_element("tbody#tbodyId")
+
+        # Assert that the text appears within a given element
+        self.assert_text("Demo Page", "h1")
+
+        # Type/update text in text fields on the page
+        self.type("#myTextInput", "This is Automated")
+        self.type("textarea.area1", "Testing Time!\n")
+        self.type('[name="preText2"]', "Typing Text!")
+
+        # Verify that a hover dropdown link changes page text
+        self.assert_text("Automation Practice", "h3")
+        self.hover_and_click("#myDropdown", "#dropOption2")
+        self.assert_text("Link Two Selected", "h3")
+
+        # Verify that a button click changes text on the page
+        self.assert_text("This Text is Green", "#pText")
+        self.click("#myButton")
+        self.assert_text("This Text is Purple", "#pText")
+
+        # Assert that the given SVG is visible on the page
+        self.assert_element('svg[name="svgName"]')
+
+        # Verify that a slider control updates a progrss bar
+        self.assert_element('progress[value="50"]')
+        self.press_right_arrow("#myslider", times=5)
+        self.assert_element('progress[value="100"]')
+
+        # Verify that a "select" option updates a meter bar
+        self.assert_element('meter[value="0.25"]')
+        self.select_option_by_text("#mySelect", "Set to 75%")
+        self.assert_element('meter[value="0.75"]')
+
+        # Assert an element located inside an iFrame
+        self.assert_false(self.is_element_visible("img"))
+        self.switch_to_frame("#myFrame1")
+        self.assert_true(self.is_element_visible("img"))
+        self.switch_to_default_content()
+
+        # Assert text located inside an iFrame
+        self.assert_false(self.is_text_visible("iFrame Text"))
+        self.switch_to_frame("#myFrame2")
+        self.assert_true(self.is_text_visible("iFrame Text"))
+        self.switch_to_default_content()
+
+        # Verify that clicking a radio button selects it
+        self.assert_false(self.is_selected("#radioButton2"))
+        self.click("#radioButton2")
+        self.assert_true(self.is_selected("#radioButton2"))
+
+        # Verify that clicking a checkbox makes it selected
+        self.assert_false(self.is_selected("#checkBox1"))
+        self.click("#checkBox1")
+        self.assert_true(self.is_selected("#checkBox1"))
+
+        # Verify clicking on multiple elements with one call
+        self.assert_false(self.is_selected("#checkBox2"))
+        self.assert_false(self.is_selected("#checkBox3"))
+        self.assert_false(self.is_selected("#checkBox4"))
+        self.click_visible_elements("input.checkBoxClassB")
+        self.assert_true(self.is_selected("#checkBox2"))
+        self.assert_true(self.is_selected("#checkBox3"))
+        self.assert_true(self.is_selected("#checkBox4"))
+
+        # Verify that clicking an iFrame checkbox selects it
+        self.assert_false(self.is_element_visible(".fBox"))
+        self.switch_to_frame("#myFrame3")
+        self.assert_true(self.is_element_visible(".fBox"))
+        self.assert_false(self.is_selected(".fBox"))
+        self.click(".fBox")
+        self.assert_true(self.is_selected(".fBox"))
+        self.switch_to_default_content()
+
+        # Assert link text
+        self.assert_link_text("seleniumbase.com")
+        self.assert_link_text("SeleniumBase on GitHub")
+        self.assert_link_text("seleniumbase.io")
+
+        # Click link text
+        self.click_link_text("SeleniumBase Demo Page")
+
+        # Assert exact text
+        self.assert_exact_text("Demo Page", "h1")
+
+        # Assert no broken links (Can be slow if many links)
+        # self.assert_no_404_errors()
+
+        # Assert no JavaScript errors (Can also detect 404s)
+        self.assert_no_js_errors()
