From 23f962ea7f21417dbd6a5ef071d14acb316fcdf0 Mon Sep 17 00:00:00 2001
From: Huyen Nguyen <25715018+huyenltnguyen@users.noreply.github.com>
Date: Wed, 3 Jan 2024 02:51:51 +0700
Subject: [PATCH] fix(curriculum): allow line breaks in option content in
 Calorie Counter step 10 (#52807)

---
 .../63b60af1a0b9f7238a9dd294.md                    | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63b60af1a0b9f7238a9dd294.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63b60af1a0b9f7238a9dd294.md
index f48b8eed6d0..f35f83c9136 100644
--- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63b60af1a0b9f7238a9dd294.md
+++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63b60af1a0b9f7238a9dd294.md
@@ -22,7 +22,7 @@ assert.equal(document.querySelectorAll('.controls select option')?.length, 5);
 Your first `option` should have the text `Breakfast`.
 
 ```js
-assert.equal(document.querySelectorAll('.controls select option')?.[0]?.textContent, 'Breakfast');
+assert.equal(document.querySelectorAll('.controls select option')?.[0]?.textContent?.trim(), 'Breakfast');
 ```
 
 Your first `option` should have the `value` attribute set to `breakfast`.
@@ -34,7 +34,7 @@ assert.equal(document.querySelectorAll('.controls select option')?.[0]?.value, '
 Your second `option` should have the text `Lunch`.
 
 ```js
-assert.equal(document.querySelectorAll('.controls select option')?.[1]?.textContent, 'Lunch');
+assert.equal(document.querySelectorAll('.controls select option')?.[1]?.textContent?.trim(), 'Lunch');
 ```
 
 Your second `option` should have the `value` attribute set to `lunch`.
@@ -46,7 +46,7 @@ assert.equal(document.querySelectorAll('.controls select option')?.[1]?.value, '
 Your third `option` should have the text `Dinner`.
 
 ```js
-assert.equal(document.querySelectorAll('.controls select option')?.[2]?.textContent, 'Dinner');
+assert.equal(document.querySelectorAll('.controls select option')?.[2]?.textContent?.trim(), 'Dinner');
 ```
 
 Your third `option` should have the `value` attribute set to `dinner`.
@@ -58,7 +58,7 @@ assert.equal(document.querySelectorAll('.controls select option')?.[2]?.value, '
 Your fourth `option` should have the text `Snacks`.
 
 ```js
-assert.equal(document.querySelectorAll('.controls select option')?.[3]?.textContent, 'Snacks');
+assert.equal(document.querySelectorAll('.controls select option')?.[3]?.textContent?.trim(), 'Snacks');
 ```
 
 Your fourth `option` should have the `value` attribute set to `snacks`.
@@ -70,7 +70,7 @@ assert.equal(document.querySelectorAll('.controls select option')?.[3]?.value, '
 Your fifth `option` should have the text `Exercise`.
 
 ```js
-assert.equal(document.querySelectorAll('.controls select option')?.[4]?.textContent, 'Exercise');
+assert.equal(document.querySelectorAll('.controls select option')?.[4]?.textContent?.trim(), 'Exercise');
 ```
 
 Your fifth `option` should have the `value` attribute set to `exercise`.
@@ -82,7 +82,9 @@ assert.equal(document.querySelectorAll('.controls select option')?.[4]?.value, '
 Your first `option` should be selected by default.
 
 ```js
-assert.isTrue(document.querySelectorAll('.controls select option')?.[0]?.getAttributeNames()?.includes('selected'));
+const isFirstOptionSelected = document.querySelectorAll('.controls select option')?.[0]?.getAttributeNames()?.includes('selected');
+const selectedOptions = document.querySelectorAll('.controls select option[selected]');
+assert.isTrue(isFirstOptionSelected && selectedOptions.length === 1);
 ```
 
 # --seed--