<p dir="auto">I, as well as many others, have noticed a substantial amount of specs (<em>tests</em>) that are misleading and/or confusing.</p>
<p dir="auto">The reason why I made this huge issue thread, is because this is a large amount of work, and specs needs to be written after certain rules, that are easy to follow and understand for any level of skill.</p>
<p dir="auto">This is more of a discussion towards a solution to re-write current specs, and write future specs to cut down on issues, which aren't bugs but simply bad understading of a specific task, specified by a description and/or spec.</p>
<p dir="auto">Currently some of the dilemmas with the current specs are:</p>
<h4 dir="auto">The major of specs are misleading and lack of detail</h4>
<p dir="auto">Specs that does not give enough information makes a waypoint difficult to solve—not even based on experience, but overall solution.</p>
<blockquote>
<p dir="auto">Add two <code class="notranslate">div</code> elements inside your <code class="notranslate">div class="well"&gt;</code> element both with the class <code class="notranslate">col-xs-6</code>.</p>
</blockquote>
<p dir="auto">Taken from the <a href="http://freecodecamp.com/challenges/waypoint-create-bootstrap-wells" rel="nofollow">Create Bootstrap Wells</a> waypoint.</p>
<p dir="auto">The spec contradicts with it's description.</p>
<blockquote>
<p dir="auto">Bootstrap has a class called <code class="notranslate">well</code>  that can create a visual sense of depth for your columns. Nest one <code class="notranslate">div</code> element with the class <code class="notranslate">well</code>  within each of your <code class="notranslate">col-xs-6</code> <code class="notranslate">div</code> elements.</p>
</blockquote>
<h4 dir="auto">Some specs promotes bad practice, by bad implementation</h4>
<p dir="auto">This is already described in issue <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="102117864" data-permission-text="Title is private" data-url="https://github.com/freeCodeCamp/freeCodeCamp/issues/2306" data-hovercard-type="issue" data-hovercard-url="/freeCodeCamp/freeCodeCamp/issues/2306/hovercard" href="https://github.com/freeCodeCamp/freeCodeCamp/issues/2306">#2306</a> and should be entirely rethought. Testing syntax rather than behavior leads to unpredictable results (as show in the issue). This also promotes bad practices as not allowing code to be DRY, forcing the user to write a code a specific, predefined way.</p>
<p dir="auto">This discussion is another one entirely, which should not be taken up in this dicussion, as it is a fundamental change to specs that does this, which needs to test for unpredictable results based on given assignment of the waypoint.</p>
<h3 dir="auto">Specs are written in wrong formats</h3>
<p dir="auto">An example is the [http://www.freecodecamp.com/challenges/waypoint-manipulate-arrays-with-pop](Manipulate Arrays With pop) waypoint.</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="assert((function(d) {
  if (d[0] == 'John' &amp;&amp; d[1] == 23 &amp;&amp; d[2] == undefined) {
    return(true);
  } else {
    return(false);
  }
})(myArray), 'myArray should only have the first two values left([&quot;John&quot;, 23])');"><pre class="notranslate"><span class="pl-en">assert</span><span class="pl-kos">(</span><span class="pl-kos">(</span><span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-s1">d</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
  <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-s1">d</span><span class="pl-kos">[</span><span class="pl-c1">0</span><span class="pl-kos">]</span> <span class="pl-c1">==</span> <span class="pl-s">'John'</span> <span class="pl-c1">&amp;&amp;</span> <span class="pl-s1">d</span><span class="pl-kos">[</span><span class="pl-c1">1</span><span class="pl-kos">]</span> <span class="pl-c1">==</span> <span class="pl-c1">23</span> <span class="pl-c1">&amp;&amp;</span> <span class="pl-s1">d</span><span class="pl-kos">[</span><span class="pl-c1">2</span><span class="pl-kos">]</span> <span class="pl-c1">==</span> <span class="pl-c1">undefined</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-k">return</span><span class="pl-kos">(</span><span class="pl-c1">true</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span> <span class="pl-k">else</span> <span class="pl-kos">{</span>
    <span class="pl-k">return</span><span class="pl-kos">(</span><span class="pl-c1">false</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">(</span><span class="pl-s1">myArray</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">'myArray should only have the first two values left(["John", 23])'</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<blockquote>
<p dir="auto">myArray should only have the first two values left(["John", 23])</p>
</blockquote>
<p dir="auto">The variable name <code class="notranslate">myArray</code> could be changed and is not even tested, so it should not be part of the assert message. Consider</p>
<blockquote>
<p dir="auto">Should only contain the first two values.</p>
</blockquote>
<p dir="auto">The waypoint could also be cleaned up and remove the enclosed function and the comments that should be in the description and specs:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="var myArray = [&quot;John&quot;, 23, [&quot;cat&quot;, 2]];
var removed = myArray;

test(myArray, removed)"><pre class="notranslate"><span class="pl-k">var</span> <span class="pl-s1">myArray</span> <span class="pl-c1">=</span> <span class="pl-kos">[</span><span class="pl-s">"John"</span><span class="pl-kos">,</span> <span class="pl-c1">23</span><span class="pl-kos">,</span> <span class="pl-kos">[</span><span class="pl-s">"cat"</span><span class="pl-kos">,</span> <span class="pl-c1">2</span><span class="pl-kos">]</span><span class="pl-kos">]</span><span class="pl-kos">;</span>
<span class="pl-k">var</span> <span class="pl-s1">removed</span> <span class="pl-c1">=</span> <span class="pl-s1">myArray</span><span class="pl-kos">;</span>

<span class="pl-en">test</span><span class="pl-kos">(</span><span class="pl-s1">myArray</span><span class="pl-kos">,</span> <span class="pl-s1">removed</span><span class="pl-kos">)</span></pre></div>
<p dir="auto">It's less cumbersome for beginners, and a lot cleaner by keeping the rules in specs and how-tos in description.</p>
<p dir="auto">Also the specs could leverage the use of testing frameworks such as <a href="http://jasmine.github.io/" rel="nofollow">Jasmine</a>, or simply <a href="https://github.com/substack/tape">tape</a>. This would allow specs to be written as</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// tape
t.plan(2)
t.same(myArray, [&quot;John&quot;, 23], 'Should only contain the first two values')
t.same(removed, [&quot;cat&quot;, 2], 'Should contain the removed array')

// jasmine
it('should only contain the first two values', function () {
  expect(myArray).toEqual([&quot;John&quot;, 23])
})

it('should only contain the removed array', function () {
  expect(removed).toEqual([&quot;cat&quot;, 2])
})"><pre class="notranslate"><span class="pl-c">// tape</span>
<span class="pl-s1">t</span><span class="pl-kos">.</span><span class="pl-en">plan</span><span class="pl-kos">(</span><span class="pl-c1">2</span><span class="pl-kos">)</span>
<span class="pl-s1">t</span><span class="pl-kos">.</span><span class="pl-en">same</span><span class="pl-kos">(</span><span class="pl-s1">myArray</span><span class="pl-kos">,</span> <span class="pl-kos">[</span><span class="pl-s">"John"</span><span class="pl-kos">,</span> <span class="pl-c1">23</span><span class="pl-kos">]</span><span class="pl-kos">,</span> <span class="pl-s">'Should only contain the first two values'</span><span class="pl-kos">)</span>
<span class="pl-s1">t</span><span class="pl-kos">.</span><span class="pl-en">same</span><span class="pl-kos">(</span><span class="pl-s1">removed</span><span class="pl-kos">,</span> <span class="pl-kos">[</span><span class="pl-s">"cat"</span><span class="pl-kos">,</span> <span class="pl-c1">2</span><span class="pl-kos">]</span><span class="pl-kos">,</span> <span class="pl-s">'Should contain the removed array'</span><span class="pl-kos">)</span>

<span class="pl-c">// jasmine</span>
<span class="pl-en">it</span><span class="pl-kos">(</span><span class="pl-s">'should only contain the first two values'</span><span class="pl-kos">,</span> <span class="pl-k">function</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
  <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">myArray</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toEqual</span><span class="pl-kos">(</span><span class="pl-kos">[</span><span class="pl-s">"John"</span><span class="pl-kos">,</span> <span class="pl-c1">23</span><span class="pl-kos">]</span><span class="pl-kos">)</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span>

<span class="pl-en">it</span><span class="pl-kos">(</span><span class="pl-s">'should only contain the removed array'</span><span class="pl-kos">,</span> <span class="pl-k">function</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
  <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">removed</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toEqual</span><span class="pl-kos">(</span><span class="pl-kos">[</span><span class="pl-s">"cat"</span><span class="pl-kos">,</span> <span class="pl-c1">2</span><span class="pl-kos">]</span><span class="pl-kos">)</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span></pre></div>
<hr>
<blockquote>
<p dir="auto">This is incomplete, and will change over time as issues are being opened.</p>
</blockquote>
<p dir="auto">Challenge <a href="https://www.freecodecamp.com/challenges/call-out-optional-actions-with-button-info#?solution=%0A%3Clink%20href%3D%22https%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DLobster%22%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%3E%0A%3Cstyle%3E%0A%20%20.red-text%20%7B%0A%20%20%20%20color%3A%20red%3B%0A%20%20%7D%0A%0A%20%20h2%20%7B%0A%20%20%20%20font-family%3A%20Lobster%2C%20Monospace%3B%0A%20%20%7D%0A%0A%20%20p%20%7B%0A%20%20%20%20font-size%3A%2016px%3B%0A%20%20%20%20font-family%3A%20Monospace%3B%0A%20%20%7D%0A%0A%20%20.thick-green-border%20%7B%0A%20%20%20%20border-color%3A%20green%3B%0A%20%20%20%20border-width%3A%2010px%3B%0A%20%20%20%20border-style%3A%20solid%3B%0A%20%20%20%20border-radius%3A%2050%25%3B%0A%20%20%7D%0A%0A%20%20.smaller-image%20%7B%0A%20%20%20%20width%3A%20100px%3B%0A%20%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Cdiv%20class%3D%22container-fluid%22%3E%0A%20%20%3Ch2%20class%3D%22red-text%20text-center%22%3ECatPhotoApp%3C%2Fh2%3E%0A%0A%20%20%3Cp%3EClick%20here%20for%20%3Ca%20href%3D%22%23%22%3Ecat%20photos%3C%2Fa%3E.%3C%2Fp%3E%0A%0A%20%20%3Ca%20href%3D%22%23%22%3E%3Cimg%20class%3D%22smaller-image%20thick-green-border%22%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-relaxing-cat%22%20alt%3D%22A%20cute%20orange%20cat%20lying%20on%20its%20back.%20%22%3E%3C%2Fa%3E%0A%0A%20%20%3Cimg%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-running-cats%22%20class%3D%22img-responsive%22%20alt%3D%22Three%20kittens%20running%20towards%20the%20camera.%20%22%3E%0A%20%20%3Cbutton%20class%3D%22btn%20btn-block%20btn-primary%22%3ELike%3C%2Fbutton%3E%0A%20%20%3Cp%3EThings%20cats%20love%3A%3C%2Fp%3E%0A%20%20%3Cul%3E%0A%20%20%20%20%3Cli%3Ecat%20nip%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Elaser%20pointers%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Elasagna%3C%2Fli%3E%0A%20%20%3C%2Ful%3E%0A%20%20%3Cp%3ETop%203%20things%20cats%20hate%3A%3C%2Fp%3E%0A%20%20%3Col%3E%0A%20%20%20%20%3Cli%3Eflea%20treatment%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Ethunder%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Eother%20cats%3C%2Fli%3E%0A%20%20%3C%2Fol%3E%0A%20%20%3Cform%20fccfaa%3D%22%2Fsubmit-cat-photo%22%3E%0A%20%20%20%20%3Clabel%3E%3Cinput%20type%3D%22radio%22%20name%3D%22indoor-outdoor%22%3E%20Indoor%3C%2Flabel%3E%0A%20%20%20%20%3Clabel%3E%3Cinput%20type%3D%22radio%22%20name%3D%22indoor-outdoor%22%3E%20Outdoor%3C%2Flabel%3E%0A%20%20%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%3E%20Loving%3C%2Flabel%3E%0A%20%20%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%3E%20Lazy%3C%2Flabel%3E%0A%20%20%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%3E%20Crazy%3C%2Flabel%3E%0A%20%20%20%20%3Cinput%20type%3D%22text%22%20placeholder%3D%22cat%20photo%20URL%22%20required%3E%0A%20%20%20%20%3Cbutton%20type%3D%22submit%22%3ESubmit%3C%2Fbutton%3E%0A%20%20%3C%2Fform%3E%0A%3C%2Fdiv%3E%0A" rel="nofollow">Call out Optional Actions with Button Info</a> has an issue.<br>
User Agent is: <code class="notranslate">Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36</code>.<br>
Please describe how to reproduce this issue, and include links to screenshots if possible.</p>
<p dir="auto">My code:</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="
&lt;link href=&quot;https://fonts.googleapis.com/css?family=Lobster&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot;&gt;
&lt;style&gt;
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }

  .thick-green-border {
    border-color: green;
    border-width: 10px;
    border-style: solid;
    border-radius: 50%;
  }

  .smaller-image {
    width: 100px;
  }
&lt;/style&gt;

&lt;div class=&quot;container-fluid&quot;&gt;
  &lt;h2 class=&quot;red-text text-center&quot;&gt;CatPhotoApp&lt;/h2&gt;

  &lt;p&gt;Click here for &lt;a href=&quot;#&quot;&gt;cat photos&lt;/a&gt;.&lt;/p&gt;

  &lt;a href=&quot;#&quot;&gt;&lt;img class=&quot;smaller-image thick-green-border&quot; src=&quot;https://bit.ly/fcc-relaxing-cat&quot; alt=&quot;A cute orange cat lying on its back. &quot;&gt;&lt;/a&gt;

  &lt;img src=&quot;https://bit.ly/fcc-running-cats&quot; class=&quot;img-responsive&quot; alt=&quot;Three kittens running towards the camera. &quot;&gt;
  &lt;button class=&quot;btn btn-block btn-primary&quot;&gt;Like&lt;/button&gt;
  &lt;p&gt;Things cats love:&lt;/p&gt;
  &lt;ul&gt;
    &lt;li&gt;cat nip&lt;/li&gt;
    &lt;li&gt;laser pointers&lt;/li&gt;
    &lt;li&gt;lasagna&lt;/li&gt;
  &lt;/ul&gt;
  &lt;p&gt;Top 3 things cats hate:&lt;/p&gt;
  &lt;ol&gt;
    &lt;li&gt;flea treatment&lt;/li&gt;
    &lt;li&gt;thunder&lt;/li&gt;
    &lt;li&gt;other cats&lt;/li&gt;
  &lt;/ol&gt;
  &lt;form action=&quot;/submit-cat-photo&quot;&gt;
    &lt;label&gt;&lt;input type=&quot;radio&quot; name=&quot;indoor-outdoor&quot;&gt; Indoor&lt;/label&gt;
    &lt;label&gt;&lt;input type=&quot;radio&quot; name=&quot;indoor-outdoor&quot;&gt; Outdoor&lt;/label&gt;
    &lt;label&gt;&lt;input type=&quot;checkbox&quot; name=&quot;personality&quot;&gt; Loving&lt;/label&gt;
    &lt;label&gt;&lt;input type=&quot;checkbox&quot; name=&quot;personality&quot;&gt; Lazy&lt;/label&gt;
    &lt;label&gt;&lt;input type=&quot;checkbox&quot; name=&quot;personality&quot;&gt; Crazy&lt;/label&gt;
    &lt;input type=&quot;text&quot; placeholder=&quot;cat photo URL&quot; required&gt;
    &lt;button type=&quot;submit&quot;&gt;Submit&lt;/button&gt;
  &lt;/form&gt;
&lt;/div&gt;
"><pre class="notranslate"><span class="pl-kos">&lt;</span><span class="pl-ent">link</span> <span class="pl-c1">href</span>="<span class="pl-s">https://fonts.googleapis.com/css?family=Lobster</span>" <span class="pl-c1">rel</span>="<span class="pl-s">stylesheet</span>" <span class="pl-c1">type</span>="<span class="pl-s">text/css</span>"<span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;</span><span class="pl-ent">style</span><span class="pl-kos">&gt;</span>
  .<span class="pl-c1">red-text</span> {
    <span class="pl-c1">color</span><span class="pl-kos">:</span> red;
  }

  <span class="pl-ent">h2</span> {
    <span class="pl-c1">font-family</span><span class="pl-kos">:</span> Lobster<span class="pl-kos">,</span> Monospace;
  }

  <span class="pl-ent">p</span> {
    <span class="pl-c1">font-size</span><span class="pl-kos">:</span> <span class="pl-c1">16<span class="pl-smi">px</span></span>;
    <span class="pl-c1">font-family</span><span class="pl-kos">:</span> Monospace;
  }

  .<span class="pl-c1">thick-green-border</span> {
    <span class="pl-c1">border-color</span><span class="pl-kos">:</span> green;
    <span class="pl-c1">border-width</span><span class="pl-kos">:</span> <span class="pl-c1">10<span class="pl-smi">px</span></span>;
    <span class="pl-c1">border-style</span><span class="pl-kos">:</span> solid;
    <span class="pl-c1">border-radius</span><span class="pl-kos">:</span> <span class="pl-c1">50<span class="pl-smi">%</span></span>;
  }

  .<span class="pl-c1">smaller-image</span> {
    <span class="pl-c1">width</span><span class="pl-kos">:</span> <span class="pl-c1">100<span class="pl-smi">px</span></span>;
  }
<span class="pl-kos">&lt;/</span><span class="pl-ent">style</span><span class="pl-kos">&gt;</span>

<span class="pl-kos">&lt;</span><span class="pl-ent">div</span> <span class="pl-c1">class</span>="<span class="pl-s">container-fluid</span>"<span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">h2</span> <span class="pl-c1">class</span>="<span class="pl-s">red-text text-center</span>"<span class="pl-kos">&gt;</span>CatPhotoApp<span class="pl-kos">&lt;/</span><span class="pl-ent">h2</span><span class="pl-kos">&gt;</span>

  <span class="pl-kos">&lt;</span><span class="pl-ent">p</span><span class="pl-kos">&gt;</span>Click here for <span class="pl-kos">&lt;</span><span class="pl-ent">a</span> <span class="pl-c1">href</span>="<span class="pl-s">#</span>"<span class="pl-kos">&gt;</span>cat photos<span class="pl-kos">&lt;/</span><span class="pl-ent">a</span><span class="pl-kos">&gt;</span>.<span class="pl-kos">&lt;/</span><span class="pl-ent">p</span><span class="pl-kos">&gt;</span>

  <span class="pl-kos">&lt;</span><span class="pl-ent">a</span> <span class="pl-c1">href</span>="<span class="pl-s">#</span>"<span class="pl-kos">&gt;</span><span class="pl-kos">&lt;</span><span class="pl-ent">img</span> <span class="pl-c1">class</span>="<span class="pl-s">smaller-image thick-green-border</span>" <span class="pl-c1">src</span>="<span class="pl-s">https://bit.ly/fcc-relaxing-cat</span>" <span class="pl-c1">alt</span>="<span class="pl-s">A cute orange cat lying on its back. </span>"<span class="pl-kos">&gt;</span><span class="pl-kos">&lt;/</span><span class="pl-ent">a</span><span class="pl-kos">&gt;</span>

  <span class="pl-kos">&lt;</span><span class="pl-ent">img</span> <span class="pl-c1">src</span>="<span class="pl-s">https://bit.ly/fcc-running-cats</span>" <span class="pl-c1">class</span>="<span class="pl-s">img-responsive</span>" <span class="pl-c1">alt</span>="<span class="pl-s">Three kittens running towards the camera. </span>"<span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">button</span> <span class="pl-c1">class</span>="<span class="pl-s">btn btn-block btn-primary</span>"<span class="pl-kos">&gt;</span>Like<span class="pl-kos">&lt;/</span><span class="pl-ent">button</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">p</span><span class="pl-kos">&gt;</span>Things cats love:<span class="pl-kos">&lt;/</span><span class="pl-ent">p</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">ul</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">li</span><span class="pl-kos">&gt;</span>cat nip<span class="pl-kos">&lt;/</span><span class="pl-ent">li</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">li</span><span class="pl-kos">&gt;</span>laser pointers<span class="pl-kos">&lt;/</span><span class="pl-ent">li</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">li</span><span class="pl-kos">&gt;</span>lasagna<span class="pl-kos">&lt;/</span><span class="pl-ent">li</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;/</span><span class="pl-ent">ul</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">p</span><span class="pl-kos">&gt;</span>Top 3 things cats hate:<span class="pl-kos">&lt;/</span><span class="pl-ent">p</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">ol</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">li</span><span class="pl-kos">&gt;</span>flea treatment<span class="pl-kos">&lt;/</span><span class="pl-ent">li</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">li</span><span class="pl-kos">&gt;</span>thunder<span class="pl-kos">&lt;/</span><span class="pl-ent">li</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">li</span><span class="pl-kos">&gt;</span>other cats<span class="pl-kos">&lt;/</span><span class="pl-ent">li</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;/</span><span class="pl-ent">ol</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">form</span> <span class="pl-c1">action</span>="<span class="pl-s">/submit-cat-photo</span>"<span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">label</span><span class="pl-kos">&gt;</span><span class="pl-kos">&lt;</span><span class="pl-ent">input</span> <span class="pl-c1">type</span>="<span class="pl-s">radio</span>" <span class="pl-c1">name</span>="<span class="pl-s">indoor-outdoor</span>"<span class="pl-kos">&gt;</span> Indoor<span class="pl-kos">&lt;/</span><span class="pl-ent">label</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">label</span><span class="pl-kos">&gt;</span><span class="pl-kos">&lt;</span><span class="pl-ent">input</span> <span class="pl-c1">type</span>="<span class="pl-s">radio</span>" <span class="pl-c1">name</span>="<span class="pl-s">indoor-outdoor</span>"<span class="pl-kos">&gt;</span> Outdoor<span class="pl-kos">&lt;/</span><span class="pl-ent">label</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">label</span><span class="pl-kos">&gt;</span><span class="pl-kos">&lt;</span><span class="pl-ent">input</span> <span class="pl-c1">type</span>="<span class="pl-s">checkbox</span>" <span class="pl-c1">name</span>="<span class="pl-s">personality</span>"<span class="pl-kos">&gt;</span> Loving<span class="pl-kos">&lt;/</span><span class="pl-ent">label</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">label</span><span class="pl-kos">&gt;</span><span class="pl-kos">&lt;</span><span class="pl-ent">input</span> <span class="pl-c1">type</span>="<span class="pl-s">checkbox</span>" <span class="pl-c1">name</span>="<span class="pl-s">personality</span>"<span class="pl-kos">&gt;</span> Lazy<span class="pl-kos">&lt;/</span><span class="pl-ent">label</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">label</span><span class="pl-kos">&gt;</span><span class="pl-kos">&lt;</span><span class="pl-ent">input</span> <span class="pl-c1">type</span>="<span class="pl-s">checkbox</span>" <span class="pl-c1">name</span>="<span class="pl-s">personality</span>"<span class="pl-kos">&gt;</span> Crazy<span class="pl-kos">&lt;/</span><span class="pl-ent">label</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">input</span> <span class="pl-c1">type</span>="<span class="pl-s">text</span>" <span class="pl-c1">placeholder</span>="<span class="pl-s">cat photo URL</span>" <span class="pl-c1">required</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">button</span> <span class="pl-c1">type</span>="<span class="pl-s">submit</span>"<span class="pl-kos">&gt;</span>Submit<span class="pl-kos">&lt;/</span><span class="pl-ent">button</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;/</span><span class="pl-ent">form</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;/</span><span class="pl-ent">div</span><span class="pl-kos">&gt;</span></pre></div>
<p dir="auto">I'm working with the editor in these dang challenges. These dang challenges have a dang bad editor. This dang bad editor keeps making me have weird issues in changing the position of my dang cursor. Please fix this dang problem dang immediately.</p>