Web-stories-wp: Delete key sometimes does not delete elements

[wassgha]

Bug Description

Sometimes when elements are inserted/added, the user currently has to unselect them and re-select them for the delete to trigger

Expected Behaviour

Backspace key should delete the element whenever the element is in focus

Steps to Reproduce

Insert an element from the media library and attempt to delete it (doesn't work), unfocus/re-focus and try deleting again (works).

[swissspidy]

We currently use useKeyDownEffect() for delete inside useCanvasKeys. That means it only works when within the canvas.

Compare this to undo/redo, for which we use useGlobalKeyDownEffect, which would make it work every time.

So we could use useGlobalKeyDownEffect for delete as well.

[obetomuniz]

It works @swissspidy. Anyway, doing some side effects investigation on that useCanvasKeys hook, I noticed some problems on the rest of the keyboard controls configured there. So I am not sure if useGlobalKeyDownEffect would fix all these side effects since some are used in other parts of the plugin (e.g. esc, left, right). Is there some alternative path or concern about potential conflicts in this case? Also, should we consider these new cases on this issue?

FYI, these are the additional controls on the useCanvasKeys hook with the problem reported on this issue:

• Clear Selection handler - https://github.com/google/web-stories-wp/blob/master/assets/src/edit-story/components/canvas/useCanvasKeys.js#L73
• Positioning X/Y handler - https://github.com/google/web-stories-wp/blob/master/assets/src/edit-story/components/canvas/useCanvasKeys.js#L76
• Layer up/down handler - https://github.com/google/web-stories-wp/blob/master/assets/src/edit-story/components/canvas/useCanvasKeys.js#L94

I will be also checking if we can still use useKeyDownEffect fixing the origin of the problem.

[dvoytenko]

We could consider pushing it up the stack. I initially picked a narrower scope to start with. But if there's a reason to move it deeper, we definitely should.