opensource/freeCodeCamp
3
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-09-24 23:01:18 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(curriculum): building a nutrition label step 53 tests (#49552)

Browse Source 
Co-authored-by: Muhammed Mustafa <muhammed@freecodecamp.org>
This commit is contained in:
Bruce Blaser
2023-03-21 13:58:49 +05:30
committed by GitHub
co-authored by Muhammed Mustafa
parent 4617011edb
commit 55216af8bd
1 changed files with 23 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
curriculum/challenges/english/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f7de4487b64919bb4aa5e.md
+23 -12
View File
@@ -20,43 +20,54 @@ assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.loca
Your new `p` element should have the text `Cholesterol 0mg 0%`.
```js
assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.innerText?.match(/Cholesterol[\s|\n]+0mg[\s|\n]+0%/));
const text = document.querySelector('.daily-value.small-text')?.lastElementChild?.textContent?.trim()?.replace(/\n/g, ' ')?.replace(/\s\s+/g, ' ');
assert(text === 'Cholesterol 0mg 0%');
```
Your new `p` element should have three `span` elements.
Your new `p` element should have exactly three `span` elements.
```js
assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.querySelectorAll('span')?.length === 3);
```
Your first `span` `Cholesterol` element should have the `class` attribute set to `bold`.
The text `Cholesterol` should be nested in a `span`.
```js
assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.firstElementChild?.firstElementChild?.classList?.contains('bold'));
const spans = [...document.querySelector('.daily-value.small-text')?.lastElementChild?.querySelectorAll('span')];
const cholesterolSpan = spans.filter(span => span?.innerHTML?.match(/^[\s\n]*Cholesterol[\s\n]*$/));
assert(cholesterolSpan.length === 1);
```
Your first `span` element should wrap the text `Cholesterol 0mg`.
Your `Cholesterol` `span` should have the `class` attribute set to `bold`.
```js
assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.firstElementChild?.innerText?.match(/Cholesterol[\s|\n]+0mg/));
const spans = [...document.querySelector('.daily-value.small-text')?.lastElementChild?.querySelectorAll('span')];
const cholesterolSpan = spans.filter(span => span?.innerHTML?.match(/^[\s\n]*Cholesterol[\s\n]*$/));
assert(cholesterolSpan[0]?.classList?.contains('bold'));
```
Your first `span` element should wrap the text `Cholesterol`.
The text `0%` should be nested in a `span`.
```js
assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.firstElementChild?.firstElementChild?.innerText === 'Cholesterol');
const spans = [...document.querySelector('.daily-value.small-text')?.lastElementChild?.querySelectorAll('span')];
const zeroPercentSpan = spans.filter(span => span?.innerHTML?.match(/^[\s\n]*0%[\s\n]*$/));
assert(zeroPercentSpan.length === 1);
```
Your second `span` element should have the `class` attribute set to `bold`.
Your `0%` `span` should have the `class` attribute set to `bold`.
```js
assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.lastElementChild?.classList?.contains('bold'));
const spans = [...document.querySelector('.daily-value.small-text')?.lastElementChild?.querySelectorAll('span')];
const zeroPercentSpan = spans.filter(span => span?.innerHTML?.match(/^[\s\n]*0%[\s\n]*$/));
assert(zeroPercentSpan[0]?.classList?.contains('bold'));
```
Your second `span` element should wrap the text `0%`.
Your `Cholesterol` `span` and your `0mg` text should be wrapped in a `span`.
```js
assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.lastElementChild?.innerText === '0%');
const spans = [...document.querySelector('.daily-value.small-text')?.lastElementChild?.querySelectorAll('span')];
const cholesterolZeroSpan = spans.filter(span => span?.innerText === 'Cholesterol 0mg');
assert(cholesterolZeroSpan.length === 1);
```
# --seed--