🐛 fix missing meta description preview (#719)

refs #718, refs https://github.com/TryGhost/Ghost/pull/8305

- meta description preview in the PSM was relying on the `html` field which is no longer queried - see #718 and https://github.com/TryGhost/Ghost/pull/8305
- restores live preview that was in LTS but removed whilst implementing mobiledoc because we had no quick way of rendering mobiledoc->text
- adds a boolean argument to the `formatMarkdown` util that can disable the replacement of `<script>` and `<iframe>` tags so that the inserted text isn't rendered when converting HTML to text
This commit is contained in:
Kevin Ansfield 2017-05-30 14:07:12 +01:00 committed by Katharina Irrgang
parent 4a77ac5e86
commit f8f09dab05
3 changed files with 31 additions and 11 deletions

View File

@ -3,6 +3,7 @@ import Ember from 'ember';
import SettingsMenuMixin from 'ghost-admin/mixins/settings-menu-component';
import boundOneWay from 'ghost-admin/utils/bound-one-way';
import computed, {alias} from 'ember-computed';
import formatMarkdown from 'ghost-admin/utils/format-markdown';
import injectService from 'ember-service/inject';
import isNumber from 'ghost-admin/utils/isNumber';
import moment from 'moment';
@ -70,17 +71,20 @@ export default Component.extend(SettingsMenuMixin, {
return metaTitle;
}),
seoDescription: computed('model.html', 'metaDescriptionScratch', function () {
seoDescription: computed('model.scratch', 'metaDescriptionScratch', function () {
let metaDescription = this.get('metaDescriptionScratch') || '';
let mobiledoc = this.get('model.scratch');
let markdown = mobiledoc.cards && mobiledoc.cards[0][1].markdown;
let placeholder;
if (metaDescription.length > 0) {
placeholder = metaDescription;
} else {
let html = this.get('model.html');
let div = document.createElement('div');
div.innerHTML = formatMarkdown(markdown, false);
// Strip HTML
placeholder = this.$('<div />', {html}).text();
placeholder = div.textContent;
// Replace new lines and trim
placeholder = placeholder.replace(/\n+/g, ' ').trim();
}

View File

@ -27,7 +27,7 @@ let md = markdownit({
}
});
export default function formatMarkdown(_markdown) {
export default function formatMarkdown(_markdown, replaceJS = true) {
let markdown = _markdown || '';
let escapedhtml = '';
@ -35,10 +35,12 @@ export default function formatMarkdown(_markdown) {
escapedhtml = md.render(markdown);
// replace script and iFrame
escapedhtml = escapedhtml.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi,
'<pre class="js-embed-placeholder">Embedded JavaScript</pre>');
escapedhtml = escapedhtml.replace(/<iframe\b[^<]*(?:(?!<\/iframe>)<[^<]*)*<\/iframe>/gi,
'<pre class="iframe-embed-placeholder">Embedded iFrame</pre>');
if (replaceJS) {
escapedhtml = escapedhtml.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi,
'<pre class="js-embed-placeholder">Embedded JavaScript</pre>');
escapedhtml = escapedhtml.replace(/<iframe\b[^<]*(?:(?!<\/iframe>)<[^<]*)*<\/iframe>/gi,
'<pre class="iframe-embed-placeholder">Embedded iFrame</pre>');
}
// sanitize html
escapedhtml = html_sanitize(escapedhtml, cajaSanitizers.url, cajaSanitizers.id);

View File

@ -196,9 +196,23 @@ describe.skip('Unit: Component: post-settings-menu', function () {
expect(component.get('seoDescription')).to.equal('a description');
});
it.skip('should be generated from the rendered markdown if not explicitly set', function () {
// can't test right now because the rendered markdown is being pulled
// from the DOM via jquery
it('should be generated from the rendered mobiledoc if not explicitly set', function () {
let component = this.subject({
model: EmberObject.extend({
author: RSVP.resolve(),
metaDescription: null,
metaDescriptionScratch: boundOneWay('metaDescription'),
scratch: {
cards: [
['markdown-card', {
markdown: '# This is a <strong>test</strong> <script>foo</script>'
}]
]
}
}).create()
});
expect(component.get('seoDescription')).to.equal('This is a test');
});
it('should truncate to 156 characters with an appended ellipsis', function () {