Make showing / hiding cancellable via event listeners

Use case: I want to display a form in the dialog. When the user accidentally clicks outside the dialog or on the close button, the dialog closes without warning. I could check in the hide event listener if the user has already entered some data and confirm if they really want to close.

It would be great if I then could just return false in the event listener to cancel the action. Maybe a beforeHide event would also be valuable.

The same can also be applied to the show event, though I guess it won’t be too helpful.

[KittyGiraudel]

You can store the reference to the current function for sure, yes.

const keypressHandler = A11yDialog.prototype._bindKeypress;

A11yDialog.prototype._bindKeypress = function (event) {
  // Capture escape key.
  keypressHandler(event);
}

[KittyGiraudel]

Unfortunately you will not be able to override it while keeping its functionality. What you can do is copy it and tweak it the way you want. Here is the current version: https://github.com/edenspiekermann/a11y-dialog/blob/master/a11y-dialog.js#L253-L266.

A11yDialog.prototype._bindKeypress = function (event) {
  // …
}

Does it make sense?