Re: [testdrivendevelopment] How would you TDD a website front-end?

"Russell Gold" <[email protected]> Thu, 2 Jan 2020 20:43:23 -0500
Newsgroups gmane.comp.programming.test-driven-development
Message-ID <[email protected]>
--Apple-Mail=_BB950D68-CC63-48CC-81FA-010BF28E35BA
Content-Transfer-Encoding: quoted-printable
Content-Type: text/plain;
	charset=utf-8

That was my original motivation in building HttpUnit=E2=80=A6 but it=E2=80=
=99s limited JavaScript capabilities don=E2=80=99t support many of today=
=E2=80=99s complex sites.=20

Other than that, the Document-View pattern is your friend.=20
-----------------
Author, Getting Started with Apache Maven <http://www.packtpub.com/getting=
-started-with-apache-maven/video>
Author, HttpUnit <http://www.httpunit.org> and SimpleStub <http://simplest=
ub.meterware.com>
Now blogging at <http://russgold.net/sw/>

Have you listened to Edict Zero <https://edictzero.wordpress.com <https://=
edictzero.wordpress.com/>>? If not, you don=E2=80=99t know what you=E2=80=
=99re missing!





> On Jan 2, 2020, at 6:58 PM, Avi Kessner <[email protected]> wrote:
>=20
> Test the changes to the model, not the GUI itself.
>=20
> On Fri, Jan 3, 2020, 00:26 George Dinwiddie <[email protected] <ma=
ilto:[email protected]>> wrote:
> Alan,
>=20
> Way back, I played with test-driving AWT and Java Swing UIs, starting=20
> with just jUnit. Given the availability of web driver libraries, you can=
=
=20
> do similar things much more easily.
>=20
> In general, I tested the GUI with a test API to make sure things were=20
> wired up correctly. I tested the actual API to make sure the system=20
> worked correctly.
>=20
> In=20
> https://github.com/gdinwiddie/EquineHoroscope/tree/master/src/test/java/=
com/gdinwiddie/equinehoroscope/acceptance <https://github.com/gdinwiddie/Eq=
uineHoroscope/tree/master/src/test/java/com/gdinwiddie/equinehoroscope/acce=
ptance>=20
> you can see an example of re-using a test that drove the API creation to=
=
=20
> check the same result from the GUI by injecting a different adapter to=
=20
> talk with the system under test.
>=20
>   - George
>=20
> > Alan Baljeu
> > [email protected] <mailto:[email protected]>
> >=20
> >=20
>=20
> --=20
>   ----------------------------------------------------------------------
>    * George Dinwiddie *                      http://blog.gdinwiddie.com =
<http://blog.gdinwiddie.com/>
>    Software Development                    http://www.idiacomputing.com =
<http://www.idiacomputing.com/>
>    Consultant and Coach
>   ----------------------------------------------------------------------
>=20
>=20
>=20
>=20
>=20


-=3D-=3D-=3D-=3D-=3D-=3D-=3D-=3D-=3D-=3D-=3D-
Groups.io Links: You receive all messages sent to this group.

View/Reply Online (#35827): https://groups.io/g/testdrivendevelopment/mess=
age/35827
Mute This Topic: https://groups.io/mt/69387056/3268755
Group Owner: [email protected]
Unsubscribe: https://groups.io/g/testdrivendevelopment/leave/6156322/74455=
6386/xyzzy  [[email protected]]
-=3D-=3D-=3D-=3D-=3D-=3D-=3D-=3D-=3D-=3D-=3D-


--Apple-Mail=_BB950D68-CC63-48CC-81FA-010BF28E35BA
Content-Transfer-Encoding: quoted-printable
Content-Type: text/html;
	charset=utf-8

<html><head><meta http-equiv=3D"Content-Type" content=3D"text/html; charset=
=
=3Dutf-8"></head><body style=3D"word-wrap: break-word; -webkit-nbsp-mode: =
space; line-break: after-white-space;" class=3D"">That was my original moti=
vation in building HttpUnit=E2=80=A6 but it=E2=80=99s limited JavaScript ca=
pabilities don=E2=80=99t support many of today=E2=80=99s complex sites.&nbs=
p;<div class=3D""><br class=3D""></div><div class=3D"">Other than that, the=
 Document-View pattern is your friend.&nbsp;<br class=3D""><div class=3D"">
<div style=3D"color: rgb(0, 0, 0); letter-spacing: normal; text-align: sta=
rt; text-indent: 0px; text-transform: none; white-space: normal; word-spaci=
ng: 0px; -webkit-text-stroke-width: 0px; word-wrap: break-word; -webkit-nbs=
p-mode: space; -webkit-line-break: after-white-space;" class=3D""><div styl=
e=3D"color: rgb(0, 0, 0); letter-spacing: normal; text-align: start; text-i=
ndent: 0px; text-transform: none; white-space: normal; word-spacing: 0px; -=
webkit-text-stroke-width: 0px; word-wrap: break-word; -webkit-nbsp-mode: sp=
ace; -webkit-line-break: after-white-space;" class=3D""><div style=3D"color=
: rgb(0, 0, 0); letter-spacing: normal; text-align: start; text-indent: 0px=
; text-transform: none; white-space: normal; word-spacing: 0px; -webkit-tex=
t-stroke-width: 0px; word-wrap: break-word; -webkit-nbsp-mode: space; -webk=
it-line-break: after-white-space;" class=3D""><div class=3D""><div style=3D=
"orphans: 2; widows: 2;" class=3D"">-----------------</div><div style=3D"or=
phans: 2; widows: 2;" class=3D"">Author,&nbsp;Getting Started with Apache M=
aven &lt;<a href=3D"http://www.packtpub.com/getting-started-with-apache-mav=
en/video" class=3D"">http://www.packtpub.com/getting-started-with-apache-ma=
ven/video</a>&gt;</div><div style=3D"orphans: 2; widows: 2;" class=3D"">Aut=
hor, HttpUnit &lt;<a href=3D"http://www.httpunit.org" class=3D"">http://www=
.httpunit.org</a>&gt; and SimpleStub &lt;<a href=3D"http://simplestub.meter=
ware.com" class=3D"">http://simplestub.meterware.com</a>&gt;<br class=3D"">=
Now blogging at &lt;<a href=3D"http://russgold.net/sw/" class=3D"">http://r=
ussgold.net/sw/</a>&gt;</div><div style=3D"orphans: 2; widows: 2;" class=3D=
""><br class=3D""></div><div style=3D"orphans: 2; widows: 2;" class=3D"">Ha=
ve you listened to Edict Zero &lt;<a href=3D"https://edictzero.wordpress.co=
m" class=3D"">https://edictzero.wordpress.com</a>&gt;? If not, you don=E2=
=80=99t know what you=E2=80=99re missing!</div></div></div><br class=3D"Ap=
ple-interchange-newline"></div><br class=3D"Apple-interchange-newline"></di=
v><br class=3D"Apple-interchange-newline"><br class=3D"Apple-interchange-ne=
wline">
</div>
<div><br class=3D""><blockquote type=3D"cite" class=3D""><div class=3D"">O=
n Jan 2, 2020, at 6:58 PM, Avi Kessner &lt;<a href=3D"mailto:akessner@gmail=
.com" class=3D"">[email protected]</a>&gt; wrote:</div><br class=3D"Apple-=
interchange-newline"><div class=3D""><div dir=3D"auto" style=3D"caret-color=
: rgb(0, 0, 0); font-family: Helvetica; font-size: 12px; font-style: normal=
; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; t=
ext-align: start; text-indent: 0px; text-transform: none; white-space: norm=
al; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration: non=
e;" class=3D"">Test the changes to the model, not the GUI itself.</div><br =
style=3D"caret-color: rgb(0, 0, 0); font-family: Helvetica; font-size: 12px=
; font-style: normal; font-variant-caps: normal; font-weight: normal; lette=
r-spacing: normal; text-align: start; text-indent: 0px; text-transform: non=
e; white-space: normal; word-spacing: 0px; -webkit-text-stroke-width: 0px; =
text-decoration: none;" class=3D""><div class=3D"gmail_quote" style=3D"care=
t-color: rgb(0, 0, 0); font-family: Helvetica; font-size: 12px; font-style:=
 normal; font-variant-caps: normal; font-weight: normal; letter-spacing: no=
rmal; text-align: start; text-indent: 0px; text-transform: none; white-spac=
e: normal; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decorati=
on: none;"><div dir=3D"ltr" class=3D"gmail_attr">On Fri, Jan 3, 2020, 00:26=
 George Dinwiddie &lt;<a href=3D"mailto:[email protected]" class=3D""=
>[email protected]</a>&gt; wrote:<br class=3D""></div><blockquote cla=
ss=3D"gmail_quote" style=3D"margin: 0px 0px 0px 0.8ex; border-left-width: 1=
px; border-left-style: solid; border-left-color: rgb(204, 204, 204); paddin=
g-left: 1ex;">Alan,<br class=3D""><br class=3D"">Way back, I played with te=
st-driving AWT and Java Swing UIs, starting<span class=3D"Apple-converted-s=
pace">&nbsp;</span><br class=3D"">with just jUnit. Given the availability o=
f web driver libraries, you can<span class=3D"Apple-converted-space">&nbsp;=
</span><br class=3D"">do similar things much more easily.<br class=3D""><br=
 class=3D"">In general, I tested the GUI with a test API to make sure thing=
s were<span class=3D"Apple-converted-space">&nbsp;</span><br class=3D"">wir=
ed up correctly. I tested the actual API to make sure the system<span class=
=
=3D"Apple-converted-space">&nbsp;</span><br class=3D"">worked correctly.<b=
r class=3D""><br class=3D"">In<span class=3D"Apple-converted-space">&nbsp;<=
/span><br class=3D""><a href=3D"https://github.com/gdinwiddie/EquineHorosco=
pe/tree/master/src/test/java/com/gdinwiddie/equinehoroscope/acceptance" rel=
=
=3D"noreferrer noreferrer" target=3D"_blank" class=3D"">https://github.com=
/gdinwiddie/EquineHoroscope/tree/master/src/test/java/com/gdinwiddie/equine=
horoscope/acceptance</a><span class=3D"Apple-converted-space">&nbsp;</span>=
<br class=3D"">you can see an example of re-using a test that drove the API=
 creation to<span class=3D"Apple-converted-space">&nbsp;</span><br class=3D=
"">check the same result from the GUI by injecting a different adapter to<s=
pan class=3D"Apple-converted-space">&nbsp;</span><br class=3D"">talk with t=
he system under test.<br class=3D""><br class=3D"">&nbsp;<span class=3D"App=
le-converted-space">&nbsp;</span>- George<br class=3D""><br class=3D"">&gt;=
 Alan Baljeu<br class=3D"">&gt;<span class=3D"Apple-converted-space">&nbsp;=
</span><a href=3D"mailto:[email protected]" target=3D"_blank" rel=3D"nor=
eferrer" class=3D"">[email protected]</a><br class=3D"">&gt;<span class=
=3D"Apple-converted-space">&nbsp;</span><br class=3D"">&gt;<span class=3D"=
Apple-converted-space">&nbsp;</span><br class=3D""><br class=3D"">--<span c=
lass=3D"Apple-converted-space">&nbsp;</span><br class=3D"">&nbsp;<span clas=
s=3D"Apple-converted-space">&nbsp;</span>----------------------------------=
------------------------------------<br class=3D"">&nbsp; &nbsp;* George Di=
nwiddie *&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nb=
sp; &nbsp;<span class=3D"Apple-converted-space">&nbsp;</span><a href=3D"htt=
p://blog.gdinwiddie.com/" rel=3D"noreferrer noreferrer" target=3D"_blank" c=
lass=3D"">http://blog.gdinwiddie.com</a><br class=3D"">&nbsp; &nbsp;Softwar=
e Development&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;=
 &nbsp;<span class=3D"Apple-converted-space">&nbsp;</span><a href=3D"http:/=
/www.idiacomputing.com/" rel=3D"noreferrer noreferrer" target=3D"_blank" cl=
ass=3D"">http://www.idiacomputing.com</a><br class=3D"">&nbsp; &nbsp;Consul=
tant and Coach<br class=3D"">&nbsp;<span class=3D"Apple-converted-space">&n=
bsp;</span>----------------------------------------------------------------=
------<br class=3D""><br class=3D""><br class=3D""><br class=3D""><br class=
=
=3D""></blockquote></div></div></blockquote></div><br class=3D""></div></b=
ody></html>

<div width=3D"1" style=3D"color:white;clear:both">_._,_._,_</div>
<hr>
Groups.io Links:<p>

You receive all messages sent to this group.


<p>

<a target=3D"_blank" href=3D"https://groups.io/g/testdrivendevelopment/mes=
sage/35827">View/Reply Online (#35827)</a> |


  <a target=3D"_blank" href=3D"mailto:[email protected]?subj=
ect=3DRe:%20Re%3A%20%5Btestdrivendevelopment%5D%20How%20would%20you%20TDD%2=
0a%20website%20front-end%3F">Reply To Group</a>
  
    | <a target=3D"_blank" href=3D"mailto:[email protected]?subject=3DPr=
ivate:%20Re:%20Re%3A%20%5Btestdrivendevelopment%5D%20How%20would%20you%20TD=
D%20a%20website%20front-end%3F">Reply To Sender</a>
  


|


  
    <a target=3D"_blank" href=3D"https://groups.io/mt/69387056/3268755">Mu=
te This Topic</a>
  

| <a href=3D"https://groups.io/g/testdrivendevelopment/post">New Topic</a>=
<br>



<br>

<a href=3D"https://groups.io/g/testdrivendevelopment/editsub/3268755">Your=
 Subscription</a> |
<a href=3D"mailto:[email protected]">Contact Group Own=
er</a> |

<a href=3D"https://groups.io/g/testdrivendevelopment/leave/6156322/7445563=
86/xyzzy">Unsubscribe</a>

 [[email protected]]<br>
<div width=3D"1" style=3D"color:white;clear:both">_._,_._,_</div>


--Apple-Mail=_BB950D68-CC63-48CC-81FA-010BF28E35BA--