mirror of
https://github.com/Foundry376/Mailspring.git
synced 2025-09-24 05:25:00 +08:00
fix(sig): Remove selectEnd, place cursor before sig
Summary: When focusing the composer, select the end of the last text block above any signatures / quoted text (which can be visible by default in Fwd:). Test Plan: Run tests Reviewers: juan, evan Reviewed By: evan Differential Revision: https://phab.nylas.com/D2411
This commit is contained in:
parent
a4e25da9e2
commit
e8239a92ab
6 changed files with 44 additions and 16 deletions
|
@ -7,8 +7,12 @@ class SignatureComposerExtension extends ComposerExtension
|
||||||
return unless signature
|
return unless signature
|
||||||
|
|
||||||
insertionPoint = draft.body.indexOf('<blockquote')
|
insertionPoint = draft.body.indexOf('<blockquote')
|
||||||
|
signatureHTML = '<div class="nylas-n1-signature">' + signature + '</div>'
|
||||||
|
|
||||||
if insertionPoint is -1
|
if insertionPoint is -1
|
||||||
insertionPoint = draft.body.length
|
insertionPoint = draft.body.length
|
||||||
draft.body = draft.body.slice(0, insertionPoint) + '<br/><div class="nylas-n1-signature">' + signature + "</div>" + draft.body.slice(insertionPoint)
|
signatureHTML = '<br/><br/>' + signatureHTML
|
||||||
|
|
||||||
|
draft.body = draft.body.slice(0, insertionPoint) + signatureHTML + draft.body.slice(insertionPoint)
|
||||||
|
|
||||||
module.exports = SignatureComposerExtension
|
module.exports = SignatureComposerExtension
|
||||||
|
|
|
@ -19,9 +19,9 @@ describe "SignatureComposerExtension", ->
|
||||||
body: 'This is a another test.'
|
body: 'This is a another test.'
|
||||||
|
|
||||||
SignatureComposerExtension.prepareNewDraft(draft: a)
|
SignatureComposerExtension.prepareNewDraft(draft: a)
|
||||||
expect(a.body).toEqual('This is a test! <br/><div class="nylas-n1-signature"><div id="signature">This is my signature.</div></div><blockquote>Hello world</blockquote>')
|
expect(a.body).toEqual('This is a test! <div class="nylas-n1-signature"><div id="signature">This is my signature.</div></div><blockquote>Hello world</blockquote>')
|
||||||
SignatureComposerExtension.prepareNewDraft(draft: b)
|
SignatureComposerExtension.prepareNewDraft(draft: b)
|
||||||
expect(b.body).toEqual('This is a another test.<br/><div class="nylas-n1-signature"><div id="signature">This is my signature.</div></div>')
|
expect(b.body).toEqual('This is a another test.<br/><br/><div class="nylas-n1-signature"><div id="signature">This is my signature.</div></div>')
|
||||||
|
|
||||||
describe "when a signature is not defined", ->
|
describe "when a signature is not defined", ->
|
||||||
beforeEach ->
|
beforeEach ->
|
||||||
|
|
|
@ -121,7 +121,43 @@ class ComposerEditor extends Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
focus() {
|
focus() {
|
||||||
this.refs.contenteditable.selectEnd();
|
// focus the composer and place the insertion point at the last text node of
|
||||||
|
// the body. Be sure to choose the last node /above/ the signature and any
|
||||||
|
// quoted text that is visible. (as in forwarded messages.)
|
||||||
|
//
|
||||||
|
this.refs.contenteditable.atomicEdit( ({editor})=> {
|
||||||
|
const walker = document.createTreeWalker(editor.rootNode, NodeFilter.SHOW_TEXT);
|
||||||
|
const nodesBelowUserBody = editor.rootNode.querySelectorAll('.nylas-n1-signature, .gmail_quote, blockquote');
|
||||||
|
|
||||||
|
let lastNode = null;
|
||||||
|
let node = walker.nextNode();
|
||||||
|
|
||||||
|
while (node != null) {
|
||||||
|
let belowUserBody = false;
|
||||||
|
for (let i = 0; i < nodesBelowUserBody.length; ++i) {
|
||||||
|
if (nodesBelowUserBody[i].contains(node)) {
|
||||||
|
belowUserBody = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (belowUserBody) {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
lastNode = node;
|
||||||
|
node = walker.nextNode();
|
||||||
|
}
|
||||||
|
|
||||||
|
editor.rootNode.focus();
|
||||||
|
|
||||||
|
if (lastNode) {
|
||||||
|
const range = document.createRange();
|
||||||
|
range.selectNodeContents(lastNode);
|
||||||
|
range.collapse(false);
|
||||||
|
const selection = window.getSelection();
|
||||||
|
selection.removeAllRanges();
|
||||||
|
selection.addRange(range);
|
||||||
|
}
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
@ -96,8 +96,6 @@ class Contenteditable extends React.Component
|
||||||
|
|
||||||
focus: => @_editableNode().focus()
|
focus: => @_editableNode().focus()
|
||||||
|
|
||||||
selectEnd: => @atomicEdit ({editor}) -> editor.selectEnd()
|
|
||||||
|
|
||||||
|
|
||||||
########################################################################
|
########################################################################
|
||||||
########################### React Lifecycle ############################
|
########################### React Lifecycle ############################
|
||||||
|
|
|
@ -48,7 +48,6 @@ class EditorAPI
|
||||||
collapseToEnd: (args...) -> @_extendedSelection.collapseToEnd(args...); @
|
collapseToEnd: (args...) -> @_extendedSelection.collapseToEnd(args...); @
|
||||||
importSelection: (args...) -> @_extendedSelection.importSelection(args...); @
|
importSelection: (args...) -> @_extendedSelection.importSelection(args...); @
|
||||||
select: (args...) -> @_extendedSelection.select(args...); @
|
select: (args...) -> @_extendedSelection.select(args...); @
|
||||||
selectEnd: (args...) -> @_extendedSelection.selectEnd(args...); @
|
|
||||||
selectAllChildren: (args...) -> @_extendedSelection.selectAllChildren(args...); @
|
selectAllChildren: (args...) -> @_extendedSelection.selectAllChildren(args...); @
|
||||||
restoreSelectionByTextIndex: (args...) -> @_extendedSelection.restoreSelectionByTextIndex(args...); @
|
restoreSelectionByTextIndex: (args...) -> @_extendedSelection.restoreSelectionByTextIndex(args...); @
|
||||||
|
|
||||||
|
|
|
@ -55,15 +55,6 @@ class ExtendedSelection
|
||||||
throw @_errBadUsage()
|
throw @_errBadUsage()
|
||||||
@setBaseAndExtent(fromNode, fromIndex, toNode, toIndex)
|
@setBaseAndExtent(fromNode, fromIndex, toNode, toIndex)
|
||||||
|
|
||||||
selectEnd: ->
|
|
||||||
range = document.createRange()
|
|
||||||
range.selectNodeContents(@scopeNode)
|
|
||||||
range.collapse(false)
|
|
||||||
@scopeNode.focus()
|
|
||||||
selection = window.getSelection()
|
|
||||||
selection.removeAllRanges()
|
|
||||||
selection.addRange(range)
|
|
||||||
|
|
||||||
exportSelection: -> new ExportedSelection(@rawSelection, @scopeNode)
|
exportSelection: -> new ExportedSelection(@rawSelection, @scopeNode)
|
||||||
|
|
||||||
# Since the last time we exported the selection, the DOM may have
|
# Since the last time we exported the selection, the DOM may have
|
||||||
|
|
Loading…
Add table
Reference in a new issue