angular/components · error

Invalid seconds "${seconds}". Seconds value must be between

Error message

Invalid seconds "${seconds}". Seconds value must be between 0 and 59.

What it means

DateFnsAdapter.setTime validates the seconds argument (must be 0–59) and throws in dev mode when out of range, rejecting values that would silently overflow into the next minute.

Source

Thrown at src/material-date-fns-adapter/adapter/date-fns-adapter.ts:231

    return isValid(date);
  }

  invalid(): Date {
    return new Date(NaN);
  }

  override setTime(target: Date, hours: number, minutes: number, seconds: number): Date {
    if (typeof ngDevMode === 'undefined' || ngDevMode) {
      if (hours < 0 || hours > 23) {
        throw Error(`Invalid hours "${hours}". Hours value must be between 0 and 23.`);
      }

      if (minutes < 0 || minutes > 59) {
        throw Error(`Invalid minutes "${minutes}". Minutes value must be between 0 and 59.`);
      }

      if (seconds < 0 || seconds > 59) {
        throw Error(`Invalid seconds "${seconds}". Seconds value must be between 0 and 59.`);
      }
    }

    return set(this.clone(target), {hours, minutes, seconds, milliseconds: 0});
  }

  override getHours(date: Date): number {
    return getHours(date);
  }

  override getMinutes(date: Date): number {
    return getMinutes(date);
  }

  override getSeconds(date: Date): number {
    return getSeconds(date);
  }

View on GitHub (pinned to 0411926e7d)

Solutions

  1. Use addCalendarSeconds (or date-fns set with arithmetic) for values that may exceed 59.
  2. Validate inputs to 0–59 before calling setTime.
  3. Convert durations via explicit normalization (carry into minutes) before applying.

Example fix

// before
this.adapter.setTime(target, 10, 30, 60); // throws
// after
this.adapter.setTime(this.adapter.addCalendarSeconds(target, 60), 0, 0, 0); // or 10:31:00 via wrap
Defensive patterns

Strategy: validation

Validate before calling

if (!Number.isInteger(seconds) || seconds < 0 || seconds > 59) {
  throw new RangeError(`seconds must be 0-59, got ${seconds}`);
}
const d = adapter.setTime(target, hours, minutes, seconds);

Type guard

function isValidSecond(s: unknown): s is number {
  return typeof s === 'number' && Number.isInteger(s) && s >= 0 && s <= 59;
}

Try / catch

try {
  return this.adapter.setTime(t, h, m, s);
} catch (e) {
  if ((e as Error).message.startsWith('Invalid seconds')) {
    return this.adapter.setTime(t, h, m, Math.min(Math.max(s, 0), 59));
  }
  throw e;
}

Prevention

When it happens

Trigger: Calling setTime(target, hours, minutes, seconds) with seconds < 0 or seconds > 59 — e.g. countdown arithmetic producing second = 60, or raw timestamp components (epoch seconds) fed as clock seconds.

Common situations: Stopwatch/countdown logic decrementing seconds to -1 or summing past 59; extracting seconds from durations instead of actual clock times; parsing 'mm:ss' strings without bounds checks.

Related errors


AI-assisted analysis of angular/components@0411926e7d (2026-08-31). Data as JSON: /api/errors/50a239f27c43e916. Report an issue: GitHub.