8b84368e3a
* Clarify some comments
* Don't destructure insertion trigger
* Make superscript and subscript use domlib/surround
* Create new {Text,Highlight}ColorButton
* Use domlib/surround for textcolor
- However there's still a crucial bug, when you're breaking existing
colored span when unsurrounding, their color is not restored
* Add underline format to removeFormats
* Simplify type of ElementMatcher and ElementClearer for end users
* Add some comments for normalize-insertion-ranges
* Split normalize-insertion-ranges into remove-adjacent and remove-within
* Factor out find-remove from unsurround.ts
* Rename merge-mach, simplify remove-within
* Clarify some comments
* Refactor first reduce
* Refactor reduceRight
* Flatten functions in merge-ranges
* Move some functionality to merge-ranges and do not export
* Refactor merge-ranges
* Remove createInitialMergeMatch
* Finish refactoring of merge-ranges
* Refactor merge-ranges to minimal-ranges and add some unit testing
* Move more logic into text-node
* Remove most most of the logic from remove-adjacent
- remove-adjacent is still part of the "merging" logic, as it increases
the scope of the child node ranges
* Add some tests for edge cases
* Merge remove-adjacent logic into minimal-ranges
* Refactor unnecessary list destructuring
* Add some TODOs
* Put removing nodes and adding new nodes into sequence
* Refactor MatchResult to MatchType and return clear from matcher
* Inline surround/helpers
* Shorten name of param
* Add another edge case test
* Add an example where commonAncestorContainer != normalization level
* Fix bug in find-adjacent when find more than one nested nodes
* Allow comments for Along type
* Simplify find-adjacent by removing intermediate and/or curried functions
* Remove extend-adjacent
* Add more tests when find-adjacent finds by descension
* Fix find-adjacent descending into block-level elements
* Add clarifying comment to refusing to descend into block-level elements
* Move shifting logic into find-adjacent
* Rename file matcher to match-type
* Give a first implemention of TreeVertex
* Remove MatchType.ALONG
- findAdjacent now directly modifies the range
* Rename MatchType.MATCH into MatchType.REMOVE
* Implement a version of find-within that utilizies match-tree
* Turn child node range into a class
* Fix bug in new find-adjacent function
* Make all find-adjacent tests test for ranges
* Surrounding within farthestMatchingAncestor when available
* Fix an issue with negligable elements
- also rename "along" elements to "negligable"
* Add two TODOs to SurroundFormat interface
* Have a messy first implementation of the new tree-node algorithm
* Maintain whether formatting nodes are covered or within user selection
* Move covered and insideRange into TreeNode superclass
* Reimplement findAdjacent logic
* Add extension logic
* Add an evaluate method to nodes
* Introduce BlockNode
* Add a first evaluate implementation
* Add left shift and inner shift logic
* Implement SurroundFormatUser
* Allow pass in formatter, ascender and merger from outside
* Fix insideRange and covered switch-up
* Fix MatchNode.prototype.isAscendable
* Fix another switch-up of covered and insideRange...
* Remove a lot of old code
* Have surround functions only return the range
- I still cannot think of a good reason why we should return addedNodes
and removedNodes, except for testing.
* Create formatting-tree directory
* Create build-tree directory + Move find-above up to /domlib
* Remove range-anchors
* Move unsurround logic into no-splitting
* Fix extend-merge
* Fix inner shift being eroneusly returned as left shift
* Fix oversight in SplitRange
* Redefine how ranges are recreated
* Rename covered to insideMatch and put as fourth parameter instead of third
* Keep track of match holes and match leaves
* Rename ChildNodeRange to FlatRange
* Change signature of matcher
* Fix bug in extend-merge
* Improve Match class
* Utilize cache in TextColorButton
* Implement getBaseSurrounder for TextColorButton
* Add matchAncestors field to FormattingNode
* Introduce matchAncestors and getCache
* Do clearing during parsing already
- This way, you know whether elements will be removed before getting to
Formatting nodes
* Make HighlightColorButton use our surround mechanism
* Fix a bug with calling .removeAttribute and .hasAttribute
* Add side button to RemoveFormat button
* Add disabled to remove format side button
* Expose remove formats on RemoveFormat button
* Reinvent editor/surround as Surrounder class
* Fix split-text when working with insert trigger
* Try counteracting the contenteditable's auto surrounding
* Remove matching elements before normalizing
* Rewrite match-type
* Move setting match leaves into build
* Change editing strings
- So that color strings match bold/italic strings better
* Fix border radius of List options menu
* Implement extensions functionality
* Remove some unnecessary code
* Fix split range endOffset
* Type MatchType
* Reformat MatchType + add docs
* Fix domlib/surround/apply
* Satisfy last tests
* Register Surrounder as package
* Clarify some comments
* Correctly implement reformat
* Reformat with inactive eraser formats
* Clear empty spans with RemoveFormatButton
* Fix Super/Subscript button
* Use ftl string for hardcoded tooltip
* Adjust wording
354 lines
11 KiB
TypeScript
354 lines
11 KiB
TypeScript
// Copyright: Ankitects Pty Ltd and contributors
|
|
// License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|
|
|
import { surround } from "./surround";
|
|
import { easyBold, easyUnderline, p } from "./test-utils";
|
|
|
|
describe("surround text", () => {
|
|
let body: HTMLBodyElement;
|
|
|
|
beforeEach(() => {
|
|
body = p("111222");
|
|
});
|
|
|
|
test("all text", () => {
|
|
const range = new Range();
|
|
range.selectNode(body.firstChild!);
|
|
|
|
const surroundedRange = surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "<b>111222</b>");
|
|
expect(surroundedRange.toString()).toEqual("111222");
|
|
});
|
|
|
|
test("first half", () => {
|
|
const range = new Range();
|
|
range.setStart(body.firstChild!, 0);
|
|
range.setEnd(body.firstChild!, 3);
|
|
|
|
const surroundedRange = surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "<b>111</b>222");
|
|
expect(surroundedRange.toString()).toEqual("111");
|
|
});
|
|
|
|
test("second half", () => {
|
|
const range = new Range();
|
|
range.setStart(body.firstChild!, 3);
|
|
range.setEnd(body.firstChild!, 6);
|
|
|
|
const surroundedRange = surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "111<b>222</b>");
|
|
expect(surroundedRange.toString()).toEqual("222");
|
|
});
|
|
});
|
|
|
|
describe("surround text next to nested", () => {
|
|
describe("before", () => {
|
|
let body: HTMLBodyElement;
|
|
|
|
beforeEach(() => {
|
|
body = p("before<u><b>after</b></u>");
|
|
});
|
|
|
|
test("enlarges bottom tag of nested", () => {
|
|
const range = new Range();
|
|
range.selectNode(body.firstChild!);
|
|
surround(range, body, easyUnderline);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "<u>before<b>after</b></u>");
|
|
// expect(surroundedRange.toString()).toEqual("before");
|
|
});
|
|
|
|
test("moves nested down", () => {
|
|
const range = new Range();
|
|
range.selectNode(body.firstChild!);
|
|
surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "<b>before<u>after</u></b>");
|
|
// expect(surroundedRange.toString()).toEqual("before");
|
|
});
|
|
});
|
|
|
|
describe("after", () => {
|
|
let body: HTMLBodyElement;
|
|
|
|
beforeEach(() => {
|
|
body = p("<u><b>before</b></u>after");
|
|
});
|
|
|
|
test("enlarges bottom tag of nested", () => {
|
|
const range = new Range();
|
|
range.selectNode(body.childNodes[1]);
|
|
surround(range, body, easyUnderline);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "<u><b>before</b>after</u>");
|
|
// expect(surroundedRange.toString()).toEqual("after");
|
|
});
|
|
|
|
test("moves nested down", () => {
|
|
const range = new Range();
|
|
range.selectNode(body.childNodes[1]);
|
|
surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "<b><u>before</u>after</b>");
|
|
// expect(surroundedRange.toString()).toEqual("after");
|
|
});
|
|
});
|
|
|
|
describe("two nested", () => {
|
|
let body: HTMLBodyElement;
|
|
|
|
beforeEach(() => {
|
|
body = p("aaa<i><b>bbb</b></i><i><b>ccc</b></i>");
|
|
});
|
|
|
|
test("extends to both", () => {
|
|
const range = new Range();
|
|
range.selectNode(body.firstChild!);
|
|
surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "<b>aaa<i>bbb</i><i>ccc</i></b>");
|
|
// expect(surroundedRange.toString()).toEqual("aaa");
|
|
});
|
|
});
|
|
});
|
|
|
|
describe("surround across block element", () => {
|
|
let body: HTMLBodyElement;
|
|
|
|
beforeEach(() => {
|
|
body = p("Before<br><ul><li>First</li><li>Second</li></ul>");
|
|
});
|
|
|
|
test("does not insert empty elements", () => {
|
|
const range = new Range();
|
|
range.setStartBefore(body.firstChild!);
|
|
range.setEndAfter(body.lastChild!);
|
|
const surroundedRange = surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty(
|
|
"innerHTML",
|
|
"<b>Before</b><br><ul><li><b>First</b></li><li><b>Second</b></li></ul>",
|
|
);
|
|
expect(surroundedRange.toString()).toEqual("BeforeFirstSecond");
|
|
});
|
|
});
|
|
|
|
describe("next to nested", () => {
|
|
let body: HTMLBodyElement;
|
|
|
|
beforeEach(() => {
|
|
body = p("111<b>222<b>333<b>444</b></b></b>555");
|
|
});
|
|
|
|
test("surround after", () => {
|
|
const range = new Range();
|
|
range.selectNode(body.lastChild!);
|
|
surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "111<b>222333444555</b>");
|
|
// expect(surroundedRange.toString()).toEqual("555");
|
|
});
|
|
});
|
|
|
|
describe("next to element with nested non-matching", () => {
|
|
let body: HTMLBodyElement;
|
|
|
|
beforeEach(() => {
|
|
body = p("111<b>222<i>333<i>444</i></i></b>555");
|
|
});
|
|
|
|
test("surround after", () => {
|
|
const range = new Range();
|
|
range.selectNode(body.lastChild!);
|
|
surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty(
|
|
"innerHTML",
|
|
"111<b>222<i>333<i>444</i></i>555</b>",
|
|
);
|
|
// expect(surroundedRange.toString()).toEqual("555");
|
|
});
|
|
});
|
|
|
|
describe("next to element with text element text", () => {
|
|
let body: HTMLBodyElement;
|
|
|
|
beforeEach(() => {
|
|
body = p("111<b>222<b>333</b>444</b>555");
|
|
});
|
|
|
|
test("surround after", () => {
|
|
const range = new Range();
|
|
range.selectNode(body.lastChild!);
|
|
surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "111<b>222333444555</b>");
|
|
// expect(surroundedRange.toString()).toEqual("555");
|
|
});
|
|
});
|
|
|
|
describe("surround elements that already have nested block", () => {
|
|
let body: HTMLBodyElement;
|
|
|
|
beforeEach(() => {
|
|
body = p("<b>1<b>2</b></b><br>");
|
|
});
|
|
|
|
test("normalizes nodes", () => {
|
|
const range = new Range();
|
|
range.selectNode(body.children[0]);
|
|
|
|
surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "<b>12</b><br>");
|
|
// expect(surroundedRange.toString()).toEqual("12");
|
|
});
|
|
});
|
|
|
|
describe("surround complicated nested structure", () => {
|
|
let body: HTMLBodyElement;
|
|
|
|
beforeEach(() => {
|
|
body = p("<i>1</i><b><i>2</i>3<i>4</i></b><i>5</i>");
|
|
});
|
|
|
|
test("normalize nodes", () => {
|
|
const range = new Range();
|
|
range.setStartBefore(body.firstElementChild!.firstChild!);
|
|
range.setEndAfter(body.lastElementChild!.firstChild!);
|
|
|
|
const surroundedRange = surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty(
|
|
"innerHTML",
|
|
"<b><i>1</i><i>2</i>3<i>4</i><i>5</i></b>",
|
|
);
|
|
expect(surroundedRange.toString()).toEqual("12345");
|
|
});
|
|
});
|
|
|
|
describe("skips over empty elements", () => {
|
|
describe("joins two newly created", () => {
|
|
let body: HTMLBodyElement;
|
|
|
|
beforeEach(() => {
|
|
body = p("before<br>after");
|
|
});
|
|
|
|
test("normalize nodes", () => {
|
|
const range = new Range();
|
|
range.setStartBefore(body.firstChild!);
|
|
range.setEndAfter(body.childNodes[2]!);
|
|
|
|
const surroundedRange = surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "<b>before<br>after</b>");
|
|
expect(surroundedRange.toString()).toEqual("beforeafter");
|
|
});
|
|
});
|
|
|
|
describe("joins with already existing", () => {
|
|
let body: HTMLBodyElement;
|
|
|
|
beforeEach(() => {
|
|
body = p("before<br><b>after</b>");
|
|
});
|
|
|
|
test("normalize nodes", () => {
|
|
const range = new Range();
|
|
range.selectNode(body.firstChild!);
|
|
|
|
surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "<b>before<br>after</b>");
|
|
// expect(surroundedRange.toString()).toEqual("before");
|
|
});
|
|
|
|
test("normalize node contents", () => {
|
|
const range = new Range();
|
|
range.selectNodeContents(body.firstChild!);
|
|
|
|
const surroundedRange = surround(range, body, easyBold);
|
|
|
|
expect(body).toHaveProperty("innerHTML", "<b>before<br>after</b>");
|
|
expect(surroundedRange.toString()).toEqual("before");
|
|
});
|
|
});
|
|
});
|
|
|
|
// TODO
|
|
// describe("special cases when surrounding within range.commonAncestor", () => {
|
|
// // these are not vital but rather define how the algorithm works in edge cases
|
|
|
|
// test("does not normalize beyond level of contained text nodes", () => {
|
|
// const body = p("<b>before<u>nested</u>after</b>");
|
|
// const range = new Range();
|
|
// range.selectNode(body.firstChild!.childNodes[1].firstChild!);
|
|
|
|
// const { addedNodes, removedNodes, surroundedRange } = surround(
|
|
// range,
|
|
// body,
|
|
// easyBold,
|
|
// );
|
|
|
|
// expect(addedNodes).toHaveLength(1);
|
|
// expect(removedNodes).toHaveLength(0);
|
|
// expect(body).toHaveProperty(
|
|
// "innerHTML",
|
|
// "<b>before<b><u>nested</u></b>after</b>",
|
|
// );
|
|
// expect(surroundedRange.toString()).toEqual("nested");
|
|
// });
|
|
|
|
// test("does not normalize beyond level of contained text nodes 2", () => {
|
|
// const body = p("<b>aaa<b>bbb</b><b>ccc</b></b>");
|
|
// const range = new Range();
|
|
// range.setStartBefore(body.firstChild!.firstChild!);
|
|
// range.setEndAfter(body.firstChild!.childNodes[1].firstChild!);
|
|
|
|
// const { addedNodes, removedNodes } = surround(range, body, easyBold);
|
|
|
|
// expect(body).toHaveProperty("innerHTML", "<b><b>aaabbbccc</b></b>");
|
|
// expect(addedNodes).toHaveLength(1);
|
|
// expect(removedNodes).toHaveLength(2);
|
|
// // expect(surroundedRange.toString()).toEqual("aaabbb"); // is aaabbbccc instead
|
|
// });
|
|
|
|
// test("does normalize beyond level of contained text nodes", () => {
|
|
// const body = p("<b><b>aaa</b><b><b>bbb</b><b>ccc</b></b></b>");
|
|
// const range = new Range();
|
|
// range.setStartBefore(body.firstChild!.childNodes[1].firstChild!.firstChild!);
|
|
// range.setEndAfter(body.firstChild!.childNodes[1].childNodes[1].firstChild!);
|
|
|
|
// const { addedNodes, removedNodes } = surround(range, body, easyBold);
|
|
|
|
// expect(body).toHaveProperty("innerHTML", "<b><b>aaabbbccc</b></b>");
|
|
// expect(addedNodes).toHaveLength(1);
|
|
// expect(removedNodes).toHaveLength(4);
|
|
// // expect(surroundedRange.toString()).toEqual("aaabbb"); // is aaabbbccc instead
|
|
// });
|
|
|
|
// test("does remove even if there is already equivalent surrounding in place", () => {
|
|
// const body = p("<b>before<b><u>nested</u></b>after</b>");
|
|
// const range = new Range();
|
|
// range.selectNode(body.firstChild!.childNodes[1].firstChild!.firstChild!);
|
|
|
|
// const { addedNodes, removedNodes, surroundedRange } = surround(
|
|
// range,
|
|
// body,
|
|
// easyBold,
|
|
// );
|
|
|
|
// expect(addedNodes).toHaveLength(1);
|
|
// expect(removedNodes).toHaveLength(1);
|
|
// expect(body).toHaveProperty(
|
|
// "innerHTML",
|
|
// "<b>before<b><u>nested</u></b>after</b>",
|
|
// );
|
|
// expect(surroundedRange.toString()).toEqual("nested");
|
|
// });
|
|
// });
|