<div>Invalid JSX:
<p>Paragraph One</p>
<p>Paragraph Two</p>
<p>Paragraph Three</p>
</div>
<p>Paragraph One</p>
<p>Paragraph Two</p>
<p>Paragraph Three</p>
JSX
that renders a div
which contains the following elements in order:
An h1
, a p
, and an unordered list that contains three li
items. You can include any text you want within each element.
Note: When rendering multiple elements like this, you can wrap them all in parentheses, but it's not strictly required. Also notice this challenge uses a div
tag to wrap all the child elements within a single parent element. If you remove the div
, the JSX will no longer transpile. Keep this in mind, since it will also apply when you return JSX elements in React components.
JSX
should return a div
element.
testString: assert(JSX.type === 'div', 'The constant JSX
should return a div
element.');
- text: The div
should contain a p
tag as the second element.
testString: assert(JSX.props.children[1].type === 'p', 'The div
should contain a p
tag as the second element.');
- text: The div
should contain a ul
tag as the third element.
testString: assert(JSX.props.children[2].type === 'ul', 'The div
should contain a ul
tag as the third element.');
- text: The div
should contain an h1
tag as the first element.
testString: assert(JSX.props.children[0].type === 'h1', 'The div
should contain an h1
tag as the first element.');
- text: The ul
should contain three li
elements.
testString: assert(JSX.props.children[2].props.children.length === 3, 'The ul
should contain three li
elements.');
```
Some info