Skip to content

Commit 2cad947

Browse files
authored
Merge pull request #966 from seleniumbase/dialog-boxes-and-more
Dialog Boxes and more
2 parents 85ce552 + 14ff0c5 commit 2cad947

20 files changed

+1368
-87
lines changed

README.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -41,8 +41,8 @@
4141
<a href="https://github.com/seleniumbase/SeleniumBase/blob/master/examples/tour_examples/ReadMe.md">🗺️ Tours</a> |
4242
<a href="https://github.com/seleniumbase/SeleniumBase/blob/master/examples/chart_maker/ReadMe.md">📶 Charts</a> |
4343
<a href="https://github.com/seleniumbase/SeleniumBase/blob/master/examples/presenter/ReadMe.md">📰 Present</a> |
44-
<a href="https://github.com/seleniumbase/SeleniumBase/blob/master/examples/visual_testing/ReadMe.md">🖼️ VisualTest</a> |
45-
<a href="https://github.com/seleniumbase/SeleniumBase/blob/master/examples/master_qa/ReadMe.md">🛂 MasterQA</a>
44+
<a href="https://github.com/seleniumbase/SeleniumBase/blob/master/examples/dialog_boxes/ReadMe.md">🛂 DialogBox</a> |
45+
<a href="https://github.com/seleniumbase/SeleniumBase/blob/master/examples/visual_testing/ReadMe.md">🖼️ VisualTest</a>
4646
</p>
4747

4848
<p align="left">
@@ -268,7 +268,7 @@ nosetests [FILE_NAME.py]:[CLASS_NAME].[METHOD_NAME]
268268
<img src="https://img.shields.io/badge/Flaky Tests%3F-%20NO%21-11BBDD.svg" alt="NO MORE FLAKY TESTS!" />
269269
270270
✅ Automated/Manual Hybrid Mode:
271-
<p>SeleniumBase includes a solution called <b><a href="https://github.com/seleniumbase/SeleniumBase/blob/master/seleniumbase/masterqa/ReadMe.md">MasterQA</a></b>, which speeds up manual testing by having automation perform all the browser actions while the manual tester handles validation.</p>
271+
<p>SeleniumBase includes a solution called <b><a href="https://github.com/seleniumbase/SeleniumBase/blob/master/examples/master_qa/ReadMe.md">MasterQA</a></b>, which speeds up manual testing by having automation perform all the browser actions while the manual tester handles validation.</p>
272272
273273
✅ Feature-Rich:
274274
<p>For a full list of SeleniumBase features, <a href="https://github.com/seleniumbase/SeleniumBase/blob/master/help_docs/features_list.md">Click Here</a>.</p>

examples/dialog_boxes/ReadMe.md

Lines changed: 180 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,180 @@
1+
<h3 align="left"><img src="https://seleniumbase.io/cdn/img/sb_logo_b.png" alt="SeleniumBase" width="320" /></h3>
2+
3+
<h2><img src="https://seleniumbase.io/img/logo6.png" title="SeleniumBase" width="32" /> 🛂 Dialog Boxes 🛂</h2>
4+
5+
SeleniumBase Dialog Boxes let your users provide input in the middle of automation scripts.
6+
7+
* This feature utilizes the [jquery-confirm](https://craftpip.github.io/jquery-confirm/) library.
8+
* A Python API is used to call the JavaScript API.
9+
10+
<img src="https://seleniumbase.io/cdn/img/emoji_sports_dialog.png" alt="SeleniumBase" width="440" />
11+
12+
<h4>↕️ (<a href="https://github.com/seleniumbase/SeleniumBase/blob/master/examples/dialog_boxes/dialog_box_tour.py">Example: dialog_box_tour.py</a>) ↕️</h4>
13+
14+
<img src="https://seleniumbase.io/cdn/gif/sports_dialog.gif" alt="SeleniumBase" width="440" />
15+
16+
<h4>Here's how to run that example:</h4>
17+
18+
```bash
19+
cd examples/dialog_boxes
20+
pytest test_dialog_boxes.py
21+
```
22+
23+
<h4>Here's a code snippet from that:</h4>
24+
25+
```python
26+
self.open("https://xkcd.com/1920/")
27+
skip_button = ["SKIP", "red"] # Can be a [text, color] list or tuple.
28+
buttons = ["Fencing", "Football", "Metaball", "Go/Chess", skip_button]
29+
message = "Choose a sport:"
30+
choice = self.get_jqc_button_input(message, buttons)
31+
if choice == "Fencing":
32+
self.open("https://xkcd.com/1424/")
33+
```
34+
35+
* You can create forms that include buttons and input fields.
36+
37+
<h4>Here's a simple form with only buttons as input:</h4>
38+
39+
```python
40+
choice = self.get_jqc_button_input("Ready?", ["YES", "NO"])
41+
print(choice) # This prints "YES" or "NO"
42+
43+
# You may want to customize the color of buttons:
44+
buttons = [("YES", "green"), ("NO", "red")]
45+
choice = self.get_jqc_button_input("Ready?", buttons)
46+
```
47+
48+
<h4>Here's a simple form with an input field:</h4>
49+
50+
```python
51+
text = self.get_jqc_text_input("Enter text:", ["Search"])
52+
print(text) # This prints the text entered
53+
```
54+
55+
<h4>This form has an input field and buttons:</h4>
56+
57+
```python
58+
message = "Type your name and choose a language:"
59+
buttons = ["Python", "JavaScript"]
60+
text, choice = self.get_jqc_form_inputs(message, buttons)
61+
print("Your name is: %s" % text)
62+
print("You picked %s!" % choice)
63+
```
64+
65+
<h4>You can customize options if you want:</h4>
66+
67+
```python
68+
# Themes: bootstrap, modern, material, supervan, light, dark, seamless
69+
options = [("theme", "modern"), ("width", "50%")]
70+
self.get_jqc_text_input("You Won!", ["OK"], options)
71+
```
72+
73+
<h4>Default options can be set with <code>set_jqc_theme()</code>:</h4>
74+
75+
```python
76+
self.set_jqc_theme("light", color="green", width="38%")
77+
78+
# To reset jqc theme settings to factory defaults:
79+
self.reset_jqc_theme()
80+
```
81+
82+
<h3>All methods for Dialog Boxes:</h3>
83+
84+
```python
85+
self.get_jqc_button_input(message, buttons, options=None)
86+
87+
self.get_jqc_text_input(message, button=None, options=None)
88+
89+
self.get_jqc_form_inputs(message, buttons, options=None)
90+
91+
self.set_jqc_theme(theme, color=None, width=None)
92+
93+
self.reset_jqc_theme()
94+
95+
self.activate_jquery_confirm() # Automatic for jqc methods
96+
```
97+
98+
<h3>Detailed method summaries for Dialog Boxes:</h3>
99+
100+
```python
101+
self.get_jqc_button_input(message, buttons, options=None)
102+
"""
103+
Pop up a jquery-confirm box and return the text of the button clicked.
104+
If running in headless mode, the last button text is returned.
105+
@Params
106+
message: The message to display in the jquery-confirm dialog.
107+
buttons: A list of tuples for text and color.
108+
Example: [("Yes!", "green"), ("No!", "red")]
109+
Available colors: blue, green, red, orange, purple, default, dark.
110+
A simple text string also works: "My Button". (Uses default color.)
111+
options: A list of tuples for options to set.
112+
Example: [("theme", "bootstrap"), ("width", "450px")]
113+
Available theme options: bootstrap, modern, material, supervan,
114+
light, dark, and seamless.
115+
Available colors: (For the BORDER color, NOT the button color.)
116+
"blue", "default", "green", "red", "purple", "orange", "dark".
117+
Example option for changing the border color: ("color", "default")
118+
Width can be set using percent or pixels. Eg: "36.0%", "450px".
119+
"""
120+
121+
self.get_jqc_text_input(message, button=None, options=None)
122+
"""
123+
Pop up a jquery-confirm box and return the text submitted by the input.
124+
If running in headless mode, the text returned is "" by default.
125+
@Params
126+
message: The message to display in the jquery-confirm dialog.
127+
button: A 2-item list or tuple for text and color. Or just the text.
128+
Example: ["Submit", "blue"] -> (default button if not specified)
129+
Available colors: blue, green, red, orange, purple, default, dark.
130+
A simple text string also works: "My Button". (Uses default color.)
131+
options: A list of tuples for options to set.
132+
Example: [("theme", "bootstrap"), ("width", "450px")]
133+
Available theme options: bootstrap, modern, material, supervan,
134+
light, dark, and seamless.
135+
Available colors: (For the BORDER color, NOT the button color.)
136+
"blue", "default", "green", "red", "purple", "orange", "dark".
137+
Example option for changing the border color: ("color", "default")
138+
Width can be set using percent or pixels. Eg: "36.0%", "450px".
139+
"""
140+
141+
self.get_jqc_form_inputs(message, buttons, options=None)
142+
"""
143+
Pop up a jquery-confirm box and return the input/button texts as tuple.
144+
If running in headless mode, returns the ("", buttons[-1][0]) tuple.
145+
@Params
146+
message: The message to display in the jquery-confirm dialog.
147+
buttons: A list of tuples for text and color.
148+
Example: [("Yes!", "green"), ("No!", "red")]
149+
Available colors: blue, green, red, orange, purple, default, dark.
150+
A simple text string also works: "My Button". (Uses default color.)
151+
options: A list of tuples for options to set.
152+
Example: [("theme", "bootstrap"), ("width", "450px")]
153+
Available theme options: bootstrap, modern, material, supervan,
154+
light, dark, and seamless.
155+
Available colors: (For the BORDER color, NOT the button color.)
156+
"blue", "default", "green", "red", "purple", "orange", "dark".
157+
Example option for changing the border color: ("color", "default")
158+
Width can be set using percent or pixels. Eg: "36.0%", "450px".
159+
"""
160+
161+
self.set_jqc_theme(theme, color=None, width=None)
162+
""" Sets the default jquery-confirm theme and width (optional).
163+
Available themes: "bootstrap", "modern", "material", "supervan",
164+
"light", "dark", and "seamless".
165+
Available colors: (This sets the BORDER color, NOT the button color.)
166+
"blue", "default", "green", "red", "purple", "orange", "dark".
167+
Width can be set using percent or pixels. Eg: "36.0%", "450px".
168+
"""
169+
170+
self.reset_jqc_theme()
171+
""" Resets the jqc theme settings to factory defaults. """
172+
173+
self.activate_jquery_confirm() # Automatic for jqc methods
174+
""" See https://craftpip.github.io/jquery-confirm/ for usage. """
175+
```
176+
177+
--------
178+
179+
<h4>✅ 🛂 Automated/Manual Hybrid Mode (MasterQA)</h4>
180+
<p><b><a href="https://seleniumbase.io/seleniumbase/masterqa/ReadMe/">MasterQA</a></b> uses <b>SeleniumBase Dialog Boxes</b> to speed up manual testing by having automation perform all the browser actions while the manual tester handles validation. See <a href="https://github.com/seleniumbase/SeleniumBase/tree/master/examples/master_qa">the MasterQA GitHub page</a> for examples.</p>
Lines changed: 117 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,117 @@
1+
from seleniumbase import BaseCase
2+
3+
4+
class DialogBoxTests(BaseCase):
5+
def test_dialog_boxes(self):
6+
self.open("https://xkcd.com/1920/")
7+
self.assert_element('img[alt="Emoji Sports"]')
8+
self.highlight("#comic img")
9+
10+
skip_button = ["SKIP", "red"] # Can be a [text, color] list or tuple.
11+
buttons = ["Fencing", "Football", "Metaball", "Go/Chess", skip_button]
12+
message = "Choose a sport:"
13+
choice = None
14+
while choice != "STOP":
15+
choice = self.get_jqc_button_input(message, buttons)
16+
if choice == "Fencing":
17+
self.open("https://xkcd.com/1424/")
18+
buttons.remove("Fencing")
19+
elif choice == "Football":
20+
self.open("https://xkcd.com/1107/")
21+
buttons.remove("Football")
22+
elif choice == "Metaball":
23+
self.open("https://xkcd.com/1507/")
24+
buttons.remove("Metaball")
25+
elif choice == "Go/Chess":
26+
self.open("https://xkcd.com/1287/")
27+
buttons.remove("Go/Chess")
28+
else:
29+
break
30+
self.highlight("#comic img")
31+
if len(buttons) == 2:
32+
message = "One Sport Remaining:"
33+
if len(buttons) == 1:
34+
message = "Part One Complete. You saw all 4 sports!"
35+
btn_text_1 = "NEXT Tutorial Please!"
36+
btn_text_2 = "WAIT, Go/Chess is a sport?"
37+
buttons = [(btn_text_1, "green"), (btn_text_2, "purple")]
38+
choice_2 = self.get_jqc_button_input(message, buttons)
39+
if choice_2 == btn_text_2:
40+
self.open("https://xkcd.com/1287/")
41+
message = "Brain sports count as sports!<br /><br />"
42+
message += "Are you ready for more?"
43+
self.get_jqc_button_input(message, ["Let's Go!"])
44+
break
45+
46+
self.open("https://xkcd.com/1117/")
47+
sb_banner_logo = "//seleniumbase.io/cdn/img/sb_logo_cs.png"
48+
self.set_attributes("#news img", "src", sb_banner_logo)
49+
options = [("theme", "material"), ("width", "52%")]
50+
message = 'With one button, you can press "Enter/Return", "Y", or "1".'
51+
self.get_jqc_button_input(message, ["OK"], options)
52+
53+
self.open("https://xkcd.com/556/")
54+
self.set_attributes("#news img", "src", sb_banner_logo)
55+
options = [("theme", "bootstrap"), ("width", "52%")]
56+
message = 'If the lowercase button text is "yes" or "no", '
57+
message += '<br><br>you can use the "Y" or "N" keys as shortcuts. '
58+
message += '<br><br><br>Other shortcuts include: <br><br>'
59+
message += '"1": 1st button, "2": 2nd button, etc. Got it?'
60+
buttons = [("YES", "green"), ("NO", "red")]
61+
choice = self.get_jqc_button_input(message, buttons, options)
62+
63+
message = 'You said "%s"! <br><br>' % choice
64+
if choice == "YES":
65+
message += "Wonderful! Let's continue with the next example..."
66+
else:
67+
message += "You can learn more from SeleniumBase Docs..."
68+
choice = self.get_jqc_button_input(message, ["OK"], options)
69+
70+
self.open("https://seleniumbase.io")
71+
self.set_jqc_theme("light", color="green", width="38%")
72+
message = "<b>This is the SeleniumBase Docs website!</b><br /><br />"
73+
message += "What would you like to search for?<br />"
74+
text = self.get_jqc_text_input(message, ["Search"])
75+
self.update_text('input[aria-label="Search"]', text + "\n")
76+
self.wait_for_ready_state_complete()
77+
self.set_jqc_theme("bootstrap", color="red", width="32%")
78+
if self.is_text_visible("No matching documents", ".md-search-result"):
79+
self.get_jqc_button_input("Your search had no results!", ["OK"])
80+
elif self.is_element_visible("a.md-search-result__link"):
81+
self.click("a.md-search-result__link")
82+
self.set_jqc_theme("bootstrap", color="green", width="32%")
83+
self.get_jqc_button_input("You found search results!", ["OK"])
84+
elif self.is_text_visible("Type to start searching", "div.md-search"):
85+
self.get_jqc_button_input("You did not do a search!", ["OK"])
86+
else:
87+
self.get_jqc_button_input("We're not sure what happened.", ["OK"])
88+
89+
self.open("https://seleniumbase.io/help_docs/ReadMe/")
90+
self.highlight("h1")
91+
self.highlight_click('a:contains("Running Example Tests")')
92+
self.highlight("h1")
93+
94+
self.set_jqc_theme("bootstrap", color="green", width="52%")
95+
message = 'See the "SeleniumBase/examples" section for more info!'
96+
self.get_jqc_button_input(message, ["OK"])
97+
98+
self.set_jqc_theme("bootstrap", color="purple", width="56%")
99+
message = "Now let's combine form inputs with multiple button options!"
100+
message += "<br /><br />"
101+
message += "Pick something to search. Then pick the site to search on."
102+
buttons = ["XKCD.com", "Wikipedia.org"]
103+
text, choice = self.get_jqc_form_inputs(message, buttons)
104+
if choice == "XKCD.com":
105+
self.open("https://relevant-xkcd.github.io/")
106+
else:
107+
self.open("https://en.wikipedia.org/wiki/Main_Page")
108+
self.highlight_update_text('input[name="search"]', text + "\n")
109+
self.wait_for_ready_state_complete()
110+
self.highlight("body")
111+
self.reset_jqc_theme()
112+
self.get_jqc_button_input("<b>Here are your results.</b>", ["OK"])
113+
message = "<h3>You've reached the end of this tutorial!</h3><br />"
114+
message += "Thanks for learning about SeleniumBase Dialog Boxes!<br />"
115+
message += "<br />Check out the SeleniumBase page on GitHub for more!"
116+
self.set_jqc_theme("modern", color="purple", width="56%")
117+
self.get_jqc_button_input(message, ["Goodbye!"])

help_docs/ReadMe.md

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -5,35 +5,35 @@
55
<p align="left">
66
<a href="https://seleniumbase.io/#python_installation">🚀 Start</a> |
77
<a href="https://seleniumbase.io/help_docs/customizing_test_runs/">🖥️ CLI</a> |
8-
<a href="https://seleniumbase.io/help_docs/features_list/">🗂️ Features</a>
8+
<a href="https://seleniumbase.io/help_docs/features_list/">🏰 Features</a>
99
<br />
10-
<a href="https://seleniumbase.io/examples/ReadMe/">📖 Examples</a> |
10+
<a href="https://seleniumbase.io/examples/ReadMe/">👨‍🏫 Examples</a> |
1111
<a href="https://seleniumbase.io/help_docs/mobile_testing/">📱 Mobile</a>
1212
<br />
13-
<a href="https://seleniumbase.io/help_docs/syntax_formats/">🔡 Syntax Formats</a> |
13+
<a href="https://seleniumbase.io/help_docs/syntax_formats/">🔠 Syntax Formats</a> |
1414
<a href="https://seleniumbase.io/integrations/github/workflows/ReadMe/">🤖 CI</a>
1515
<br />
16-
<a href="https://seleniumbase.io/help_docs/method_summary/">📗 API</a> |
17-
<a href="https://seleniumbase.io/examples/example_logs/ReadMe/">📋 Reports</a> |
16+
<a href="https://seleniumbase.io/help_docs/method_summary/">📚 API</a> |
17+
<a href="https://seleniumbase.io/examples/example_logs/ReadMe/">📊 Reports</a> |
1818
<a href="https://seleniumbase.io/examples/tour_examples/ReadMe/">🗺️ Tours</a>
1919
<br />
20-
<a href="https://seleniumbase.io/seleniumbase/console_scripts/ReadMe/">💻 Console Scripts</a> |
20+
<a href="https://seleniumbase.io/seleniumbase/console_scripts/ReadMe/">🧙‍ Console Scripts</a> |
2121
<a href="https://seleniumbase.io/seleniumbase/utilities/selenium_grid/ReadMe/">🌐 Grid</a>
2222
<br />
2323
<a href="https://github.com/seleniumbase/SeleniumBase/tree/master/examples/boilerplates">♻️ Boilerplates</a> |
2424
<a href="https://seleniumbase.io/help_docs/locale_codes/">🗾 Locales</a>
2525
<br />
26-
<a href="https://seleniumbase.io/help_docs/js_package_manager/">🗄️ PkgManager</a> |
26+
<a href="https://seleniumbase.io/help_docs/js_package_manager/">🕹️ JSManager</a> |
2727
<a href="https://seleniumbase.io/examples/visual_testing/ReadMe/">🖼️ VisualTest</a>
2828
<br />
2929
<a href="https://seleniumbase.io/help_docs/translations/">🌏 Translate</a> |
30-
<a href="https://seleniumbase.io/examples/master_qa/ReadMe/">🛂 MasterQA</a>
30+
<a href="https://seleniumbase.io/examples/dialog_boxes/ReadMe/">🛂 DialogBoxes</a>
3131
<br />
3232
<a href="https://seleniumbase.io/seleniumbase/utilities/selenium_ide/ReadMe/">⏺️ Recorder</a> |
3333
<a href="https://github.com/seleniumbase/SeleniumBase/tree/master/integrations/node_js">🏃 NodeRunner</a>
3434
<br />
35-
<a href="https://seleniumbase.io/examples/presenter/ReadMe/">📑 Presenter</a> |
36-
<a href="https://seleniumbase.io/examples/chart_maker/ReadMe/">📊 ChartMaker</a>
35+
<a href="https://seleniumbase.io/examples/presenter/ReadMe/">📰 Presenter</a> |
36+
<a href="https://seleniumbase.io/examples/chart_maker/ReadMe/">📶 ChartMaker</a>
3737
</p>
3838

3939
--------

0 commit comments

Comments
 (0)