fix(curriculum): .trim() to textContent for workshop-accessibility-quiz (freeCodeCamp#62615)

Co-authored-by: Ilenia <[email protected]>

Author: Giftea

curriculum/challenges/english/blocks/workshop-accessibility-quiz/613e2546d0594208229ada50.md

@@ -60,7 +60,7 @@ assert.equal(document.querySelector('img')?.alt, 'freeCodeCamp');
 You should give the `h1` element the text `HTML/CSS Quiz`.
 
 ```js
-assert.include(document.querySelector('h1')?.innerText?.toLowerCase(), 'html/css quiz');
+assert.include(document.querySelector('h1')?.innerText.toLowerCase(), 'html/css quiz');
 ```
 
 # --seed--

curriculum/challenges/english/blocks/workshop-accessibility-quiz/61408f155e798909b6908712.md

@@ -38,19 +38,19 @@ assert.equal(document.querySelectorAll('nav > ul > li > a')?.length, 3);
 You should give the first `a` element the text `INFO`.
 
 ```js
-assert.equal(document.querySelectorAll('nav > ul > li > a')?.[0]?.textContent, 'INFO');
+assert.equal(document.querySelectorAll('nav > ul > li > a')[0]?.textContent.trim(), 'INFO');
 ```
 
 You should give the second `a` element the text `HTML`.
 
 ```js
-assert.equal(document.querySelectorAll('nav > ul > li > a')?.[1]?.textContent, 'HTML');
+assert.equal(document.querySelectorAll('nav > ul > li > a')[1]?.textContent.trim(), 'HTML');
 ```
 
 You should give the third `a` element the text `CSS`.
 
 ```js
-assert.equal(document.querySelectorAll('nav > ul > li > a')?.[2]?.textContent, 'CSS');
+assert.equal(document.querySelectorAll('nav > ul > li > a')[2]?.textContent.trim(), 'CSS');
 ```
 
 # --seed--

curriculum/challenges/english/blocks/workshop-accessibility-quiz/614202874ca576084fca625f.md

@@ -76,19 +76,19 @@ assert.equal(document.querySelectorAll('h2')?.[2]?.id, 'css-questions');
 You should give the first `h2` element suitable text content. _Hint: I would have chosen `Student Info`_
 
 ```js
-assert.isAtLeast(document.querySelectorAll('h2')?.[0]?.textContent?.length, 1);
+assert.isNotEmpty(document.querySelectorAll('h2')[0]?.textContent.trim());
 ```
 
 You should give the second `h2` element suitable text content. _Hint: I would have chosen `HTML`_
 
 ```js
-assert.isAtLeast(document.querySelectorAll('h2')?.[1]?.textContent?.length, 1);
+assert.isNotEmpty(document.querySelectorAll('h2')[1]?.textContent.trim());
 ```
 
 You should give the third `h2` element suitable text content. _Hint: I would have chosen `CSS`_
 
 ```js
-assert.isAtLeast(document.querySelectorAll('h2')?.[2]?.textContent?.length, 1);
+assert.isNotEmpty(document.querySelectorAll('h2')[2]?.textContent.trim());
 ```
 
 # --seed--

curriculum/challenges/english/blocks/workshop-accessibility-quiz/6143639d5eddc7094161648c.md

@@ -36,19 +36,19 @@ assert.isAtLeast(document.querySelectorAll('label')?.[2]?.htmlFor?.length, 1);
 You should give the first `label` element an appropriate text content.
 
 ```js
-assert.isAtLeast(document.querySelectorAll('label')?.[0]?.textContent?.length, 1);
+assert.isNotEmpty(document.querySelectorAll('label')[0]?.textContent.trim());
 ```
 
 You should give the second `label` element an appropriate text content.
 
 ```js
-assert.isAtLeast(document.querySelectorAll('label')?.[1]?.textContent?.length, 1);
+assert.isNotEmpty(document.querySelectorAll('label')[1]?.textContent.trim());
 ```
 
 You should give the third `label` element an appropriate text content.
 
 ```js
-assert.isAtLeast(document.querySelectorAll('label')?.[2]?.textContent?.length, 1);
+assert.isNotEmpty(document.querySelectorAll('label')[2]?.textContent.trim());
 ```
 
 You should give the first `input` element an `id` attribute matching the `for` attribute of the first `label`.

curriculum/challenges/english/blocks/workshop-accessibility-quiz/6143931a113bb80c45546287.md

@@ -40,13 +40,13 @@ assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-bl
 You should give the first `h3` element text of `1`.
 
 ```js
-assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > h3')?.[0]?.textContent, '1');
+assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > h3')[0]?.textContent.trim(), '1');
 ```
 
 You should give the second `h3` element text of `2`.
 
 ```js
-assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > h3')?.[1]?.textContent, '2');
+assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > h3')[1]?.textContent.trim(), '2');
 ```
 
 You should nest one `fieldset` element within each `div.question-block` element.

curriculum/challenges/english/blocks/workshop-accessibility-quiz/614394fb41985e0d2012a93e.md

@@ -40,13 +40,13 @@ assert.equal(document.querySelectorAll('span')[1]?.className, 'sr-only');
 You should add the `span` element before the number 1 within the first `h3` element.
 
 ```js
-assert.equal(document.querySelector('span')?.nextSibling?.textContent, '1');
+assert.equal(document.querySelector('span')?.nextSibling?.textContent.trim(), '1');
 ```
 
 You should add the `span` element before the number 2 within the second `h3` element.
 
 ```js
-assert.equal(document.querySelectorAll('span')[1]?.nextSibling?.textContent, '2');
+assert.equal(document.querySelectorAll('span')[1]?.nextSibling?.textContent.trim(), '2');
 ```
 
 # --seed--

curriculum/challenges/english/blocks/workshop-accessibility-quiz/6143956ed76ed60e012faa51.md

@@ -16,13 +16,13 @@ In the second `span` element, add the text `Question`.
 You should give the first `span` element text of `Question`.
 
 ```js
-assert.equal(document.querySelector('h3 > span')?.textContent, 'Question');
+assert.equal(document.querySelector('h3 > span')?.textContent.trim(), 'Question');
 ```
 
 You should give the second `span` element text of `Question`.
 
 ```js
-assert.equal(document.querySelectorAll('h3 > span')?.[1]?.textContent, 'Question');
+assert.equal(document.querySelectorAll('h3 > span')[1]?.textContent.trim(), 'Question');
 ```
 
 # --seed--

curriculum/challenges/english/blocks/workshop-accessibility-quiz/6144e818fd5ea704fe56081d.md

@@ -40,19 +40,21 @@ assert.equal(document.querySelectorAll('fieldset > ul')?.[1]?.className, 'answer
 You should give the first `legend` element text content.
 
 ```js
-assert.notEmpty(document.querySelectorAll('legend')?.[0]?.textContent);
+assert.isNotEmpty(document.querySelectorAll('legend')[0]?.textContent.trim());
 ```
 
 You should give the second `legend` element text content.
 
 ```js
-assert.notEmpty(document.querySelectorAll('legend')?.[1]?.textContent);
+assert.isNotEmpty(document.querySelectorAll('legend')[1]?.textContent.trim());
 ```
 
 You should not use the same text content for both `legend` elements.
 
 ```js
-assert.notEqual(document.querySelectorAll('legend')?.[0]?.textContent, document.querySelectorAll('legend')?.[1]?.textContent);
+const legends = document.querySelectorAll('legend');
+assert.lengthOf(legends, 2);
+assert.notEqual(legends[0]?.textContent.trim(), legends[1]?.textContent.trim());
 ```
 
 # --seed--

curriculum/challenges/english/blocks/workshop-accessibility-quiz/6145f02240ff8f09f7ec913c.md

@@ -26,13 +26,13 @@ assert.exists(document.querySelectorAll('.formrow > .question-block')?.[1]?.quer
 You should give the first `label` element text content.
 
 ```js
-assert.isAtLeast(document.querySelectorAll('.formrow > .question-block')?.[0]?.querySelector('label')?.textContent?.length, 1);
+assert.isNotEmpty(document.querySelectorAll('.formrow > .question-block')[0]?.querySelector('label')?.textContent.trim());
 ```
 
 You should give the second `label` element text content.
 
 ```js
-assert.isAtLeast(document.querySelectorAll('.formrow > .question-block')?.[1]?.querySelector('label')?.textContent?.length, 1);
+assert.isNotEmpty(document.querySelectorAll('.formrow > .question-block')[1]?.querySelector('label')?.textContent.trim());
 ```
 
 # --seed--

curriculum/challenges/english/blocks/workshop-accessibility-quiz/6145f14f019a4b0adb94b051.md

@@ -34,7 +34,7 @@ assert.equal(document.querySelector('div.answer > select > option:nth-child(1)')
 You should give the first `option` element a text content of `Select an option`.
 
 ```js
-assert.equal(document.querySelector('div.answer > select > option:nth-child(1)')?.textContent, 'Select an option');
+assert.equal(document.querySelector('div.answer > select > option:nth-child(1)')?.textContent.trim(), 'Select an option');
 ```
 
 You should give the second `option` element a `value` of `yes`.
@@ -46,7 +46,7 @@ assert.equal(document.querySelector('div.answer > select > option:nth-child(2)')
 You should give the second `option` element a text content of `Yes`.
 
 ```js
-assert.equal(document.querySelector('div.answer > select > option:nth-child(2)')?.textContent, 'Yes');
+assert.equal(document.querySelector('div.answer > select > option:nth-child(2)')?.textContent.trim(), 'Yes');
 ```
 
 You should give the third `option` element a `value` of `no`.
@@ -58,7 +58,7 @@ assert.equal(document.querySelector('div.answer > select > option:nth-child(3)')
 You should give the third `option` element a text content of `No`.
 
 ```js
-assert.equal(document.querySelector('div.answer > select > option:nth-child(3)')?.textContent, 'No');
+assert.equal(document.querySelector('div.answer > select > option:nth-child(3)')?.textContent.trim(), 'No');
 ```
 
 You should give the `select` an attribute of `required`.