Skip to content

Commit 0924a8c

Browse files
SimeonCSimeonC
SimeonC
authored and
SimeonC
committed
fix(taExecCommand): Fix lists for FF specifically.
Fixes #290
1 parent cf4c478 commit 0924a8c

File tree

2 files changed

+80
-6
lines changed

2 files changed

+80
-6
lines changed

src/textAngular.js

+29-4
Original file line numberDiff line numberDiff line change
@@ -779,11 +779,15 @@ See README.md or https://github.com/fraywing/textAngular/wiki for requirements a
779779
listElement.remove();
780780
taSelection.setSelectionToElementEnd($target[0]);
781781
};
782+
var selectLi = function(liElement){
783+
if(/(<br(|\/)>)$/.test(liElement.innerHTML.trim())) taSelection.setSelectionBeforeElement(angular.element(liElement).find("br")[0]);
784+
else taSelection.setSelectionToElementEnd(liElement);
785+
};
782786
var listToList = function(listElement, newListTag){
783787
var $target = angular.element('<' + newListTag + '>' + listElement[0].innerHTML + '</' + newListTag + '>');
784788
listElement.after($target);
785789
listElement.remove();
786-
taSelection.setSelectionToElementEnd($target.find('li')[0]);
790+
selectLi($target.find('li')[0]);
787791
};
788792
var childElementsToList = function(elements, listElement, newListTag){
789793
var html = '';
@@ -793,7 +797,7 @@ See README.md or https://github.com/fraywing/textAngular/wiki for requirements a
793797
var $target = angular.element('<' + newListTag + '>' + html + '</' + newListTag + '>');
794798
listElement.after($target);
795799
listElement.remove();
796-
taSelection.setSelectionToElementEnd($target.find('li')[0]);
800+
selectLi($target.find('li')[0]);
797801
};
798802
return function(taDefaultWrap){
799803
taDefaultWrap = taBrowserTag(taDefaultWrap);
@@ -858,8 +862,13 @@ See README.md or https://github.com/fraywing/textAngular/wiki for requirements a
858862
}
859863
}
860864
$target = angular.element('<' + selfTag + '>' + html + '</' + selfTag + '>');
861-
$nodes.pop().replaceWith($target);
862-
angular.forEach($nodes, function($node){ $node.remove(); });
865+
if($nodes.length){
866+
$nodes.pop().replaceWith($target);
867+
angular.forEach($nodes, function($node){ $node.remove(); });
868+
}else{
869+
// selection was empty, insert html (cursor moved automatically)
870+
return taSelection.insertHtml('<' + selfTag + '>' + html + '</' + selfTag + '>');
871+
}
863872
}
864873
taSelection.setSelectionToElementEnd($target[0]);
865874
return;
@@ -2055,6 +2064,22 @@ See README.md or https://github.com/fraywing/textAngular/wiki for requirements a
20552064

20562065
rangy.getSelection().setSingleRange(range);
20572066
},
2067+
setSelectionBeforeElement: function (el){
2068+
var range = rangy.createRange();
2069+
2070+
range.selectNode(el);
2071+
range.collapse(true);
2072+
2073+
rangy.getSelection().setSingleRange(range);
2074+
},
2075+
setSelectionAfterElement: function (el){
2076+
var range = rangy.createRange();
2077+
2078+
range.selectNode(el);
2079+
range.collapse(false);
2080+
2081+
rangy.getSelection().setSingleRange(range);
2082+
},
20582083
setSelectionToElementStart: function (el){
20592084
var range = rangy.createRange();
20602085

test/taExecCommand.spec.js

+51-2
Original file line numberDiff line numberDiff line change
@@ -306,14 +306,18 @@ describe('taExecCommand', function(){
306306
});
307307

308308
describe('handles lists correctly', function(){
309-
var taSelectionMock, $document, contents;
309+
var taSelectionMock, $document, contents, insertedHtml;
310310
beforeEach(function(){
311+
insertedHtml = '';
311312
taSelectionMock = {
312313
element: undefined,
313314
getSelectionElement: function (){ return this.element; },
314315
getOnlySelectedElements: function(){ return this.element.childNodes; },
315316
setSelectionToElementStart: function (){ return; },
316-
setSelectionToElementEnd: function (){ return; }
317+
setSelectionToElementEnd: function (){ return; },
318+
setSelectionAfterElement: function (){ return; },
319+
setSelectionBeforeElement: function (){ return; },
320+
insertHtml: function(html){ insertedHtml = html; }
317321
};
318322

319323
module(function($provide){
@@ -335,6 +339,51 @@ describe('taExecCommand', function(){
335339
$document[0].execCommand = _temp;
336340
}));
337341
});
342+
describe('nothing selected', function(){
343+
beforeEach(inject(function(taSelection){
344+
element = angular.element('<div><p></p></div>');
345+
taSelection.element = element.children()[0];
346+
}));
347+
it('to ol', inject(function(taSelection, taExecCommand){
348+
taExecCommand()('insertorderedlist', false, null);
349+
expect(element.html()).toBe('<ol><li></li></ol>');
350+
}));
351+
352+
it('to ul', inject(function(taSelection, taExecCommand){
353+
taExecCommand()('insertunorderedlist', false, null);
354+
expect(element.html()).toBe('<ul><li></li></ul>');
355+
}));
356+
});
357+
describe('br on line selected', function(){
358+
beforeEach(inject(function(taSelection){
359+
element = angular.element('<div><p><br></p></div>');
360+
taSelection.element = element.children()[0];
361+
}));
362+
it('to ol', inject(function(taSelection, taExecCommand){
363+
taExecCommand()('insertorderedlist', false, null);
364+
expect(element.html()).toBe('<ol><li><br></li></ol>');
365+
}));
366+
367+
it('to ul', inject(function(taSelection, taExecCommand){
368+
taExecCommand()('insertunorderedlist', false, null);
369+
expect(element.html()).toBe('<ul><li><br></li></ul>');
370+
}));
371+
});
372+
describe('empty ta-bind', function(){
373+
beforeEach(inject(function(taSelection){
374+
element = angular.element('<div class="ta-bind"></div>');
375+
taSelection.element = element[0];
376+
}));
377+
it('to ol', inject(function(taSelection, taExecCommand){
378+
taExecCommand()('insertorderedlist', false, null);
379+
expect(insertedHtml).toBe('<ol></ol>');
380+
}));
381+
382+
it('to ul', inject(function(taSelection, taExecCommand){
383+
taExecCommand()('insertunorderedlist', false, null);
384+
expect(insertedHtml).toBe('<ul></ul>');
385+
}));
386+
});
338387
describe('single element selected', function(){
339388
beforeEach(inject(function(taSelection){
340389
element = angular.element('<div><p>To the List!</p></div>');

0 commit comments

Comments
 (0)