[Bug]: Audio recorder play/pause and delete buttons do not get disabled after recording and playing back on disabling

[btsgh]

Is there an existing issue for this?

• [X] I have searched the existing issues

Description

When I attach a JS script to the "Disabled" property to the effect - {{Checkbox1.isChecked}}, On deploy, after starting and stopping recording, if we uncheck the checkbox to disable the audio recorder widget, the play/pause and delete buttons are still enabled.

On disabling the widget, the buttons should also get disabled.

Steps To Reproduce

1. Add an audio recorder widget to the canvas. Add also a checkbox widget.
2. For the Disable property, JS toggle and add {{Checkbox1.isChecked}} as the binding.
3. Now deploy the app.
4. Start recording on the deploy screen. After a few seconds, click on the checkbox to disable the audio recorder widget
5. We can see that the recording is continuing to be in progress
6. We can also click pause to pause the recording, play again to play it, and delete, to delete the recording.

On disabling, recording should stop and also user should not be able to use the play/pause or delete buttons. Those also should get disabled

Public Sample App

No response

Version

Production

[btsgh]

Another scenario where this is observed is on the Canvas itself -

1. Add an audio recorder widget to the canvas. Add a checkbox widget and set Default Selected toggle off.
2. For the Disable property, JS toggle and add {{Checkbox1.isChecked}} as the binding.
3. Now start recording on the audio recorder.
4. After a couple of seconds, use the Disable checkbox to disable the audio recorder widget
5. We can see that recording continues, the timer continues to increase. We can click on Stop to stop recording, and play to playback the recording, and also click on discard to discard the recording.

Expected behavior - On Disabling, the recording should stop, and none of the buttons (stop/play/discard) should be clickable.