一定時間経過後、音楽を再生したい

前提・実現したいこと

・タイマーを作る
・inputに時間を入力してstartをクリック、カウントダウン開始
・カウントダウンが終わると、音楽が流れ終了を知らせる通知が出現

発生している問題・エラーメッセージ

・指定した時間が15秒以下だと音楽が再生されるが、16秒以上だと音楽が再生されない。
（なお、16秒以上の場合でも通知は出現する）

・consoleには何のエラーメッセージも表示されず。VScodeを確認するも問題の指摘はされない。

該当のソースコード

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4  <meta charset="UTF-8">
5  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6  <link rel="stylesheet" href="styles.css">
7  <title>Timer</title>
8</head>
9
10<body>
11  <div id="timer">00:00</div>
12  <div id="setting">
13    <input type="number" min="0" name="minute" id="minute">分
14    <input type="number" min="0" name="second" id="second">秒
15  </div>
16  <div id="btn">
17    <button id="start">start</button>
18    <button id="cancel">cancel</button>
19  </div>
20
21  <script src="main.js"></script>
22</body>
23
24</html>

css
1#timer, #setting, #btn{
2  text-align: center;
3}
4
5#timer{
6  font-size: 60px;
7  font-weight: bold;
8  margin: 20px 0;
9}
10

javascript
1'use strict';
2
3{
4  const timer = document.getElementById('timer');
5  const start = document.getElementById('start');
6  const cancel = document.getElementById('cancel');
7  
8  
9  //startボタンを押した時
10  start.addEventListener('click', function(){
11    let minute = Number(document.getElementById('minute').value);
12    let second = Number(document.getElementById('second').value);
13    
14    //60秒超の秒数なら分追加
15    if(second > 60){
16      const addMinute = Math.floor(second / 60);
17      minute += addMinute;
18      second = second % 60;
19    }
20    
21    function showTimer(){
22      minute = minute.toString(10);
23      second = second.toString(10);
24      if(minute.length === 1){
25        if(minute < 10){
26          minute = 0 + minute;
27        }
28      }
29      if(second.length === 1){ 
30        if(second < 10){
31            second = 0 + second;
32        }
33      }
34      timer.textContent = `${minute} ： ${second}`;
35
36      //再度数値化。countDownを繰り返す際、数値として計算するため
37      minute = Number(minute);
38      second = Number(second);
39    }
40    //初期表示
41    showTimer();
42
43    let timeUp = new Audio();
44    timeUp.src = 'music.mp3';
45
46    //1秒毎にカウントダウン
47    //1秒毎にTimerの表示を1秒減らす。
48    //時間が0になればアラーム音が鳴る。
49    function countDown(){
50      if(minute === 0 && second === 0){
51        return;
52      }else if(minute === 0 && second === 1){
53        second -= 1;
54        showTimer();
55        console.log(minute)
56        timeUp.play()
57        if(window.confirm('Time Up!!!')){
58          timeUp.pause()
59        }
60        clearInterval(countStart)
61      }else if(minute >= 1 && second === 0){
62        second = 59;
63        minute -= 1;
64        showTimer();
65        console.log(minute)
66      }else{
67        second -= 1;
68        showTimer()
69      }
70    } 
71
72    let countStart = setInterval(countDown, 1000);
73    
74    //cancelボタンをクリックでタイマー停止。ダブルクリックでリセット。
75    cancel.addEventListener('click', function(){
76      clearInterval(countStart);
77    })
78    
79    cancel.addEventListener('dblclick', function(){
80      minute = 0;
81      second = 0;
82      showTimer();
83    })
84    
85  })
86  
87
88}

試したこと

・様々な時間を設定して、16秒が境目となっていることを確認。
・コードの見直し
・play（）メソッドの使い方について、いくつかのサイトを確認。

###補足
・ブラウザ:Google Chrome
・エディタ:VScode

行動規範の内容に同意します

回答1件

試してみました。
Chromeだと問題が再現し、Firefoxだと発生しませんでした。
意味不明なのでChromeのバグと思いたいです。

回避方法：window.confirm()の部分を別関数に入れてSetTimeoutで呼び出すと発生しませんでした。

javascript
1function stop(){
2  if(window.confirm('Time Up!!!')){
3    timeUp.pause()
4  }
5}
6function countDown(){
7  (略)
8  timeUp.play()
9  setTimeout(stop, 0)
10  // if(window.confirm('Time Up!!!')){
11  //   timeUp.pause()
12  // }
13  (略)
14}