mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-04-01 02:41:39 -05:00
🐛 Fixed lack of space in excerpt generated from paragraphs
closes #10531 - Adds space when encountering closing </p> and <br> tags - The mobiledoc-to-html conversion produces these tags in this exact syntax, so there is no need to account for more cases like additional spaces or alternative syntax like <br /> - Added test cases that cover spacing use-casei - Changed some existing tests to contain more close-to-real-world markup - The downside of this approach is generating multiple spaces in case there are empty paragraphs in the markup. The same concern is true for current "new line" substitution: > excerpt.replace(/(\r\n|\n|\r)+/gm, ' ') but it never has been a concern as in real world when multiple spaces are used inside of the `<p>` tag they are rendered as single space.
This commit is contained in:
parent
9ea2f5b445
commit
16c3785b52
3 changed files with 60 additions and 6 deletions
|
@ -5,6 +5,10 @@ function getExcerpt(html, truncateOptions) {
|
|||
// Strip inline and bottom footnotes
|
||||
var excerpt = html.replace(/<a href="#fn.*?rel="footnote">.*?<\/a>/gi, '');
|
||||
excerpt = excerpt.replace(/<div class="footnotes"><ol>.*?<\/ol><\/div>/, '');
|
||||
|
||||
// Make sure to have space between paragraphs and new lines
|
||||
excerpt = excerpt.replace(/(<\/p>|<br>)/gi, ' ');
|
||||
|
||||
// Strip other html
|
||||
excerpt = excerpt.replace(/<\/?[^>]+>/gi, '');
|
||||
excerpt = excerpt.replace(/(\r\n|\n|\r)+/gm, ' ');
|
||||
|
|
|
@ -5,9 +5,9 @@ describe('getExcerpt', function () {
|
|||
it('should return html excerpt with no html', function () {
|
||||
var html = '<p>There are <br />10<br> types<br/> of people in <img src="a">the world:' +
|
||||
'<img src=b alt="c"> those who <img src="@" onclick="javascript:alert(\'hello\');">' +
|
||||
'understand trinary</p>, those who don\'t <div style="" class=~/\'-,._?!|#>and' +
|
||||
'understand trinary,</p> those who don\'t <div style="" class=~/\'-,._?!|#>and' +
|
||||
'< test > those<<< test >>> who mistake it <for> binary.',
|
||||
expected = 'There are 10 types of people in the world: those who understand trinary, those who ' +
|
||||
expected = 'There are 10 types of people in the world: those who understand trinary, those who ' +
|
||||
'don\'t and those>> who mistake it <for> binary.';
|
||||
|
||||
getExcerpt(html, {}).should.equal(expected);
|
||||
|
@ -61,9 +61,9 @@ describe('getExcerpt', function () {
|
|||
function () {
|
||||
var html = '<p>There are <br />10<br> types<br/> of people in <img src="a">the world:' +
|
||||
'<img src=b alt="c"> those who <img src="@" onclick="javascript:alert(\'hello\');">' +
|
||||
'understand trinary</p>, those who don\'t <div style="" class=~/\'-,._?!|#>and' +
|
||||
'understand trinary,</p> those who don\'t <div style="" class=~/\'-,._?!|#>and' +
|
||||
'< test > those<<< test >>> who mistake it <for> binary.',
|
||||
expected = 'There are 10 types of people in the world: those who understand trinary, those who ' +
|
||||
expected = 'There are 10 types of people in the world: those who understand trinary, those who ' +
|
||||
'don\'t and those>> who mistake it <for> binary.';
|
||||
|
||||
getExcerpt(html).should.equal(expected);
|
||||
|
|
|
@ -29,9 +29,9 @@ describe('{{excerpt}} Helper', function () {
|
|||
it('does not output HTML', function () {
|
||||
var html = '<p>There are <br />10<br> types<br/> of people in <img src="a">the world:' +
|
||||
'<img src=b alt="c"> those who <img src="@" onclick="javascript:alert(\'hello\');">' +
|
||||
'understand trinary</p>, those who don\'t <div style="" class=~/\'-,._?!|#>and' +
|
||||
'understand trinary,</p> those who don\'t <div style="" class=~/\'-,._?!|#>and' +
|
||||
'< test > those<<< test >>> who mistake it <for> binary.',
|
||||
expected = 'There are 10 types of people in the world: those who understand trinary, those who ' +
|
||||
expected = 'There are 10 types of people in the world: those who understand trinary, those who ' +
|
||||
'don\'t and those>> who mistake it <for> binary.',
|
||||
rendered = helpers.excerpt.call({
|
||||
html: html,
|
||||
|
@ -182,4 +182,54 @@ describe('{{excerpt}} Helper', function () {
|
|||
should.exist(rendered);
|
||||
rendered.string.should.equal(expected);
|
||||
});
|
||||
|
||||
it('puts additional space after closing paragraph', function () {
|
||||
var html = '<p>Testing.</p><p>Space before this text.</p><p>And this as well!</p>',
|
||||
expected = 'Testing. Space before this text. And this as well!',
|
||||
rendered = (
|
||||
helpers.excerpt.call(
|
||||
{
|
||||
html: html,
|
||||
custom_excerpt: ''
|
||||
}
|
||||
)
|
||||
);
|
||||
|
||||
should.exist(rendered);
|
||||
rendered.string.should.equal(expected);
|
||||
});
|
||||
|
||||
it('puts additional space instead of <br> tag', function () {
|
||||
var html = '<p>Testing.<br>Space before this text.<br>And this as well!</p>',
|
||||
expected = 'Testing. Space before this text. And this as well!',
|
||||
rendered = (
|
||||
helpers.excerpt.call(
|
||||
{
|
||||
html: html,
|
||||
custom_excerpt: ''
|
||||
}
|
||||
)
|
||||
);
|
||||
|
||||
should.exist(rendered);
|
||||
rendered.string.should.equal(expected);
|
||||
});
|
||||
|
||||
it('puts additional space between paragraph in markup generated by Ghost', function () {
|
||||
var html = '<p>put space in excerpt.</p><p></p><p>before this paragraph.</p>' +
|
||||
'<!--kg-card-begin: image--><figure class="kg-card kg-image-card"><img src="/content/images/2019/08/photo.jpg" class="kg-image"></figure><!--kg-card-end: image-->' +
|
||||
'<p>and skip the image.</p><p></p>',
|
||||
expected = 'put space in excerpt. before this paragraph. and skip the image.',
|
||||
rendered = (
|
||||
helpers.excerpt.call(
|
||||
{
|
||||
html: html,
|
||||
custom_excerpt: ''
|
||||
}
|
||||
)
|
||||
);
|
||||
|
||||
should.exist(rendered);
|
||||
rendered.string.should.equal(expected);
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Add table
Reference in a new issue