fix: added test case and working solution for empty li elements in the 'Create an ordered list' challenge. (#35177)

* fix: added test case for empty li elements

* fix: added error message in test case of empty li elements.

* fix: corrected error in test case.

* fix: added valid working solution

* fix: migrated test case to challenge: create-an-ordered-list (working solution included)

* fix: adjusted condition for empty li elements and fixed typo.
This commit is contained in:
Alan Nguy 2019-03-01 13:20:09 -05:00 committed by Aditya
parent a0b79252d3
commit 1957b1f636
2 changed files with 38 additions and 4 deletions

View File

@ -64,7 +64,19 @@ tests:
## Solution
<section id='solution'>
```js
// solution required
```html
<h2>CatPhotoApp</h2>
<main>
<p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<ul>
<li>milk</li>
<li>mice</li>
<li>catnip</li>
</ul>
</main>
```
</section>

View File

@ -42,6 +42,10 @@ tests:
testString: assert(code.match(/<\/ol>/g) && code.match(/<\/ol>/g).length === code.match(/<ol>/g).length, 'Make sure your <code>ol</code> element has a closing tag.');
- text: Make sure your <code>li</code> element has a closing tag.
testString: assert(code.match(/<\/li>/g) && code.match(/<li>/g) && code.match(/<\/li>/g).length === code.match(/<li>/g).length, 'Make sure your <code>li</code> element has a closing tag.');
- text: The <code>li</code> elements in your unordered list should not be empty.
testString: $('ul li').each((i, val) => assert(val.textContent.replace(/\s/g, ''), 'Your <code>li</code> elements in your unordered list should not be empty.'));
- text: The <code>li</code> elements in your ordered list should not be empty.
testString: $('ol li').each((i, val) => assert(!!val.textContent.replace(/\s/g, ''), 'Your <code>li</code> elements in your ordered list should not be empty.'));
```
@ -79,7 +83,25 @@ tests:
## Solution
<section id='solution'>
```js
// solution required
```html
<h2>CatPhotoApp</h2>
<main>
<p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>hate 1</li>
<li>hate 2</li>
<li>hate 3</li>
</ol>
</main>
```
</section>