Region click is overriden by interaction if it's enabled

[iboshkov]

Wavesurfer.js version(s):

3.3.3

Browser and operating system version(s):

Chrome 81 on Windows 10 / Chrome on Android

Code needed to reproduce the issue:

Full reproduction here:

https://stackblitz.com/edit/js-paffsu?file=index.html

User behaviour needed to reproduce the issue:

1. Play the reproduction above
2. Click on the region during playback
3. The region will not be played but the playback will seek to where was clicked

The fix is that we now call e.stopPropagation() in the click handler for the region to enable the region click to override the default interaction.

[sundayz]

This change makes it impossible to move the seeker around inside the region when playback is paused. is that what is supposed to happen?

In my use case I need to let people click around the region and there doesn't seem to be a way of controlling that behaviour

[thijstriemstra]

In my use case I need to let people click around the region and there doesn't seem to be a way of controlling that behaviour

Pull request is welcome!

[iboshkov]

@sundayz @thijstriemstra If we do another PR on this we should probably look into making it configurable to support either need because both are valid. Maybe provide a way to stop propagation/mark the event as handled in the on subscription and respect that in the later logic?

[sundayz]

Wouldn't calling e.preventDefault inside the 'region-click' listener work? If not then maybe add a parameter for regions like allowClickThrough, and only call e.preventDefault() if allowClickThrough is false

It wouldn't be a big deal if you could easily call seekTo() when listening to the region-click event, but you have to manually calculate that youreslf with the clientX clientY properties of the click event.

Maybe add progress to fireEvent('region-click') that tells you where on the timeline you clicked?