0
Fork 0
mirror of https://github.com/fastmail/Squire.git synced 2024-12-22 15:23:29 -05:00

Merge pull request #211 from InteractiveIntelligence/Path-contains-format-values

Update README and Tests
This commit is contained in:
Neil Jenkins 2016-07-09 21:24:42 +10:00 committed by GitHub
commit c1eb254758
2 changed files with 77 additions and 1 deletions

View file

@ -179,7 +179,7 @@ Returns self (the Squire instance).
### getPath
Returns the path through the DOM tree from the `<body>` element to the current current cursor position. This is a string consisting of the tag, id and class names in CSS format. For example `BODY>BLOCKQUOTE>DIV#id>STRONG>SPAN.font>EM`. If a selection has been made, so different parts of the selection may have different paths, the value will be `(selection)`. The path is useful for efficiently determining the current formatting for bold, italic, underline etc, and thus determining button state. If a selection has been made, you can has the `hasFormat` method instead to get the current state for the properties you care about.
Returns the path through the DOM tree from the `<body>` element to the current current cursor position. This is a string consisting of the tag, id, class, font, and color names in CSS format. For example `BODY>BLOCKQUOTE>DIV#id>STRONG>SPAN.font[fontFamily=Arial,sans-serif]>EM`. If a selection has been made, so different parts of the selection may have different paths, the value will be `(selection)`. The path is useful for efficiently determining the current formatting for bold, italic, underline etc, and thus determining button state. If a selection has been made, you can has the `hasFormat` method instead to get the current state for the properties you care about.
### getFontInfo

View file

@ -195,6 +195,82 @@ describe('Squire RTE', function () {
});
});
describe('getPath', function () {
var startHTML;
beforeEach( function () {
startHTML = '<div>one <b>two three</b> four <i>five</i></div>';
editor.setHTML(startHTML);
var range = doc.createRange();
range.setStart(doc.body.childNodes.item(0), 0);
range.setEnd(doc.body.childNodes.item(0), 1);
editor.setSelection(range);
});
it('returns the path to the selection', function () {
var range = doc.createRange();
range.setStart(doc.body.childNodes.item(0).childNodes.item(1), 0);
range.setEnd(doc.body.childNodes.item(0).childNodes.item(1), 0);
editor.setSelection(range);
//Manually tell it to update the path
editor._updatePath(range);
expect(editor.getPath(), 'to be', 'DIV>B');
});
it('includes id in the path', function () {
editor.insertHTML('<div id="spanId">Text</div>');
expect(editor.getPath(), 'to be', 'DIV#spanId');
});
it('includes class name in the path', function () {
editor.insertHTML('<div class="myClass">Text</div>');
expect(editor.getPath(), 'to be', 'DIV.myClass');
});
it('includes all class names in the path', function () {
editor.insertHTML('<div class="myClass myClass2 myClass3">Text</div>');
expect(editor.getPath(), 'to be', 'DIV.myClass.myClass2.myClass3');
});
it('includes direction in the path', function () {
editor.insertHTML('<div dir="rtl">Text</div>');
expect(editor.getPath(), 'to be', 'DIV[dir=rtl]');
});
it('includes highlight value in the path', function () {
editor.insertHTML('<div class="highlight" style="background-color: rgb(255, 0, 0)">Text</div>');
expect(editor.getPath(), 'to be', 'DIV.highlight[backgroundColor=rgb(255,0,0)]');
});
it('includes color value in the path', function () {
editor.insertHTML('<div class="colour" style="color: rgb(255, 0, 0)">Text</div>');
expect(editor.getPath(), 'to be', 'DIV.colour[color=rgb(255,0,0)]');
});
it('includes font family value in the path', function () {
editor.insertHTML('<div class="font" style="font-family: Arial, sans-serif">Text</div>');
expect(editor.getPath(), 'to be', 'DIV.font[fontFamily=Arial,sans-serif]');
});
it('includes font size value in the path', function () {
editor.insertHTML('<div class="size" style="font-size: 12pt">Text</div>');
expect(editor.getPath(), 'to be', 'DIV.size[fontSize=12pt]');
});
it('is (selection) when the selection is a range', function() {
var range = doc.createRange();
range.setStart(doc.body.childNodes.item(0).childNodes.item(0), 0);
range.setEnd(doc.body.childNodes.item(0).childNodes.item(3), 0);
editor.setSelection(range);
//Manually tell it to update the path
editor._updatePath(range);
expect(editor.getPath(), 'to be', '(selection)');
});
});
afterEach(function () {
editor = null;
var iframe = document.getElementById('testFrame');