forked from TestSheepNZ/TestSheepNZ.github.io
-
Notifications
You must be signed in to change notification settings - Fork 0
/
testing-ideas.html
346 lines (276 loc) · 14.4 KB
/
testing-ideas.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="Testing Ideas">
<meta name="author" content="TestSheepNZ">
<title>Testing Ideas</title>
<!-- Bootstrap core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom fonts for this template -->
<link href="vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
<link href='https://fonts.googleapis.com/css?family=Kaushan+Script' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700' rel='stylesheet' type='text/css'>
<!-- Custom styles for this template -->
<link href="css/agency.min.css" rel="stylesheet">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="shortcut icon" href="img/testsheep.ico" type="image/x-icon" />
<link rel="icon" href="img/testsheep.ico">
</head>
<body id="page-top">
<!-- Navigation -->
<nav class="navbar navbar-expand-lg navbar-dark fixed-top" id="mainNav">
<div id="mainNavigation"></div>
</nav>
<!-- Header -->
<!-- Header -->
<header class="masthead">
<div class="container">
<div class="intro-text">
<div class="intro-heading text-uppercase">Oblique Testing</div>
<div class="intro-lead-in">Your aid to better testing ideas</div>
</div>
</div>
</header>
<!-- Contents -->
<section class="bg-light page-section" id="main-body">
<div class="container">
<div class="row">
<div class="col-lg-12 text-left">
<form id="selectNextHeader" class="form-horizontal" method="post" action="" hidden>
<table>
<tr>
<td><input type="button" class="btn btn-primary" id="getRandom" value="Get Random" onClick="selectCard(true)"></td>
<td> </td>
<td><input type="button" class="btn btn-secondary" id="getNext" value="Get Next" onClick="selectCard(false)"></td>
</tr>
</table>
</form>
<p></p>
<table class="p-3 mb-2 bg-primary text-white" id="cardTable" hidden>
<caption id="cardCaption" ></caption>
<tr>
<th>
<h2 id="cardTitle"></h2>
</th>
</tr>
<tr>
<td>
<p id="cardDescription"></p>
</td>
</tr>
<tr>
<td><img src="img/one-star.png" width="80%"></td>
</tr>
</table>
<form id="welcomeForm" class="form-horizontal" method="post" action="" >
<p>Welcome to Oblique Testing!</p>
<p>These cards are based on the ideas of <a href="https://en.wikipedia.org/wiki/Oblique_Strategies">Brian Eno's Oblique Strategies</a>.</p>
<p>Each card represents a one-star review of your system. The aim is to assume the comment is valid, and revist your testing to determine how you'd attempt to discover that problem.</p>
<p>The aim of the cards is to prevent our testing getting into a rut, and approach differently and inventively. The cards can also be used to help check a test approach for any holes in coverage.</p>
<p>Buy the book for more details on <a href="https://leanpub.com/obliquetesting">Oblique Testing here</a>.</p>
<p><b>Pick to either choose a card randomly or work through</b></p>
<table>
<tr>
<td><input type="button" class="btn btn-primary" id="pickRandom" value="Select Random" onClick="selectCard(true)"></td>
<td> </td>
<td><input type="button" class="btn btn-secondary" id="pickFirst" value="Work from first" onClick="selectCard(false)"></td>
</tr>
</table>
</form>
<form id="selectNext" class="form-horizontal" method="post" action="" hidden>
<p>Want another card?</p>
<table>
<tr>
<td><input type="button" class="btn btn-primary" id="getRandom" value="Get Random" onClick="selectCard(true)"></td>
<td> </td>
<td><input type="button" class="btn btn-secondary" id="getNext" value="Get Next" onClick="selectCard(false)"></td>
</tr>
</table>
</form>
<script>
var dataSetup = false;
function selectCard(chooseRandom) {
if (dataSetup == false) {
setUpCards();
dataSetup = true;
}
if(chooseRandom) {
cardData.randomCard();
} else {
cardData.nextCard();
}
displayCard();
document.getElementById('welcomeForm').hidden = true;
document.getElementById('cardTable').hidden = false;
document.getElementById('selectNext').hidden = false;
document.getElementById('selectNextHeader').hidden = false;
}
var cardData = {
currentCard: -1,
itemSize: 0,
caption: 0,
title: 0,
description: 0,
add: function (providedTitle, providedDescription) {
if ( this.itemSize == 0 ) {
// Initialise
this.caption=[];
this.title = [];
this.description = [];
}
this.title.push(providedTitle);
this.description.push(providedDescription);
this.itemSize = this.itemSize + 1;
this.caption.push("Card " + this.itemSize);
},
randomCard: function () {
this.currentCard = parseInt(Math.random() * this.itemSize);
},
nextCard: function () {
this.currentCard = this.currentCard + 1;
if(this.currentCard == this.itemSize) {
this.currentCard = 0;
}
},
};
function displayCard () {
document.getElementById('cardCaption').innerHTML = cardData.caption[cardData.currentCard];
document.getElementById('cardTitle').innerHTML = cardData.title[cardData.currentCard];
document.getElementById('cardDescription').innerHTML = cardData.description[cardData.currentCard];
}
function setUpCards() {
cardData.add( "I loved the old version! It's rubbish now!",
"<ul><li>Test the core parts of your system.<li>Scrutinise your automation - revisit the tests, and the results.</ul>");
cardData.add( "Terrible application - did you even test this?",
"Venture into the functionality you least understand.");
cardData.add( "OMG - this doesn't even work on my device!",
"<ul><li>Test on a device you've never or rarely used.<li>Revisit analytics on which devices/browsers/machines use your system the most.");
cardData.add( "So angry - it doesn't work for my browser!",
"<ul><li>Test on a different browser.<li>Revisit analytics on which devices/browsers/machines use your system the most.");
cardData.add( "I applied, then changed my mind and cancelled ... but then I thought I really should. But the system told me I was already there. But I wasn't, was I? Just sort it out!",
"Try a crooked path through your system.");
cardData.add( "I was just processing a payment, and my connection was cut. I got charged, but I didn't get my product. YOU RIPPED ME OFF!",
"Interrupt connectivity during critical transactions.");
cardData.add( "I can't even ...",
"Revisit the basics.");
cardData.add( "It's so ridiculous, it works for my friends, but not for me!",
"Throw out the way you normally use the software. Try something complicated. Try something new.");
cardData.add( "My account got hacked - I didn't even know!",
"<ul><li>Maliciously change details for an account. Where could that be done?<li>Does the original account holder get a notification?<li>Do your audits allow you to work out when and where suspicious activity happened?<li>Has your system raised any red flags? Should it?");
cardData.add( "The site was hacked and my details were hijacked. HOW DARE YOU!",
"<ul><li>Review how client data is stored.<li>Revisit system security.<li>A great opportunity to revisit this year's OWASP top 10!");
cardData.add( "I rang the helpdesk - they didn't even know the service was down!!!!!",
"<ul><li>Turn off part of your test system.<li>Check for alarms and warnings.<li>What does the user see?");
cardData.add( "The service was down for HOURS!!! UTTER RUBBISH!",
"Rebuild part of your system from scratch/backups.<li>How long did it take?<li>Were there any unexpected complications?");
cardData.add( "I was waiting FOREVER for this to load!",
"<ul><li>Use the system using throttled internet! [Nothing is slower than public internet access points]<li>Revisit performance testing.");
cardData.add( "I lost so much information from my system - THANKS FOR NOTHING!",
"<ul><li>Recover client's information.<li>Create-Retrieve-Update-Delete");
cardData.add( "I thought this would make things easier to do! ONE STAR!!!",
"Revisit the sales pitch for your system. Is it delivering what it's supposed to?");
cardData.add( "I can see someone else's information!!! Who can see mine???",
"Think about privacy, and how it could go wrong.");
cardData.add( "I can't really see very well...",
"Is your product usable by all? <ul><li>Adjust font size.<li>Use a screen reader.<li>Use a poor resolution setting.<li>Use a contrast checker for your text font vs background colours.");
cardData.add( "There's another app that does this so much better, UNINSTALLED!",
"Take time to check out your competition.");
cardData.add( "No idea what I'm supposed to do - am I supposed to ring the helpdesk?",
"<ul><li>Are the help features useful and up to date? <li>Expose someone new to your system.");
cardData.add( "Grrr - I've changed my details, and I can't retrieve my account. Had to make a brand new one!",
"Simulate on your system,<ul><li>Marriage<li>Changed identity<li>Changed gender<li>Moved house<li>New mobile / email<li>Merging/linking two accounts when a customer accidentally creates two");
cardData.add( "My account got messed up. The helpdesk is ****ing useless - avoid!",
"Fix a mistake on a customer's account.");
cardData.add( "My details got garbled! Grrrr - really?",
"Take a deep dive into the system. Look at ... <ul><li>Back end<li>Database<li>Log files");
cardData.add( "I thought they'd fixed this already!",
"Revisit some old problems on the system, ensure they've not returned or morphed into new issues.");
cardData.add( "I phoned the helpdesk - I'm sure the person who 'helped me' stole my identity.",
"<ul><li>How could an admin abuse the helpdesk system?<li>How could that be limited?<li>How would they be caught?");
cardData.add( "Someone's using this system and impersonating me!",
"What checks are in place to make sure someone is who they really claim to be?");
cardData.add( "I kept getting told 'unknown error' - WTF does that mean?",
"<ul><li>Try to hit as many error messages as you can.<li>Are all the messaged meaningful to an end user, using plain English over technical messaging like 'e - unknown exception thrown'");
cardData.add( "D'oh! C'mon help me out here!",
"<ul><li>Do something really stupid with an account.<li>Fix it.");
cardData.add( "Imagine a message saying 'connecting please wait'. FOREVER",
"<ul><li>Test where two components or services interact.<li>Interupt or disrupt.<li>Maybe toggle your WiFi into airplane mode and back / pull cables and replace them.");
cardData.add( "The helpdesk said part of the system was down for maintenance, but it should still be working!",
"<ul><li>Experiment with your system under availability conditions when one node is down. Does everything still work?<li>Do changes done when part of the system is down eventually replicate over to the other site when down. (Make a new account and make sure you can see on both sites etc).");
cardData.add( "Joker: Ask me how I got these scars!",
"Talk with your team about nightmarish things which have gone wrong on other projects. Use them as inspiration for a set of tests on your current system.");
cardData.add( "Joker: Do I look like I have a plan?",
"<ul><li>Don't overthink. Just try a few things left field.<li>Break your patterns.<li>Don't try and justify what you're testing.<li>Be unpredictable.<li>Live without rules.");
cardData.add( "Joker: Just step outside and close the door.",
"Ensure nothing is left behind that shouldn't after,<ul><li>Logging out<li>Uninstalling<li>Deleting account");
cardData.add( "Joker: Introduce a little anarchy",
"What if one of your assumptions were wrong? Play around under that concept. Try your most sacred assumption first.");
}
</script>
</div>
</div>
</div>
</section>
<!-- Modal 1 -->
<div class="portfolio-modal modal fade" id="termsModal" tabindex="-1" role="dialog" aria-hidden="true"></div>
<!-- Modal 2 -->
<div class="portfolio-modal modal fade" id="aboutModal" tabindex="-1" role="dialog" aria-hidden="true"></div>
<!-- Footer -->
<footer class="footer">
<div class="container">
<div class="row">
<div class="col-md-4">
<span class="copyright">Copyright © Mike Talks 2019</span>
</div>
<div class="col-md-4">
<ul class="list-inline social-buttons">
<li class="list-inline-item">
<a href="https://twitter.com/TestSheepNZ">
<i class="fab fa-twitter"></i>
</a>
</li>
<li class="list-inline-item" hidden>
<a href="#">
<i class="fab fa-facebook-f"></i>
</a>
</li>
<li class="list-inline-item">
<a href="https://www.linkedin.com/in/mike-talks-3423348/">
<i class="fab fa-linkedin-in"></i>
</a>
</li>
</ul>
</div>
<div class="col-md-4">
<ul class="list-inline quicklinks">
<li class="list-inline-item" >
<a data-toggle="modal" href="#aboutModal">About</a>
</li>
<li class="list-inline-item">
<a data-toggle="modal" href="#termsModal">Terms of Use</a>
</li>
</ul>
</div>
</div>
</div>
</footer>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- Plugin JavaScript -->
<script src="vendor/jquery-easing/jquery.easing.min.js"></script>
<!-- Contact form JavaScript -->
<script src="js/jqBootstrapValidation.js"></script>
<script src="js/contact_me.js"></script>
<!-- Custom scripts for this template -->
<script src="js/agency.min.js"></script>
<!-- Sets up the header-->
<script src="js/main.navigation.js"></script>
<!-- Footer Modals -->
<script src="js/footer.modals.js"></script>
</body>
</html>