Validate the Search Input

Task

Prevent empty submissions before they reach fetchWeather().

Open

Use the form listener below and replace any earlier version with it.

Implementation

form.addEventListener("submit", async (event) => {
  event.preventDefault();

  const city = input.value.trim();
  if (!city) return showError("Enter a city name.");

  await fetchWeather(city);
});

Validation belongs at the event boundary because it is the earliest point where the application knows whether the requested city value is meaningful.

Test

Clear the input and click Search. Confirm the error appears without a network request. Then enter a valid city and confirm the error is cleared when the request starts.

Expected result

Empty searches are rejected before network work begins.

Checkpoint

Before moving on, confirm the expected result in the running app and make sure the browser console has no blocking errors.