fix: stop comment typing from triggering page shortcuts
Adds a keydown handler on the comment input that stops propagation Keeps Enter-to-submit behavior working in the annotation overlay Cleans up the new event listener when the overlay is removed
This commit is contained in:
@@ -61,6 +61,12 @@ describe('annotation overlay script', () => {
|
||||
expect(script).toContain(JSON.stringify(labels.commentPlaceholder));
|
||||
});
|
||||
|
||||
test('keeps comment keystrokes away from shortcuts on the annotated page', () => {
|
||||
expect(script).toContain("comment.addEventListener('keydown', onCommentKeyDown)");
|
||||
expect(script).toContain('var onCommentKeyDown = function (event) {');
|
||||
expect(script).toContain('event.stopPropagation();');
|
||||
});
|
||||
|
||||
test('escapes a label that would otherwise close the script', () => {
|
||||
const hostile = buildAnnotationOverlayScript(theme, {
|
||||
...labels,
|
||||
|
||||
@@ -534,9 +534,13 @@ export const buildAnnotationOverlayScript = (
|
||||
event.preventDefault();
|
||||
event.stopImmediatePropagation();
|
||||
finish(null);
|
||||
return;
|
||||
}
|
||||
if (event.key === 'Enter' && !event.shiftKey && event.target === comment) {
|
||||
};
|
||||
|
||||
var onCommentKeyDown = function (event) {
|
||||
// Do not let the annotated page treat typed letters as its own shortcuts.
|
||||
event.stopPropagation();
|
||||
if (event.key === 'Enter' && !event.shiftKey) {
|
||||
event.preventDefault();
|
||||
attach();
|
||||
}
|
||||
@@ -551,6 +555,7 @@ export const buildAnnotationOverlayScript = (
|
||||
window.addEventListener('scroll', onScrollOrResize, true);
|
||||
window.addEventListener('resize', onScrollOrResize, true);
|
||||
window.addEventListener('keydown', onKeyDown, true);
|
||||
comment.addEventListener('keydown', onCommentKeyDown);
|
||||
|
||||
// ------------------------------------------------------------------ finish
|
||||
|
||||
@@ -564,6 +569,7 @@ export const buildAnnotationOverlayScript = (
|
||||
window.removeEventListener('scroll', onScrollOrResize, true);
|
||||
window.removeEventListener('resize', onScrollOrResize, true);
|
||||
window.removeEventListener('keydown', onKeyDown, true);
|
||||
comment.removeEventListener('keydown', onCommentKeyDown);
|
||||
setCursor('');
|
||||
if (cursorStyle.parentNode) cursorStyle.parentNode.removeChild(cursorStyle);
|
||||
if (host.parentNode) host.parentNode.removeChild(host);
|
||||
|
||||
Reference in New Issue
Block a user