simonjvardy / alarm-clock

Alarm Clock app using HTML5, CSS3 and JavaScript. Code Institute Milestone 2 Project.
https://simonjvardy.github.io/alarm-clock/
6 stars 8 forks source link

Unit Test: No audio when testing the alarm sound on iPad #36

Open simonjvardy opened 3 years ago

simonjvardy commented 3 years ago

Describe the bug The audio .mp3 file failed to play when the alarm was triggered on an iPad

To Reproduce Steps to reproduce the behavior:

  1. Go to simonjvardy.github.io/world-clock/index.html
  2. Click on 'Alarm Clock'
  3. Set the alarm Hrs & mins selections to a time in the future
  4. CLick on 'Set Alarm' button
  5. Wait for the alarm to trigger
  6. when the current time == the alarm time set no audio is heard

Expected behavior The alarm .mp3 file should play when the alarm is triggered

Screenshots

Smartphone (please complete the following information):

Additional context iOS WebKit requires user interaction to load or play media

simonjvardy commented 3 years ago

tried refactoring the HTML5 <audio> tag from:

        <audio id="alarmSound">
            <!-- No Browser support for Edge / IE -->
            <source src="assets/audio/07070161.wav" type="audio/mpeg">
            <!-- Edge / IE, Chrome, Firefox, Safari & Opera Browser support -->
            <source src="assets/audio/07070161.mp3" type="audio/mpeg">
            Your browser does not support the audio element.
        </audio>

to:

        <audio id="alarmSound" src="assets/audio/07070161.mp3"></audio>

without any success.

simonjvardy commented 3 years ago

https://bugs.webkit.org/show_bug.cgi?id=132691 describes the proble further