FIX: prevent selectionchanged trigger loop on Safari

This commit is contained in:
Régis Hanol 2016-12-05 11:33:26 +01:00
parent edce052660
commit 9f3eaf4c95

View File

@ -15,6 +15,7 @@ export default Ember.Component.extend({
visible: buffer => buffer && buffer.length > 0, visible: buffer => buffer && buffer.length > 0,
_isMouseDown: false, _isMouseDown: false,
_reselected: false,
_selectionChanged() { _selectionChanged() {
const selection = window.getSelection(); const selection = window.getSelection();
@ -38,17 +39,17 @@ export default Ember.Component.extend({
} }
} }
// used to work around Safari losing selection
const clone = firstRange.cloneRange();
this.get("quoteState").setProperties({ postId, buffer: selectedText() }); this.get("quoteState").setProperties({ postId, buffer: selectedText() });
// on Desktop, shows the button at the beginning of the selection // on Desktop, shows the button at the beginning of the selection
// on Mobile, shows the button at the end of the selection // on Mobile, shows the button at the end of the selection
const isMobileDevice = this.site.isMobileDevice; const isMobileDevice = this.site.isMobileDevice;
const { isIOS, isAndroid } = this.capabilities; const { isIOS, isAndroid, isSafari } = this.capabilities;
const showAtEnd = isMobileDevice || isIOS || isAndroid; const showAtEnd = isMobileDevice || isIOS || isAndroid;
// used to work around Safari losing selection
const clone = firstRange.cloneRange();
// create a marker element containing a single invisible character // create a marker element containing a single invisible character
const markerElement = document.createElement("span"); const markerElement = document.createElement("span");
markerElement.appendChild(document.createTextNode("\ufeff")); markerElement.appendChild(document.createTextNode("\ufeff"));
@ -68,9 +69,11 @@ export default Ember.Component.extend({
markerElement.parentNode.removeChild(markerElement); markerElement.parentNode.removeChild(markerElement);
// work around Safari that would sometimes lose the selection // work around Safari that would sometimes lose the selection
const s = window.getSelection(); if (isSafari) {
s.removeAllRanges(); this._reselected = true;
s.addRange(clone); selection.removeAllRanges();
selection.addRange(clone);
}
// change the position of the button // change the position of the button
Ember.run.scheduleOnce("afterRender", () => { Ember.run.scheduleOnce("afterRender", () => {
@ -96,6 +99,7 @@ export default Ember.Component.extend({
$(document).on("mousedown.quote-button", (e) => { $(document).on("mousedown.quote-button", (e) => {
this._isMouseDown = true; this._isMouseDown = true;
this._reselected = false;
if (!willQuote(e)) { if (!willQuote(e)) {
this.sendAction("deselectText"); this.sendAction("deselectText");
} }
@ -103,7 +107,7 @@ export default Ember.Component.extend({
this._isMouseDown = false; this._isMouseDown = false;
onSelectionChanged(); onSelectionChanged();
}).on("selectionchange.quote-button", () => { }).on("selectionchange.quote-button", () => {
if (!this._isMouseDown) { if (!this._isMouseDown && !this._reselected) {
onSelectionChanged(); onSelectionChanged();
} }
}); });