From d7d027afb7e4fb4e180d4dd1a43dbd77eb514939 Mon Sep 17 00:00:00 2001 From: yoko <25644062+sidemt@users.noreply.github.com> Date: Wed, 4 Jun 2025 05:28:35 +0900 Subject: [PATCH] fix(curriculum): make tests independent of previous tests (Customer Complaint Form) (#60348) Co-authored-by: Ilenia M --- .../67279fe50237291f80eed8b8.md | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) 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 }));