Everything works on the computer! Why does jQuery return NaN instead of timer digits on mobile?

Question

css

- This is on the computer (Everything works! As it should be!)

- This is on the phone (Returns NaN for some reason)

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<p class="sel">
  <select class="select-css" id="eventDays">
  </select>
</p>
<p class="timer"><span id="timeout"></span></p>

const days = [{
    id: 1,
    title: 'Лето',
    day: 1,
    month: 6
  }, {
    id: 2,
    title: '1 сентября',
    day: 1,
    month: 8
  }, {
    id: 3,
    title: 'Новый год',
    day: 1,
    month: 1
  }, {
    id: 4,
    title: '8 марта',
    day: 8,
    month: 3
  }, {
    id: 5,
    title: '23 февраля',
    day: 23,
    month: 2
  }];

class EventDaysController {
  eventDays = days;
  intervalEvent = null;
  currentTimeout = null;

  onSelectOptionCalback = () => {};

  onSelectOption(option) {
    this.onSelectOptionCalback(option);
    const event = this.eventDays.find(f => f.id === +option);
    const eventDate = new Date(`${new Date().getFullYear()}-${event.month}-${event.day}`)
    if (eventDate - new Date() < 0) {
      eventDate.setFullYear(new Date().getFullYear() + 1)
    }
    const timestamp = eventDate - new Date();
    this.renderTimeout(timestamp, 'timeout')
  }

  secondsToTime(seconds) {
    const milisecond = seconds % 1000;
    seconds = (seconds - milisecond) / 1000;
    const second = seconds % 60;
    seconds = (seconds - second) / 60;
    const minute = seconds % 60;
    seconds = (seconds - minute) / 60;
    const hour = seconds % 24;
    seconds = (seconds - hour) / 24;
    const day = seconds
    return `
          ${this.declensionNum(day, ['день', 'дня', 'дней'])}
          ${this.declensionNum(hour, ['час', 'часа', 'часов'])}
          ${this.declensionNum(minute, ['минута', 'минуты', 'минут'])}
          ${this.declensionNum(second, ['секунда', 'секунды', 'секунд'])}`
  }

  declensionNum(num, words) {
    return `${num} ${words[(num % 100 > 4 && num % 100 < 20) ? 2 : [2, 0, 1, 1, 1, 2][(num % 10 < 5) ? num % 10 : 5]]}`;
  }

  renderTimeout(timestamp, id) {
    clearInterval(this.intervalEvent);
    this.currentTimeout = timestamp;
    const span = document.getElementById(id);
    this.intervalEvent = setInterval(() => {
      span.innerHTML = this.secondsToTime(this.currentTimeout);
      this.currentTimeout -= 1000;
    }, 1000)
  }

  renderList(selectId) {
    const selectDOM = document.getElementById(selectId);
    this.eventDays.forEach(f => {
      let option = document.createElement('option');
      option.value = f.id;
      option.innerHTML = f.title;
      selectDOM.append(option);
    })
    selectDOM.addEventListener('change', (e) => {
      this.onSelectOption(e.target.value)
    });
    this.onSelectOption(this.eventDays[0].id)
  }


}

document.addEventListener('DOMContentLoaded', function() {
  const edc = new EventDaysController();
  edc.onSelectOptionCalback = (option) => {}
  edc.renderList('eventDays');

});

Answer 1

It's not about the "computer" and "phone", but about browsers.
In particular, in their support for modern JS syntax.