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:
@ -64,7 +64,19 @@ tests:
|
|||||||
## Solution
|
## Solution
|
||||||
<section id='solution'>
|
<section id='solution'>
|
||||||
|
|
||||||
```js
|
```html
|
||||||
// solution required
|
<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>
|
</section>
|
||||||
|
@ -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.');
|
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.
|
- 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.');
|
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
|
## Solution
|
||||||
<section id='solution'>
|
<section id='solution'>
|
||||||
|
|
||||||
```js
|
```html
|
||||||
// solution required
|
<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>
|
</section>
|
||||||
|
Reference in New Issue
Block a user