Permalink
Browse files

Make original text smilies selectable (closes #2)

* Make smilies a background image of an <abbrev> element with transparent text.
  This leaves the original text in place, so copying and pasting will keep the
  original text smiley
* Updated tests. Now they're probably a bit more fragile than they were, but it
  shouldn't be too bad.
  • Loading branch information...
1 parent f55a571 commit bcdba4a19c6d2bc9a11ca9b470b2c3a825b5233e @emanchado committed Nov 25, 2011
Showing with 314 additions and 246 deletions.
  1. +41 −28 includes/smileyParser.js
  2. +7 −9 test.html
  3. +43 −19 test/lib/htmlComparison.js
  4. +59 −32 test/spec/htmlComparisonSpec.js
  5. +164 −158 test/spec/smileyParserSpec.js
View
69 includes/smileyParser.js
@@ -1,33 +1,46 @@
var SmileyParser = function(smileyTable) { this.init(smileyTable); };
(function ()
{
- this._smileyTable = {};
- this.init = function(smileyTable) {
- this._smileyTable = smileyTable || defaultSmileyTable;
- this._handlers = [];
- for (var smiley in this._smileyTable) {
- if (this._smileyTable.hasOwnProperty(smiley)) {
- var self = this;
- this._handlers.push({pattern: new RegExp('(["a-zA-Z0-9#])?' + smiley, "g"),
- replacement: (function (s) {
- return function(text, lb) {
- if (lb) return document.createTextNode(text);
- var img =
- document.createElement('img');
- img.src = self._smileyTable[s];
- img.alt = img.title =
- text.replace(/&/g, '&amp;').
- replace(/</g, '&lt;').
- replace(/>/g, '&gt;');
- return img;
- };
- })(smiley)});
- }
- }
- };
+ this._smileyTable = {};
+ this.init = function(smileyTable) {
+ /* Returns a function that receives the matched text and the
+ first matched group in the regular expression. The first group
+ is always a fake lookbehind. If there's anything, we should
+ return the text back, without creating any graphical smiley */
+ function replaceFunction(s) {
+ return function(text, lb) {
+ if (lb) return document.createTextNode(text);
+ var smileyInfo = self._smileyTable[s];
+ var smileyDom = document.createElement('abbrev');
+ smileyDom.innerHTML = text.replace(/&/g, '&amp;').
+ replace(/</g, '&lt;').
+ replace(/>/g, '&gt;');
+ var url = "data:image/png;base64," + smileyInfo.imageDataBase64;
+ smileyDom.style.backgroundImage = "url(" + url + ")";
+ if (smileyInfo.height !== undefined)
+ smileyDom.style.height = smileyInfo.height + "px";
+ if (smileyInfo.width !== undefined)
+ smileyDom.style.width = smileyInfo.width + "px";
+ smileyDom.style.display = 'inline-block';
+ smileyDom.style.color = 'transparent';
+ smileyDom.style.overflow = 'hidden';
+ return smileyDom;
+ };
+ }
+ this._smileyTable = smileyTable || defaultSmileyTable;
+ this._handlers = [];
+ for (var smiley in this._smileyTable) {
+ if (this._smileyTable.hasOwnProperty(smiley)) {
+ var self = this;
+ this._handlers.push({pattern: new RegExp('(["a-zA-Z0-9#])?' +
+ smiley, "g"),
+ replacement: replaceFunction(smiley)});
+ }
+ }
+ };
- this.parseSmileys = function(element) {
- replaceTextWithElements(element, {excludedTags: /textarea/,
- handlers: this._handlers});
- };
+ this.parseSmileys = function(element) {
+ replaceTextWithElements(element, {excludedTags: /textarea/,
+ handlers: this._handlers});
+ };
}).call(SmileyParser.prototype);
View
16 test.html
@@ -3,14 +3,6 @@
<head>
<title>Smiley parsing test</title>
<meta charset='utf-8'>
- <script src="includes/defaultSmileyTable.js" />
- <script src="includes/smileyParser.js" />
- <script>
- window.addEventListener('load', function() {
- var myOwnParser = new SmileyParser();
- // alert(myOwnParser.parseSmileys('lol'));
- }, false);
- </script>
</head>
<body style="background-color: #ddd">
<div class="commentContent">o_o O_O O_o o_O / foo fOo food oO Oo oo OO o-o</div>
@@ -21,10 +13,16 @@
<div class="commentContent">&lt;/troll&gt; &lt;/trolling&gt; :-7 / -troll- *troll* troll</div>
<div class="commentContent">^_^ ;) ;-)) :-P ;-P :P ;P :) :-) :))) :( :(((( :-( ;p ;P ;d ;D / ;proper ;Proper ;dice ;Dice</div>
<div class="commentContent">:? :-? :??? :-??? ;'( :'( :'(( :C :-C / :c :-c</div>
- <div class="commentContent">X'D X-D XD x'D x-D xD :D :-D :DDD / :d :-d</div>
+ <div class="commentContent">X'D X-D XD x'D x-D xD :D :-D :DDD :-DDDDDDDDDDDDDDDDDDD / :d :-d</div>
<div class="commentContent">lol LOL лол / LoL lOl trolol trolololo лоласо тролололо трололол</div>
<div class="commentContent"><a href=" lol ">link lol</a></div>
+ <h1>Random test</h1>
+
+<div class="comment">
+ /me doesn't think @ErikRose is a follower on twitter … I can't dm him ;-) See you in the tomorrow with bike shorts on
+</div>
+
<h1>Addons.opera.com comment test</h1>
<div class="comment">
View
62 test/lib/htmlComparison.js
@@ -1,28 +1,52 @@
+function canonicalElementHtml(element) {
+ var result = "<" + element.nodeName.toLowerCase();
+ var attrPairs = [];
+ for (var ai = 0, alen = element.attributes.length; ai < alen; ++ai) {
+ attrPairs.push([ element.attributes[ai].name,
+ element.attributes[ai].value ]);
+ }
+ // Order the attributes
+ var orderedAttrPairs = attrPairs.sort(function(a, b) {
+ if (a[0] === b[0]) return 0;
+ return (a[0] > b[0]) ? 1 : -1;
+ });
+ for (var ai2 = 0, alen2 = orderedAttrPairs.length; ai2 < alen2; ++ai2) {
+ result += " " + orderedAttrPairs[ai2][0] + '="' + orderedAttrPairs[ai2][1] + '"';
+ }
+ if (element.childNodes.length > 0) {
+ result += ">";
+ result += canonicalHtml(element) +
+ "</" + element.nodeName.toLowerCase() + ">";
+ } else {
+ result += " />";
+ }
+ return result;
+}
+
+
+function canonicalSmiley(element) {
+ console.log(element.textContent);
+ return "<smiley url=\"" + element.style.backgroundImage + "\"" +
+ ((element.style.height !== undefined) ?
+ " height=\"" + element.style.height + "\"" : "") +
+ ((element.style.width !== undefined) ?
+ " width=\"" + element.style.width + "\"" : "") +
+ ">" + element.textContent.replace(/&/g, '&amp;').
+ replace(/</g, '&lt;').
+ replace(/>/g, '&gt;') +
+ "</smiley>";
+}
+
+
function canonicalHtml(element) {
var result = "";
var cn = element.childNodes;
for (var i = 0, len = cn.length; i < len; ++i) {
if (cn[i] instanceof Element) {
- result += "<" + cn[i].nodeName.toLowerCase();
- var attrPairs = [];
- for (var ai = 0, alen = cn[i].attributes.length; ai < alen; ++ai) {
- attrPairs.push([ cn[i].attributes[ai].name,
- cn[i].attributes[ai].value ]);
- }
- // Order the attributes
- var orderedAttrPairs = attrPairs.sort(function(a, b) {
- if (a[0] === b[0]) return 0;
- return (a[0] > b[0]) ? 1 : -1;
- });
- for (var ai2 = 0, alen2 = orderedAttrPairs.length; ai2 < alen2; ++ai2) {
- result += " " + orderedAttrPairs[ai2][0] + '="' + orderedAttrPairs[ai2][1] + '"';
- }
- if (cn[i].childNodes.length > 0) {
- result += ">";
- result += canonicalHtml(cn[i]) +
- "</" + cn[i].nodeName.toLowerCase() + ">";
+ if (cn[i].nodeName.toLowerCase() === 'abbrev') {
+ result += canonicalSmiley(cn[i]);
} else {
- result += " />";
+ result += canonicalElementHtml(cn[i]);
}
} else {
result += cn[i].nodeValue.replace(/&/g, '&amp;').
View
91 test/spec/htmlComparisonSpec.js
@@ -1,41 +1,68 @@
+function isHtmlEquivalent(one, two) {
+ var domElement = document.createElement('div');
+ var domElement2 = document.createElement('div');
+ domElement.innerHTML = one;
+ domElement2.innerHTML = two;
+ return canonicalHtml(domElement) === canonicalHtml(domElement2);
+}
+
describe("canonicalHtml", function() {
- var domElement;
+ beforeEach(function() {
+ this.addMatchers({
+ toBeCanonically: function(expected) {
+ return isHtmlEquivalent(this.actual, expected);
+ },
+ toNotBeCanonically: function(expected) {
+ return ! isHtmlEquivalent(this.actual, expected);
+ }
+ });
+ });
- beforeEach(function() {
- domElement = document.createElement('div');
+ it("should return the same string when there isn't any markup", function() {
+ var someString = "Some string without any markup";
+ expect(someString).toBeCanonically(someString);
+ });
- this.addMatchers({
- toBeCanonically: function(expected) {
- domElement.innerHTML = this.actual;
- return this.env.equals_(canonicalHtml(domElement), expected);
- }
- });
- });
+ it("should return the same string when there are simple elements", function() {
+ var someString = "Some string with <strong>some</strong> markup";
+ expect(someString).toBeCanonically(someString);
+ });
- it("should return the same string when there isn't any markup", function() {
- var someString = "Some string without any markup";
- expect(someString).toBeCanonically(someString);
- });
+ it("should return attributes in alphabetical order", function() {
+ var source = 'Some <a title="foo" href="http://example.com">link</a>';
+ var expected = 'Some <a href="http://example.com" title="foo">link</a>';
+ expect(source).toBeCanonically(expected);
+ });
- it("should return the same string when there are simple elements", function() {
- var someString = "Some string with <strong>some</strong> markup";
- expect(someString).toBeCanonically(someString);
- });
+ it("should return self-closing tags correctly", function() {
+ var source = 'An <img src="image.png">';
+ var expected = 'An <img src="image.png" />';
+ expect(source).toBeCanonically(expected);
+ });
- it("should return attributes in alphabetical order", function() {
- var source = 'Some <a title="foo" href="http://example.com">link</a>';
- var expected = 'Some <a href="http://example.com" title="foo">link</a>';
- expect(source).toBeCanonically(expected);
- });
+ it("should return HTML entities correctly", function() {
+ var source = 'A Smith &amp; Wesson weapon';
+ expect(source).toBeCanonically(source);
+ });
- it("should return self-closing tags correctly", function() {
- var source = 'An <img src="image.png">';
- var expected = 'An <img src="image.png" />';
- expect(source).toBeCanonically(expected);
- });
+ it("should recognise a simple smiley correctly", function() {
+ var source1 = 'A smiley: <abbrev style="background-image: url(foo.png); width: 30px; height: 25px">some text</abbrev>';
+ var source2 = 'A smiley: <abbrev style="background-image: url(foo.png); height: 25px; width: 30px">some text</abbrev>';
+ var source3 = 'A smiley: <abbrev style="background-image: url(foo.png); height: 25px; width: 30px">some other text</abbrev>';
+ expect(source1).toBeCanonically(source2);
+ expect(source1).toNotBeCanonically(source3);
+ expect(source2).toNotBeCanonically(source3);
+ });
- it("should return HTML entities correctly", function() {
- var source = 'A Smith &amp; Wesson weapon';
- expect(source).toBeCanonically(source);
- });
+ it("should recognise a smiley w/ extra properties as different", function() {
+ var source1 = 'A smiley: <abbrev style="background-image: url(foo.png); width: 30px">some text</abbrev>';
+ var source2 = 'A smiley: <abbrev style="background-image: url(foo.png); width: 30px; height: 25px">some text</abbrev>';
+ expect(source1).toNotBeCanonically(source2);
+ });
+
+ it("should recognise a smiley w/ angle brackets", function() {
+ var source1 = 'A smiley: <abbrev style="background-image: url(foo.png); height: 25px; width: 30px">&lt;/troll&gt;</abbrev>';
+ var source2 = 'A smiley: <abbrev style="background-image: url(foo.png); width: 30px; height: 25px">&lt;/troll&gt;</abbrev>';
+ expect(source1).toBeCanonically(source2);
+ });
});
View
322 test/spec/smileyParserSpec.js
@@ -1,173 +1,179 @@
+function smileyMarkup(text, url) {
+ return "<abbrev style=\"background-image: url(data:image/png;base64," +
+ url + ")\">" + text + "</abbrev>";
+}
+
+
describe("SmileyParser", function() {
- var parser, domElement;
-
- beforeEach(function() {
- parser = new SmileyParser({"\\bxD+\\b": "lol.png",
- ":-?\\)": "smile.png"});
- domElement = document.createElement('div');
-
- this.addMatchers({
- toParseTo: function(expected, p) {
- if (p === undefined)
- p = parser;
- domElement.innerHTML = this.actual;
- p.parseSmileys(domElement);
- return this.env.equals_(canonicalHtml(domElement), expected);
- }
- });
- });
+ var parser, domElement, domElement2;
- it("should return the same string when there aren't any smileys", function() {
- var someString = "Some string without any smileys";
- expect(someString).toParseTo(someString);
- });
+ beforeEach(function() {
+ parser = new SmileyParser({"\\bxD+\\b": {imageDataBase64: "lol"},
+ ":-?\\)": {imageDataBase64: "smile"}});
+ domElement = document.createElement('div');
+ domElement2 = document.createElement('div');
- it("should not be confused with text that looks like a smiley", function() {
- var someString = "FedEx or FexDex?";
- expect(someString).toParseTo(someString);
+ this.addMatchers({
+ toParseTo: function(expected, p) {
+ if (p === undefined)
+ p = parser;
+ domElement.innerHTML = this.actual;
+ domElement2.innerHTML = expected;
+ p.parseSmileys(domElement);
+ console.log('Initially it\'s ' + domElement.innerHTML + ', to be compared to ', expected);
+ console.log('Expected to parse to ' + canonicalHtml(domElement2) + ', was ', canonicalHtml(domElement));
+ return this.env.equals_(canonicalHtml(domElement), canonicalHtml(domElement2));
+ }
});
+ });
- it("should replace simple smileys", function() {
- var source = "I LOLed xD";
- var expected = "I LOLed <img alt=\"xD\" src=\"lol.png\" " +
- "title=\"xD\" />";
- expect(source).toParseTo(expected);
- });
+ it("should return the same string when there aren't any smileys", function() {
+ var someString = "Some string without any smileys";
+ expect(someString).toParseTo(someString);
+ });
- it("should allow smileys to be configured", function() {
- var myParser = new SmileyParser({":-?\\(": "frown.png"});
- var source = "I didn't LOL (xD) :-(";
- var expectedStandard = "I didn't LOL (<img alt=\"xD\" " +
- "src=\"lol.png\" title=\"xD\" />) :-(";
- var expectedConfigured = "I didn't LOL (xD) <img alt=\":-(\" " +
- "src=\"frown.png\" title=\":-(\" />";
- expect(source).toParseTo(expectedStandard);
- expect(source).toParseTo(expectedConfigured, myParser);
- });
+ it("should not be confused with text that looks like a smiley", function() {
+ var someString = "FedEx or FexDex?";
+ expect(someString).toParseTo(someString);
+ });
- it("should replace many smileys", function() {
- var source = "I LOLed xD :-) xDD";
- var expected = "I LOLed <img alt=\"xD\" src=\"lol.png\" " +
- "title=\"xD\" /> " +
- "<img alt=\":-)\" src=\"smile.png\" title=\":-)\" /> " +
- "<img alt=\"xDD\" src=\"lol.png\" title=\"xDD\" />";
- expect(source).toParseTo(expected);
- });
+ it("should replace simple smileys", function() {
+ var source = "I LOLed xD";
+ var expected = "I LOLed " + smileyMarkup("xD", "lol");
+ expect(source).toParseTo(expected);
+ });
- it("should be idempotent", function() {
- var source = "I LOLed xD :-) xDD";
- var expected = "I LOLed <img alt=\"xD\" src=\"lol.png\" " +
- "title=\"xD\" /> " +
- "<img alt=\":-)\" src=\"smile.png\" title=\":-)\" /> " +
- "<img alt=\"xDD\" src=\"lol.png\" title=\"xDD\" />";
- var tmpDiv = document.createElement('div');
- tmpDiv.innerHTML = source;
- parser.parseSmileys(tmpDiv);
- var actualOnePass = tmpDiv.innerHTML;
- expect(source).toParseTo(expected);
- expect(actualOnePass).toParseTo(expected);
- });
+ it("should allow smileys to be configured", function() {
+ var myParser = new SmileyParser({":-?\\(": {imageDataBase64: "frown"}});
+ var source = "I didn't LOL (xD) :-(";
+ var expectedStandard = "I didn't LOL (" + smileyMarkup("xD", "lol") +
+ ") :-(";
+ var expectedConfigured = "I didn't LOL (xD) " +
+ smileyMarkup(":-(", "frown");
+ expect(source).toParseTo(expectedStandard);
+ expect(source).toParseTo(expectedConfigured, myParser);
+ });
- it("should play well with ;))", function() {
- var winkParser = new SmileyParser({"\\bxD+\\b": "lol.png",
- ";-?\\)+": "wink.png"});
- var source = "Jajaja si, puede ser una solución, pero admito mas ideas... ;))";
- var expected = "Jajaja si, puede ser una solución, pero admito mas ideas... <img alt=\";))\" src=\"wink.png\" " +
- "title=\";))\" />";
- var tmpDiv = document.createElement('div');
- tmpDiv.innerHTML = source;
- winkParser.parseSmileys(tmpDiv);
- var actualOnePass = tmpDiv.innerHTML;
- expect(source).toParseTo(expected, winkParser);
- expect(actualOnePass).toParseTo(expected, winkParser);
- });
+ it("should replace many smileys", function() {
+ var source = "I LOLed xD :-) xDD";
+ var expected = "I LOLed " + smileyMarkup("xD", "lol") + " " +
+ smileyMarkup(":-)", "smile") + " " +
+ smileyMarkup("xDD", "lol");
+ expect(source).toParseTo(expected);
+ });
- it("should play well with character repetitions", function() {
- var winkParser = new SmileyParser({
- ":-?\\)+": 'imgHappy.png',
- ":-?\\(\\(+": 'imgOhNo.png',
- "[:;]-?P+\\b": 'imgLick.png',
- "[:;]'\\(+": 'imgCry.png',
- ";-?\\)+": 'imgWink.png',
- ":-?D+\\b": 'imgSoMuchWin.png',
- "[xX][-']?D+\\b": 'imgGrin.png',
- ":-/+": 'imgErr.png',
- ":-?\\?+": 'imgHmmm.png',
- "\\^_\\^": 'imgCyoot.png',
- "\\b[oO]_[oO]\\b": 'imgStareDad.png',
- "\\b[fF]+[uU][uU]+\\b": 'imgFuu.png',
- "\\bY U NO\\b": 'imgYUNo.png',
- "\\bfap fap( fap)+\\b": 'imgFap.png',
- "-troll-": 'imgTroll.png'});
- var source = "FFUUUU :-((( :))) ;'(( ;-)) xDDD ffuuu";
- var expected = "<img alt=\"FFUUUU\" src=\"imgFuu.png\" " +
- "title=\"FFUUUU\" /> <img alt=\":-(((\" src=\"imgOhNo.png\" " +
- "title=\":-(((\" /> <img alt=\":)))\" src=\"imgHappy.png\" " +
- "title=\":)))\" /> <img alt=\";'((\" src=\"imgCry.png\" " +
- "title=\";'((\" /> <img alt=\";-))\" src=\"imgWink.png\" " +
- "title=\";-))\" /> <img alt=\"xDDD\" src=\"imgGrin.png\" " +
- "title=\"xDDD\" /> <img alt=\"ffuuu\" src=\"imgFuu.png\" " +
- "title=\"ffuuu\" />";
- var tmpDiv = document.createElement('div');
- tmpDiv.innerHTML = source;
- winkParser.parseSmileys(tmpDiv);
- var actualOnePass = tmpDiv.innerHTML;
- expect(source).toParseTo(expected, winkParser);
- expect(actualOnePass).toParseTo(expected, winkParser);
- });
+ it("should be idempotent", function() {
+ var source = "I LOLed xD :-) xDD";
+ var expected = "I LOLed " + smileyMarkup("xD", "lol") + " " +
+ smileyMarkup(":-)", "smile") + " " +
+ smileyMarkup("xDD", "lol");
+ var tmpDiv = document.createElement('div');
+ tmpDiv.innerHTML = source;
+ parser.parseSmileys(tmpDiv);
+ var actualOnePass = tmpDiv.innerHTML;
+ expect(source).toParseTo(expected);
+ expect(actualOnePass).toParseTo(expected);
+ });
- it("should play well with word repetitions", function() {
- var winkParser = new SmileyParser({"\\bfap fap( fap)+\\b":
- 'imgFap.png'});
- var source = "fap fap fap mumble mumble fap fap fap fap";
- var expected = "<img alt=\"fap fap fap\" src=\"imgFap.png\" " +
- "title=\"fap fap fap\" /> mumble mumble " +
- "<img alt=\"fap fap fap fap\" src=\"imgFap.png\" " +
- "title=\"fap fap fap fap\" />";
- var tmpDiv = document.createElement('div');
- tmpDiv.innerHTML = source;
- winkParser.parseSmileys(tmpDiv);
- var actualOnePass = tmpDiv.innerHTML;
- expect(source).toParseTo(expected, winkParser);
- expect(actualOnePass).toParseTo(expected, winkParser);
- });
+ it("should play well with ;))", function() {
+ var winkParser = new SmileyParser({"\\bxD+\\b": {imageDataBase64: "lol"},
+ ";-?\\)+": {imageDataBase64: "wink"}});
+ var source = "Jajaja si, puede ser una solución, pero admito mas ideas... ;))";
+ var expected =
+ "Jajaja si, puede ser una solución, pero admito mas ideas... " +
+ smileyMarkup(";))", "wink");
+ var tmpDiv = document.createElement('div');
+ tmpDiv.innerHTML = source;
+ winkParser.parseSmileys(tmpDiv);
+ var actualOnePass = tmpDiv.innerHTML;
+ expect(source).toParseTo(expected, winkParser);
+ expect(actualOnePass).toParseTo(expected, winkParser);
+ });
- it("should be a bit more picky when detecting smilies", function() {
- var myParser = new SmileyParser({"[:;]-?P+\\b": 'wink.png',
- ":-?C": 'frown.png',
- "\\blol\\b|\\bLOL\\b": 'lol.png'});
- var source1 = "Newsflash:Catastrophic day for S&amp;P's #lol";
- expect(source1).toParseTo(source1, myParser);
- var source2 = "Smilies: :C ;P lol";
- var expected2 = "Smilies: <img alt=\":C\" src=\"frown.png\" " +
- "title=\":C\" /> <img alt=\";P\" src=\"wink.png\" " +
- "title=\";P\" /> <img alt=\"lol\" src=\"lol.png\" " +
- "title=\"lol\" />";
- expect(source2).toParseTo(expected2, myParser);
- });
+ it("should play well with character repetitions", function() {
+ var winkParser = new SmileyParser({
+ ":-?\\)+": {imageDataBase64: 'imgHappy'},
+ ":-?\\(\\(+": {imageDataBase64: 'imgOhNo'},
+ "[:;]-?P+\\b": {imageDataBase64: 'imgLick'},
+ "[:;]'\\(+": {imageDataBase64: 'imgCry'},
+ ";-?\\)+": {imageDataBase64: 'imgWink'},
+ ":-?D+\\b": {imageDataBase64: 'imgSoMuchWin'},
+ "[xX][-']?D+\\b": {imageDataBase64: 'imgGrin'},
+ ":-/+": {imageDataBase64: 'imgErr'},
+ ":-?\\?+": {imageDataBase64: 'imgHmmm'},
+ "\\^_\\^": {imageDataBase64: 'imgCyoot'},
+ "\\b[oO]_[oO]\\b": {imageDataBase64: 'imgStareDad'},
+ "\\b[fF]+[uU][uU]+\\b": {imageDataBase64: 'imgFuu'},
+ "\\bY U NO\\b": {imageDataBase64: 'imgYUNo'},
+ "\\bfap fap( fap)+\\b": {imageDataBase64: 'imgFap'},
+ "-troll-": {imageDataBase64: 'imgTroll'}});
+ var source = "FFUUUU :-((( :))) ;'(( ;-)) xDDD ffuuu";
+ var expected = smileyMarkup("FFUUUU", "imgFuu") + " " +
+ smileyMarkup(":-(((", "imgOhNo") + " " +
+ smileyMarkup(":)))", "imgHappy") + " " +
+ smileyMarkup(";'((", "imgCry") + " " +
+ smileyMarkup(";-))", "imgWink") + " " +
+ smileyMarkup("xDDD", "imgGrin") + " " +
+ smileyMarkup("ffuuu", "imgFuu");
+ var tmpDiv = document.createElement('div');
+ tmpDiv.innerHTML = source;
+ winkParser.parseSmileys(tmpDiv);
+ var actualOnePass = tmpDiv.innerHTML;
+ expect(source).toParseTo(expected, winkParser);
+ expect(actualOnePass).toParseTo(expected, winkParser);
+ });
- it("should detect smilies at the start of the string", function() {
- var myParser = new SmileyParser({"[:;]-?P+\\b": 'wink.png',
- ":-?C": 'frown.png',
- "\\blol\\b|\\bLOL\\b": 'lol.png'});
- var source2 = ":C";
- var source3 = ";P";
- var source4 = "lol";
- var expected2 = "<img alt=\":C\" src=\"frown.png\" title=\":C\" />";
- var expected3 = "<img alt=\";P\" src=\"wink.png\" title=\";P\" />";
- var expected4 = "<img alt=\"lol\" src=\"lol.png\" title=\"lol\" />";
- expect(source2).toParseTo(expected2, myParser);
- expect(source3).toParseTo(expected3, myParser);
- expect(source4).toParseTo(expected4, myParser);
- });
+ it("should play well with word repetitions", function() {
+ var winkParser = new SmileyParser({"\\bfap fap( fap)+\\b":
+ {imageDataBase64: 'imgFap'}});
+ var source = "fap fap fap mumble mumble fap fap fap fap";
+ var expected = smileyMarkup("fap fap fap", "imgFap") +
+ " mumble mumble " +
+ smileyMarkup("fap fap fap fap", "imgFap");
+ var tmpDiv = document.createElement('div');
+ tmpDiv.innerHTML = source;
+ winkParser.parseSmileys(tmpDiv);
+ var actualOnePass = tmpDiv.innerHTML;
+ expect(source).toParseTo(expected, winkParser);
+ expect(actualOnePass).toParseTo(expected, winkParser);
+ });
- it("should detect smilies with angle brackets", function() {
- var myParser = new SmileyParser({"</troll(ing)?>": 'troll.png'});
- var source = "&lt;/troll&gt; &lt;/trolling&gt;";
- var expected = "<img alt=\"&lt;/troll&gt;\" src=\"troll.png\" "
- + "title=\"&lt;/troll&gt;\" /> "
- + "<img alt=\"&lt;/trolling&gt;\" src=\"troll.png\" "
- + "title=\"&lt;/trolling&gt;\" />";
- expect(source).toParseTo(expected, myParser);
- });
+ it("should be a bit more picky when detecting smilies", function() {
+ var myParser = new SmileyParser(
+ {"[:;]-?P+\\b": {imageDataBase64: 'wink'},
+ ":-?C": {imageDataBase64: 'frown'},
+ "\\blol\\b|\\bLOL\\b": {imageDataBase64: 'lol'}});
+ var source1 = "Newsflash:Catastrophic day for S&amp;P's #lol";
+ expect(source1).toParseTo(source1, myParser);
+ var source2 = "Smilies: :C ;P lol";
+ var expected2 = "Smilies: " + smileyMarkup(":C", "frown") + " " +
+ smileyMarkup(";P", "wink") + " " +
+ smileyMarkup("lol", "lol");
+ expect(source2).toParseTo(expected2, myParser);
+ });
+
+ it("should detect smilies at the start of the string", function() {
+ var myParser = new SmileyParser(
+ {"[:;]-?P+\\b": {imageDataBase64: 'wink'},
+ ":-?C": {imageDataBase64: 'frown'},
+ "\\blol\\b|\\bLOL\\b": {imageDataBase64: 'lol'}});
+ var source2 = ":C";
+ var source3 = ";P";
+ var source4 = "lol";
+ var expected2 = smileyMarkup(":C", "frown");
+ var expected3 = smileyMarkup(";P", "wink");
+ var expected4 = smileyMarkup("lol", "lol");
+ expect(source2).toParseTo(expected2, myParser);
+ expect(source3).toParseTo(expected3, myParser);
+ expect(source4).toParseTo(expected4, myParser);
+ });
+
+ it("should detect smilies with angle brackets", function() {
+ var myParser = new SmileyParser(
+ {"</troll(ing)?>": {imageDataBase64: 'troll'}});
+ var source = "&lt;/troll&gt; &lt;/trolling&gt;";
+ var expected = smileyMarkup("&lt;/troll&gt;", "troll") + " " +
+ smileyMarkup("&lt;/trolling&gt;", "troll");
+ expect(source).toParseTo(expected, myParser);
+ });
});

0 comments on commit bcdba4a

Please sign in to comment.