diff --git a/src/doc/DocAnnotator.js b/src/doc/DocAnnotator.js index 90271a4d3..06f0ce893 100644 --- a/src/doc/DocAnnotator.js +++ b/src/doc/DocAnnotator.js @@ -1,5 +1,6 @@ // @flow import rangy from 'rangy'; +import get from 'lodash/get'; /* eslint-disable no-unused-vars */ // Workaround for rangy npm issue: https://github.com/timdown/rangy/lib/issues/342 import rangyClassApplier from 'rangy/lib/rangy-classapplier'; @@ -415,6 +416,7 @@ class DocAnnotator extends Annotator { if ( // $FlowFixMe this.hasMouseMoved(this.lastHighlightEvent, event) && + !this.isCreatingHighlight && this.createHighlightDialog && this.createHighlightDialog.isVisible && !this.createHighlightDialog.isInHighlight(mouseEvent) @@ -557,13 +559,15 @@ class DocAnnotator extends Annotator { this.selectionEndTimeout = null; } - this.resetHighlightOnOutsideClick(event); + if (!this.isCreatingHighlight) { + this.resetHighlightOnOutsideClick(event); + } // Do nothing if in a text area or mobile dialog or mobile create dialog is already open const pointController = this.modeControllers[TYPES.point]; const isCreatingPoint = !!(pointController && pointController.pendingThreadID); const isPopoverActive = !!util.findClosestElWithClass(document.activeElement, CLASS_ANNOTATION_POPOVER); - if (this.isCreatingHighlight || isCreatingPoint || isPopoverActive) { + if (isCreatingPoint || isPopoverActive) { return; } @@ -577,7 +581,7 @@ class DocAnnotator extends Annotator { } this.selectionEndTimeout = setTimeout(() => { - if (this.createHighlightDialog && !this.createHighlightDialog.isVisible) { + if (this.createHighlightDialog) { this.createHighlightDialog.show(this.lastSelection); } }, SELECTION_TIMEOUT); @@ -594,12 +598,7 @@ class DocAnnotator extends Annotator { this.modeControllers[TYPES.highlight_comment].applyActionToThreads((thread) => thread.reset(), page); } - let mouseEvent = event; - // $FlowFixMe - if (this.hasTouch && event.targetTouches) { - mouseEvent = event.targetTouches[0]; - } - this.lastHighlightEvent = mouseEvent; + this.lastHighlightEvent = get(event, 'targetTouches[0]', event); this.lastSelection = selection; } diff --git a/src/doc/__tests__/DocAnnotator-test.js b/src/doc/__tests__/DocAnnotator-test.js index 2170fb8ca..94cf71d8e 100644 --- a/src/doc/__tests__/DocAnnotator-test.js +++ b/src/doc/__tests__/DocAnnotator-test.js @@ -846,11 +846,12 @@ describe('doc/DocAnnotator', () => { expect(annotator.selectionEndTimeout).not.toEqual(123); }); - it('should clear selection if the user is currently creating a highlight annotation', () => { - annotator.isCreatingHighlight = true; + it('should clear selection if the user is NOT currently creating a highlight annotation', () => { + annotator.isCreatingHighlight = false; util.isInDialog = jest.fn().mockReturnValue(true); annotator.onSelectionChange(event); expect(annotator.resetHighlightOnOutsideClick).toBeCalled(); + expect(util.findClosestElWithClass).toBeCalled(); }); it('should clear out highlights and exit "annotation creation" mode if an invalid selection', () => { @@ -899,6 +900,25 @@ describe('doc/DocAnnotator', () => { expect(annotator.isCreatingHighlight).toBeTruthy(); }); + it('should reposition the existing createHighlightDialog', () => { + const selection = { + rangeCount: 10, + isCollapsed: false, + anchorNode: { + parentNode: 'Node' + }, + toString: () => 'asdf' + }; + window.getSelection = jest.fn().mockReturnValue(selection); + docUtil.hasSelectionChanged = jest.fn().mockReturnValue(true); + annotator.lastHighlightEvent = event; + annotator.createHighlightDialog.isVisible = true; + + annotator.onSelectionChange(event); + expect(annotator.selectionEndTimeout).not.toBeNull(); + expect(annotator.isCreatingHighlight).toBeTruthy(); + }); + it('should set all of the highlight annotations on the page to "inactive" state', () => { const selection = { rangeCount: 10,