Skip to content

Commit

Permalink
Handle a section of tagName "pull-quote"
Browse files Browse the repository at this point in the history
fixes #153
  • Loading branch information
bantic committed Sep 21, 2015
1 parent 0dd2d4c commit 216cd9b
Show file tree
Hide file tree
Showing 4 changed files with 48 additions and 1 deletion.
8 changes: 8 additions & 0 deletions src/js/models/markup-section.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,15 @@ import Markerable from './_markerable';
import { normalizeTagName } from '../utils/dom-utils';
import { MARKUP_SECTION_TYPE } from './types';

// valid values of `tagName` for a MarkupSection
export const VALID_MARKUP_SECTION_TAGNAMES = [
'p', 'h3', 'h2', 'h1', 'blockquote', 'ul', 'ol', 'pull-quote'
].map(normalizeTagName);

// valid element names for a MarkupSection. A MarkupSection with a tagName
// not in this should be rendered as a div with a className matching the
// tagName, instead
export const MARKUP_SECTION_ELEMENT_NAMES = [
'p', 'h3', 'h2', 'h1', 'blockquote', 'ul', 'ol'
].map(normalizeTagName);
export const DEFAULT_TAG_NAME = VALID_MARKUP_SECTION_TAGNAMES[0];
Expand Down
11 changes: 10 additions & 1 deletion src/js/renderers/editor-dom.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import {
} from '../models/types';
import { startsWith, endsWith } from '../utils/string-utils';
import { addClassName } from '../utils/dom-utils';
import { MARKUP_SECTION_ELEMENT_NAMES } from '../models/markup-section';

export const NO_BREAK_SPACE = '\u00A0';
export const SPACE = ' ';
Expand All @@ -36,7 +37,15 @@ function penultimateParentOf(element, parentElement) {
}

function renderMarkupSection(section) {
return document.createElement(section.tagName);
let element;
if (MARKUP_SECTION_ELEMENT_NAMES.indexOf(section.tagName) !== -1) {
element = document.createElement(section.tagName);
} else {
element = document.createElement('div');
addClassName(element, section.tagName);
}

return element;
}

function renderListSection(section) {
Expand Down
14 changes: 14 additions & 0 deletions tests/unit/renderers/editor-dom-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -575,6 +575,20 @@ test('removes nested children of removed render nodes', (assert) => {
'section render node has all children removed');
});

test('renders markup section "pull-quote" as <div class="pull-quote"></div>', (assert) => {
const post = Helpers.postAbstract.build(({post, markupSection, marker}) => {
return post([markupSection('pull-quote', [marker('abc')])]);
});
const renderTree = new RenderTree(post);
render(renderTree);

const expectedDOM = Helpers.dom.build(t => {
return t('div', {"class": "pull-quote"}, [t.text('abc')]);
});

assert.equal(renderTree.rootElement.innerHTML, expectedDOM.outerHTML);
});

/*
test("It renders a renderTree with rendered dirty section", (assert) => {
/*
Expand Down
16 changes: 16 additions & 0 deletions tests/unit/renderers/mobiledoc-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -175,3 +175,19 @@ test('renders a post with a list', (assert) => {
]
});
});

test('renders a pull-quote as markup section', (assert) => {
const post = Helpers.postAbstract.build(({post, markupSection, marker}) => {
return post([markupSection('pull-quote', [marker('abc')])]);
});
const mobiledoc = render(post);
assert.deepEqual(mobiledoc, {
version: MOBILEDOC_VERSION,
sections: [
[],
[
[1, 'pull-quote', [[[], 0, 'abc']]]
]
]
});
});

0 comments on commit 216cd9b

Please sign in to comment.