Fix audio player seek bar position (#31127)

* fix(audio): stop clock when the source audio reaches the end

* test(audio): add test for playback when audio source ended

Author: florianduros

src/audio/Playback.ts

@@ -202,6 +202,7 @@ export class Playback extends EventEmitter implements IDestroyable, PlaybackInte
     private onPlaybackEnd = async (): Promise<void> => {
         await this.context.suspend();
         this.emit(PlaybackState.Stopped);
+        this.clock.flagStop();
     };
 
     public async play(): Promise<void> {
@@ -248,9 +249,8 @@ export class Playback extends EventEmitter implements IDestroyable, PlaybackInte
         this.emit(PlaybackState.Paused);
     }
 
-    public async stop(): Promise<void> {
-        await this.onPlaybackEnd();
-        this.clock.flagStop();
+    public stop(): Promise<void> {
+        return this.onPlaybackEnd();
     }
 
     public async toggle(): Promise<void> {

test/unit-tests/audio/Playback-test.ts

@@ -46,6 +46,7 @@ describe("Playback", () => {
 
     beforeEach(() => {
         jest.spyOn(logger, "error").mockRestore();
+        mockAudioBufferSourceNode.addEventListener.mockClear();
         mockAudioBuffer.getChannelData.mockClear().mockReturnValue(mockChannelData);
         mockAudioContext.decodeAudioData.mockReset().mockResolvedValue(mockAudioBuffer);
         mockAudioContext.resume.mockClear().mockResolvedValue(undefined);
@@ -105,6 +106,26 @@ describe("Playback", () => {
         expect(playback.currentState).toEqual(PlaybackState.Stopped);
     });
 
+    it("stop when audio source ended", async () => {
+        const buffer = new ArrayBuffer(8);
+        const playback = new Playback(buffer);
+        await playback.prepare();
+        await playback.play();
+
+        // Simulate the audio source ending by calling the 'ended' event listener
+        const endedListener = mockAudioBufferSourceNode.addEventListener.mock.calls.find(
+            (call) => call[0] === "ended",
+        )[1];
+        await endedListener();
+
+        // AudioContext should be suspended
+        expect(mockAudioContext.suspend).toHaveBeenCalled();
+        // Playback state should be Stopped
+        expect(playback.currentState).toEqual(PlaybackState.Stopped);
+        // Clock should be reset to 0
+        expect(playback.timeSeconds).toEqual(0);
+    });
+
     describe("prepare()", () => {
         it("decodes audio data when not greater than 5mb", async () => {
             const buffer = new ArrayBuffer(8);