gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Feat: add new Markdown parser (#39800)

Browse Source 
and change all the challenges to new `md` format.
This commit is contained in:
Oliver Eyton-Williams
2020-11-27 19:02:05 +01:00
committed by GitHub
parent a07f84c8ec
commit 0bd52f8bd1
2580 changed files with 113436 additions and 111979 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
curriculum/challenges/english/01-responsive-web-design/basic-html-cat-photo-app/part-036.md
View File

@@ -4,46 +4,61 @@ title: Part 36
challengeType: 0
---
## Description
<section id='description'>
# --description--
The `input` element is allows you several ways to collect data from a web form. Like anchor (`a`) elements, `input` elements are <dfn>self-closing</dfn> and do not need closing tags.
Nest an `input` element in the `form` element.
</section>
# --hints--
## Tests
<section id='tests'>
```yml
tests:
- text: Your `form` element should have an opening tag and closing tag in the correct order. You may be missing one or both of the required tags, or have them in the wrong order.
testString: |
const noSpaces = code.replace(/\s/g, '');
assert(
document.querySelector('form') &&
code.match(/<\/form>/g) &&
noSpaces.indexOf('<form') < noSpaces.indexOf('</form>')
);
- text: Your `form` element's opening tag should only have an `action` attribute. Remove anything else you may have typed in it.
testString: assert( [...document.querySelector('form').attributes].length < 2 );
- text: You should create an input element. Check the syntax.
testString: assert( document.querySelector('input') );
- text: Your `input` element should have an opening tag, but not a closing tag.
testString: assert( document.querySelector('input') && !code.match(/<\/input\>/g) );
- text: Your `input` element should be nested within the `form` element.
testString: assert( document.querySelector('form > input') );
- text: Your `form` should only contain the `input` element. Remove any HTML elements or text between the `form` element's tags.
testString: assert( $('form')[0].children.length === 1 && $('form')[0].innerText.trim().length === 0 );
Your `form` element should have an opening tag and closing tag in the correct order. You may be missing one or both of the required tags, or have them in the wrong order.
```js
const noSpaces = code.replace(/\s/g, '');
assert(
document.querySelector('form') &&
code.match(/<\/form>/g) &&
noSpaces.indexOf('<form') < noSpaces.indexOf('</form>')
);
```
</section>
Your `form` element's opening tag should only have an `action` attribute. Remove anything else you may have typed in it.
## Challenge Seed
<section id='challengeSeed'>
<div id='html-seed'>
```js
assert([...document.querySelector('form').attributes].length < 2);
```
You should create an input element. Check the syntax.
```js
assert(document.querySelector('input'));
```
Your `input` element should have an opening tag, but not a closing tag.
```js
assert(document.querySelector('input') && !code.match(/<\/input\>/g));
```
Your `input` element should be nested within the `form` element.
```js
assert(document.querySelector('form > input'));
```
Your `form` should only contain the `input` element. Remove any HTML elements or text between the `form` element's tags.
```js
assert(
$('form')[0].children.length === 1 &&
$('form')[0].innerText.trim().length === 0
);
```
# --seed--
## --seed-contents--
```html
<html>
@@ -81,15 +96,13 @@ tests:
</section>
<section>
<h2>Cat Form</h2>
--fcc-editable-region--
--fcc-editable-region--
<form action="https://freecatphotoapp.com/submit-cat-photo">
</form>
--fcc-editable-region--
--fcc-editable-region--
</section>
</main>
</body>
</html>
```
</div>
</section>