diff --git a/curriculum/challenges/english/25-front-end-development/lab-customer-complaint-form/67279fe50237291f80eed8b8.md b/curriculum/challenges/english/25-front-end-development/lab-customer-complaint-form/67279fe50237291f80eed8b8.md index e3eee3a333a..f3bad1f824c 100644 --- a/curriculum/challenges/english/25-front-end-development/lab-customer-complaint-form/67279fe50237291f80eed8b8.md +++ b/curriculum/challenges/english/25-front-end-development/lab-customer-complaint-form/67279fe50237291f80eed8b8.md @@ -214,9 +214,10 @@ document.getElementById("complaint-description").value = "Less than 20 chars"; assert.isFalse(validateForm()["complaint-description"]); ``` -Once the value of `#complaint-description` is changed to a valid value, you should set its border color to `green`. +When `#other-complaint` is checked and the value of `#complaint-description` is changed to a valid value, you should set its border color to `green`. ```js +document.getElementById("other-complaint").checked = true; const field = document.getElementById("complaint-description"); field.value = "A sentence with at least twenty characters" field.dispatchEvent(new Event("input", { bubbles: true })); @@ -224,9 +225,10 @@ field.dispatchEvent(new Event("change", { bubbles: true })); assert.equal(field.style.borderColor, "green"); ``` -Once the value of `#complaint-description` is changed to an invalid value, you should set its border color to `red`. +When `#other-complaint` is checked and the value of `#complaint-description` is changed to an invalid value, you should set its border color to `red`. ```js +document.getElementById("other-complaint").checked = true; const field = document.getElementById("complaint-description"); field.value = "Not enough chars" field.dispatchEvent(new Event("input", { bubbles: true })); @@ -290,9 +292,10 @@ document.getElementById("solution-description").value = "Less than 20 chars"; assert.isFalse(validateForm()["solution-description"]); ``` -Once the value of `#solution-description` is changed to a valid value, you should set its border color to `green`. +When `#other-solution` is checked and the value of `#solution-description` is changed to a valid value, you should set its border color to `green`. ```js +document.getElementById("other-solution").checked = true; const field = document.getElementById("solution-description"); field.value = "A sentence with at least twenty characters" field.dispatchEvent(new Event("input", { bubbles: true })); @@ -300,9 +303,10 @@ field.dispatchEvent(new Event("change", { bubbles: true })); assert.equal(field.style.borderColor, "green"); ``` -Once the value of `#solution-description` is changed to an invalid value, you should set its border color to `red`. +When `#other-solution` is checked and the value of `#solution-description` is changed to an invalid value, you should set its border color to `red`. ```js +document.getElementById("other-solution").checked = true; const field = document.getElementById("solution-description"); field.value = "Not enough chars" field.dispatchEvent(new Event("input", { bubbles: true }));