| 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93 |
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
| /**
* Style.spec.js
* (c) 2015~ Summernote Team
* summernote may be freely distributed under the MIT license./
*/
import chai from 'chai';
import $ from 'jquery';
import range from '../../../../src/js/base/core/range';
import Style from '../../../../src/js/base/editing/Style';
var expect = chai.expect;
describe('base:editing.Style', () => {
var style = new Style();
describe('styleNodes', () => {
it('should wrap selected text with span', () => {
var $cont = $('<div class="note-editable"><p>text</p></div>');
var $p = $cont.find('p');
var rng = range.create($p[0].firstChild, 0, $p[0].firstChild, 4);
style.styleNodes(rng);
expect($cont.html()).to.deep.equal('<p><span>text</span></p>');
});
it('should split text and wrap selected text with span', () => {
var $cont = $('<div class="note-editable"><p>text</p></div>');
var $p = $cont.find('p');
var rng = range.create($p[0].firstChild, 1, $p[0].firstChild, 3);
style.styleNodes(rng);
expect($cont.html()).to.deep.equal('<p>t<span>ex</span>t</p>');
});
it('should split text and insert span', () => {
var $cont = $('<div class="note-editable"><p>text</p></div>');
var $p = $cont.find('p');
var rng = range.create($p[0].firstChild, 2, $p[0].firstChild, 2);
style.styleNodes(rng);
expect($cont.html()).to.deep.equal('<p>te<span></span>xt</p>');
});
it('should just return a parent span', () => {
var $cont = $('<div class="note-editable"><p><span>text</span></p></div>');
var $span = $cont.find('span');
var rng = range.create($span[0].firstChild, 0, $span[0].firstChild, 4);
style.styleNodes(rng);
expect($cont.html()).to.deep.equal('<p><span>text</span></p>');
});
it('should wrap each texts with span', () => {
var $cont = $('<div class="note-editable"><p><b>bold</b><span>span</span></p></div>');
var $b = $cont.find('b');
var $span = $cont.find('span');
var rng = range.create($b[0].firstChild, 2, $span[0].firstChild, 2);
style.styleNodes(rng);
expect($cont.html()).to.deep.equal('<p><b>bo<span>ld</span></b><span><span>sp</span>an</span></p>');
});
it('should wrap each texts with span except not a single blood line', () => {
var $cont = $('<div class="note-editable"><p><b>bold</b><span>span</span></p></div>');
var $b = $cont.find('b');
var $span = $cont.find('span');
var rng = range.create($b[0].firstChild, 2, $span[0].firstChild, 4);
style.styleNodes(rng);
expect($cont.html()).to.deep.equal('<p><b>bo<span>ld</span></b><span>span</span></p>');
});
it('should expand b tag when providing the expandClosestSibling option', () => {
var $cont = $('<div class="note-editable"><p>text<b>bold</b></p></div>');
var $p = $cont.find('p');
var rng = range.create($p[0].firstChild, 0, $p[0].firstChild, 4);
style.styleNodes(rng, { nodeName: 'B', expandClosestSibling: true });
expect($cont.html()).to.deep.equal('<p><b>textbold</b></p>');
});
it('should not expand b tag when providing the onlyPartialContains option', () => {
var $cont = $('<div class="note-editable"><p>text<b>bold</b></p></div>');
var $p = $cont.find('p');
var rng = range.create($p[0].firstChild, 0, $p[0].firstChild, 4);
style.styleNodes(rng, { nodeName: 'B', expandClosestSibling: true, onlyPartialContains: true });
expect($cont.html()).to.deep.equal('<p><b>text</b><b>bold</b></p>');
});
});
});
|