From 591d653b36c48aa6b3fd08751fed9e7b5ad48507 Mon Sep 17 00:00:00 2001
From: Hannah Wolfe <erisds@gmail.com>
Date: Thu, 4 Dec 2014 13:33:30 +0000
Subject: [PATCH] Strip footnotes from excerpts

fixes #4572

- Remove both inline and bottom footnotes from excerpt output before stripping the remaining HTML
- No more red errors, black text or bold links in codemirror, as codemirror gets confused by footnote syntax. This is a step towards the new editor which has no syntax highlighting in the editor
---
 core/client/assets/sass/layouts/editor.scss   | 16 ++++++++++++----
 .../client/assets/sass/vendor/codemirror.scss |  8 ++++----
 core/server/helpers/excerpt.js                |  7 ++++++-
 core/test/unit/server_helpers/excerpt_spec.js | 19 +++++++++++++++++++
 4 files changed, 41 insertions(+), 9 deletions(-)

diff --git a/core/client/assets/sass/layouts/editor.scss b/core/client/assets/sass/layouts/editor.scss
index 8f0cf0edc0..e3b1f1978c 100644
--- a/core/client/assets/sass/layouts/editor.scss
+++ b/core/client/assets/sass/layouts/editor.scss
@@ -256,7 +256,7 @@
     }
 
     .cm-header {
-        color: #000;
+        color: #3c4043;
         font-size: 1.4em;
         line-height: 1.4em;
         font-weight: bold;
@@ -268,18 +268,22 @@
         color: lighten($darkgrey, 10%);
     }
 
-    .cm-string,
+
     .cm-strong,
-    .cm-link,
     .cm-comment,
     .cm-quote,
     .cm-number,
     .cm-atom,
     .cm-tag {
-        color: #000;
+        color: #3c4043;
         font-weight: bold;
     }
 
+    .cm-string,
+    .cm-link {
+        color: #3c4043;
+    }
+
     .entry-preview {
         // Align the tab of entry-preview on the right
         .floatingheader {
@@ -370,6 +374,10 @@
         text-decoration: underline;
     }
 
+    sup a {
+        text-decoration: none;
+    }
+
     .btn {
         text-decoration: none;
         color: $grey;
diff --git a/core/client/assets/sass/vendor/codemirror.scss b/core/client/assets/sass/vendor/codemirror.scss
index 5720405aeb..c72b327720 100644
--- a/core/client/assets/sass/vendor/codemirror.scss
+++ b/core/client/assets/sass/vendor/codemirror.scss
@@ -55,16 +55,16 @@
 .cm-s-default .cm-atom {color: #219;}
 .cm-s-default .cm-number {color: #164;}
 .cm-s-default .cm-def {color: #00f;}
-.cm-s-default .cm-variable {color: black;}
+.cm-s-default .cm-variable {color: #3c4043;}
 .cm-s-default .cm-variable-2 {color: #05a;}
 .cm-s-default .cm-variable-3 {color: #085;}
-.cm-s-default .cm-property {color: black;}
-.cm-s-default .cm-operator {color: black;}
+.cm-s-default .cm-property {color: #3c4043;}
+.cm-s-default .cm-operator {color: #3c4043;}
 .cm-s-default .cm-comment {color: #a50;}
 .cm-s-default .cm-string {color: #a11;}
 .cm-s-default .cm-string-2 {color: #f50;}
 .cm-s-default .cm-meta {color: #555;}
-.cm-s-default .cm-error {color: #f00;}
+.cm-s-default .cm-error {color: #3c4043;}
 .cm-s-default .cm-qualifier {color: #555;}
 .cm-s-default .cm-builtin {color: #30a;}
 .cm-s-default .cm-bracket {color: #997;}
diff --git a/core/server/helpers/excerpt.js b/core/server/helpers/excerpt.js
index c3cc8a6a85..020c1a4eb1 100644
--- a/core/server/helpers/excerpt.js
+++ b/core/server/helpers/excerpt.js
@@ -20,7 +20,12 @@ excerpt = function (options) {
     });
 
     /*jslint regexp:true */
-    excerpt = String(this.html).replace(/<\/?[^>]+>/gi, '');
+    excerpt = String(this.html);
+    // Strip inline and bottom footnotes
+    excerpt = excerpt.replace(/<a.*?rel="footnote">.*?<\/a>/gi, '');
+    excerpt = excerpt.replace(/<div class="footnotes"><ol>.*?<\/ol><\/div>/, '');
+    // Strip other html
+    excerpt = excerpt.replace(/<\/?[^>]+>/gi, '');
     excerpt = excerpt.replace(/(\r\n|\n|\r)+/gm, ' ');
     /*jslint regexp:false */
 
diff --git a/core/test/unit/server_helpers/excerpt_spec.js b/core/test/unit/server_helpers/excerpt_spec.js
index 50ac837dea..f3ebd39a74 100644
--- a/core/test/unit/server_helpers/excerpt_spec.js
+++ b/core/test/unit/server_helpers/excerpt_spec.js
@@ -38,6 +38,25 @@ describe('{{excerpt}} Helper', function () {
         rendered.string.should.equal(expected);
     });
 
+    it('strips multiple inline footnotes', function () {
+        var html = '<p>Testing<sup id="fnref:1"><a href="#fn:1" rel="footnote">1</a></sup>, my footnotes. And stuff. Footnote<sup id="fnref:2"><a href="#fn:2" rel="footnote">2</a></sup><a href="http://google.com">with a link</a> right after.',
+            expected = 'Testing, my footnotes. And stuff. Footnotewith a link right after.',
+            rendered = helpers.excerpt.call({html: html});
+
+        should.exist(rendered);
+        rendered.string.should.equal(expected);
+    });
+
+    it('strips inline and bottom footnotes', function () {
+        var html = '<p>Testing<sup id="fnref:1"><a href="#fn:1" rel="footnote">1</a></sup> a very short post with a single footnote.</p>\n' +
+            '<div class="footnotes"><ol><li class="footnote" id="fn:1"><p><a href="https://ghost.org">https://ghost.org</a> <a href="#fnref:1" title="return to article">↩</a></p></li></ol></div>',
+        expected = 'Testing a very short post with a single footnote. ',
+        rendered = helpers.excerpt.call({html: html});
+
+        should.exist(rendered);
+        rendered.string.should.equal(expected);
+    });
+
     it('can truncate html by word', function () {
         var html = '<p>Hello <strong>World! It\'s me!</strong></p>',
             expected = 'Hello World',