Conditions & Loops

Conditions & Loops: for Loop — Counter i Increments Step by Step Conditionals and loops are the traffic lights and junction routing systems of automation code: `if/else` decides

for Loop — Counter i Increments Step by Step

Conditionals and loops are the traffic lights and junction routing systems of automation code: `if/else` decides which road to take at an intersection, loops (`for`, `while`, `for...of`) let you travel the same road multiple times. Why does JavaScript have multiple loop types — `for`, `for...of`, `for...in`, `forEach()`? Each is optimized for a different scenario: classic `for` when you need index control, `for...of` for processing iterable values in sequence, `for...in` for iterating object keys, `forEach()` for side effects. Java equivalents: classic `for`, enhanced `for-each`, `Iterator`. Common QA scenario: using `for...of` to scan all table rows on a page: `for (const row of await page.locator('tr').all()) { ... }` — you run an assertion for each row.

if / else if / else & Ternary Operator

Conditional Structures

// ─── if / else if / else ───────────────────────────────────── let score = 75; if (score >= 90) { console.log("✅ Advanced"); } else if (score >= 60) { console.log("⚠️ Intermediate"); // this branch runs } else { console.log("❌ Failed"); } // ─── Ternary Operator ───────────────────────────────────────── // Short if/else — identical syntax to Java let status = score >= 60 ? "passed" : "failed"; console.log("Test Status:", status); // "passed" // ─── switch / case ──────────────────────────────────────────── let browser = "chromium"; switch (browser) { case "chromium": console.log("Loading Chrome Driver..."); break; // without break, falls through to next case! case "firefox": console.log("Loading Firefox Driver..."); break; case "webkit": console.log("Loading Safari Driver..."); break; default: console.log("Unknown browser!"); }

Micro Lab: JavaScript QA coding practice

Replace the TODO line with the critical line from the expected solution. This is not a real runtime; the goal is to reinforce writing the correct structure in a controlled way.

All Loop Types — Side-by-Side

for...of and for...in — Automation Usage

const testResults = [ { id: 1, name: "Login Test", status: "passed" }, { id: 2, name: "Payment Test", status: "failed" }, { id: 3, name: "Signup Test", status: "passed" } ]; // for...of — iterate over array values (like Java's enhanced for) for (const test of testResults) { const icon = test.status === "passed" ? "✅" : "❌"; console.log(`${icon} ${test.name}`); } // for...in — iterate over object keys const apiResponse = { statusCode: 200, message: "OK", data: [] }; for (const key in apiResponse) { console.log(`${key}: ${apiResponse[key]}`); } // while — Polling (simulate waiting until element appears) let retryCount = 0; while (retryCount < 3) { console.log(`Attempt ${retryCount + 1}: Searching for element...`); retryCount++; }

Step by Step: JavaScript QA coding practice

Read the goal and async dependencies

Place await / Promise chain in the right spot

Complete the assertion or expectation line