Skip to content

Commit

Permalink
tdd-ception slide
Browse files Browse the repository at this point in the history
  • Loading branch information
@marmer
marmer committed Oct 17, 2024
1 parent fec33ed commit 66e85e8
Showing 1 changed file with 141 additions and 14 deletions.
155 changes: 141 additions & 14 deletions docs/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1004,36 +1004,35 @@ <h3>Quality - TDD</h3>
<h3>TDD - Theory</h3>

<svg width="400" height="400">
<g transform="translate(-170 0) scale(1.15 1.15)" opacity="0.6">
<circle r="155" cx="320" cy="180" fill="none" stroke="#fff" stroke-width="10"/>
<path d="M 320 40 L 320 30 A 120 30 400 0 1 390 48 Z" fill="red"
fill-opacity="1"/>
<g transform="scale(1 1) translate(-120 20)" opacity="1">
<circle r="150" cx="320" cy="180" fill="none" stroke="#fff" stroke-width="5"></circle>
<path d="M 320 40 L 320 30 A 120 30 400 0 1 390 48 Z" fill="red" fill-opacity="1"></path>

<path transform="rotate(120 320 180)" d="M 320 40 L 320 30 A 120 30 400 0 1 390 48 Z"
fill="green"
fill-opacity="1"/>
fill="green" fill-opacity="1"></path>

<path transform="rotate(240 320 180)" d="M 320 40 L 320 30 A 120 30 400 0 1 390 48 Z"
fill="blue"
fill-opacity="1"/>
fill="blue" fill-opacity="1"></path>


<g transform="rotate(60 320 180)">
<path fill="red"
d="M320,180L190.0961894323342,105.00000000000001A150,150,0,0,1,449.9038105676658,105.00000000000001Z"
stroke-width="1"/>
stroke-width="1"></path>
<path fill="green"
d="M320,180L449.9038105676658,105.00000000000001A150,150,0,0,1,320,330Z"
stroke-width="1"/>
stroke-width="1"></path>
<path fill="blue"
d="M320,180L320,330A150,150,0,0,1,190.0961894323342,104.99999999999999Z"
stroke-width="1"/>
stroke-width="1"></path>

</g>

<path d="m 320 180 L 320 30" stroke="#fff" stroke-width="1"/>
<path transform="rotate(120 320 180)" d="m 320 180 L 320 30" stroke="#fff" stroke-width="1"/>
<path transform="rotate(240 320 180)" d="m 320 180 L 320 30" stroke="#fff" stroke-width="1"/>
<path d="m 320 180 L 320 30" stroke="#fff" stroke-width="1"></path>
<path transform="rotate(120 320 180)" d="m 320 180 L 320 30" stroke="#fff"
stroke-width="1"></path>
<path transform="rotate(240 320 180)" d="m 320 180 L 320 30" stroke="#fff"
stroke-width="1"></path>

<text text-anchor="start" x="330" y="80" font-size=".47em" fill="#FFFFFF">Red:
<tspan x="330" font-size=".75em" dy="1.5em">- create test</tspan>
Expand All @@ -1055,6 +1054,134 @@ <h3>TDD - Theory</h3>
</g>
</svg>


<aside aria-label="speaker notes" class="notes">

</aside>

</section>

<section>
<h3>TDD - Theory</h3>

<svg width="400" height="400">
<g transform="rotate(-40 200 200)">
<g transform="scale(1.25 1.25) translate(-160 -20)" opacity="0.4">
<circle r="154.5" cx="320" cy="180" fill="none" stroke="#fff" stroke-width="9"></circle>
<path d="M 320 40 L 320 30 A 120 30 400 0 1 390 48 Z" fill="red"
fill-opacity="1"></path>

<path transform="rotate(120 320 180)" d="M 320 40 L 320 30 A 120 30 400 0 1 390 48 Z"
fill="green" fill-opacity="1"></path>

<path transform="rotate(240 320 180)" d="M 320 40 L 320 30 A 120 30 400 0 1 390 48 Z"
fill="blue" fill-opacity="1"></path>

<g transform="rotate(60 320 180)">
<path fill="red"
d="M320,180L190.0961894323342,105.00000000000001A150,150,0,0,1,449.9038105676658,105.00000000000001Z"
stroke-width="1"></path>
<path fill="green"
d="M320,180L449.9038105676658,105.00000000000001A150,150,0,0,1,320,330Z"
stroke-width="1"></path>
<path fill="blue"
d="M320,180L320,330A150,150,0,0,1,190.0961894323342,104.99999999999999Z"
stroke-width="1"></path>

</g>

<path d="m 320 180 L 320 30" stroke="#fff" stroke-width="1"></path>
<path transform="rotate(120 320 180)" d="m 320 180 L 320 30" stroke="#fff"
stroke-width="1"></path>
<path transform="rotate(240 320 180)" d="m 320 180 L 320 30" stroke="#fff"
stroke-width="1"></path>
</g>
</g>

<g transform="rotate(-20 200 200)">
<g transform="scale(1.12 1.12) translate(-140 -2)" opacity="0.40">
<circle r="150" cx="320" cy="180" fill="none" stroke="#fff" stroke-width="5"></circle>
<path d="M 320 40 L 320 30 A 120 30 400 0 1 390 48 Z" fill="red"
fill-opacity="1"></path>

<path transform="rotate(120 320 180)" d="M 320 40 L 320 30 A 120 30 400 0 1 390 48 Z"
fill="green" fill-opacity="1"></path>

<path transform="rotate(240 320 180)" d="M 320 40 L 320 30 A 120 30 400 0 1 390 48 Z"
fill="blue" fill-opacity="1"></path>

<g transform="rotate(60 320 180)">
<path fill="red"
d="M320,180L190.0961894323342,105.00000000000001A150,150,0,0,1,449.9038105676658,105.00000000000001Z"
stroke-width="1"></path>
<path fill="green"
d="M320,180L449.9038105676658,105.00000000000001A150,150,0,0,1,320,330Z"
stroke-width="1"></path>
<path fill="blue"
d="M320,180L320,330A150,150,0,0,1,190.0961894323342,104.99999999999999Z"
stroke-width="1"></path>

</g>

<path d="m 320 180 L 320 30" stroke="#fff" stroke-width="1"></path>
<path transform="rotate(120 320 180)" d="m 320 180 L 320 30" stroke="#fff"
stroke-width="1"></path>
<path transform="rotate(240 320 180)" d="m 320 180 L 320 30" stroke="#fff"
stroke-width="1"></path>
</g>
</g>

<g transform="scale(1 1) translate(-120 20)" opacity="1">
<circle r="150" cx="320" cy="180" fill="none" stroke="#fff" stroke-width="5"></circle>
<path d="M 320 40 L 320 30 A 120 30 400 0 1 390 48 Z" fill="red" fill-opacity="1"></path>

<path transform="rotate(120 320 180)" d="M 320 40 L 320 30 A 120 30 400 0 1 390 48 Z"
fill="green" fill-opacity="1"></path>

<path transform="rotate(240 320 180)" d="M 320 40 L 320 30 A 120 30 400 0 1 390 48 Z"
fill="blue" fill-opacity="1"></path>


<g transform="rotate(60 320 180)">
<path fill="red"
d="M320,180L190.0961894323342,105.00000000000001A150,150,0,0,1,449.9038105676658,105.00000000000001Z"
stroke-width="1"></path>
<path fill="green"
d="M320,180L449.9038105676658,105.00000000000001A150,150,0,0,1,320,330Z"
stroke-width="1"></path>
<path fill="blue"
d="M320,180L320,330A150,150,0,0,1,190.0961894323342,104.99999999999999Z"
stroke-width="1"></path>

</g>

<path d="m 320 180 L 320 30" stroke="#fff" stroke-width="1"></path>
<path transform="rotate(120 320 180)" d="m 320 180 L 320 30" stroke="#fff"
stroke-width="1"></path>
<path transform="rotate(240 320 180)" d="m 320 180 L 320 30" stroke="#fff"
stroke-width="1"></path>

<text text-anchor="start" x="330" y="80" font-size=".47em" fill="#FFFFFF">Red:
<tspan x="330" font-size=".75em" dy="1.5em">- create test</tspan>
<tspan x="330" font-size=".75em" dy="1em">- verify red</tspan>
<tspan x="330" font-size=".75em" dy="1em">- verify message</tspan>
</text>

<text text-anchor="middle" x="320" y="230" font-size=".47em" fill="#FFFFFF">Green:
<tspan x="320" font-size=".75em" dy="1.5em">- min required prod-code</tspan>
</text>
<text text-anchor="end" x="315" y="80" font-size=".47em" fill="#FFFFFF">Refactor:
<tspan x="315" font-size=".75em" dy="1.5em">- remove dublets</tspan>
<tspan x="315" font-size=".75em" dy="1em">- don't add logic</tspan>
<tspan x="315" font-size=".75em" dy="1em">- improve identifier,</tspan>
<tspan x="315" font-size=".75em" dy="1em">structure, readability</tspan>
<tspan x="315" font-size=".75em" dy="1em">- only one side at once</tspan>
<tspan x="315" font-size=".75em" dy="1em">(prod- or test code)</tspan>
</text>
</g>
</svg>


<aside aria-label="speaker notes" class="notes">
<ul>
<li> This works on different stages at once as well.
Expand Down

0 comments on commit 66e85e8

Please sign in to comment.