diff --git a/examples/emojis/Readme.md b/examples/emojis/Readme.md new file mode 100644 index 000000000..d7cb44cda --- /dev/null +++ b/examples/emojis/Readme.md @@ -0,0 +1,8 @@ + +# Emojis Example + +![](../../docs/images/links-example.png) + +This example shows you how you can insert inline void nodes. This is how you'd add emojis or inline images to Slate. + +Check out the [Examples readme](..) to see how to run it! diff --git a/examples/emojis/index.js b/examples/emojis/index.js new file mode 100644 index 000000000..d8bd40fd2 --- /dev/null +++ b/examples/emojis/index.js @@ -0,0 +1,144 @@ + +import { Editor, Mark, Raw } from '../..' +import React from 'react' +import ReactDOM from 'react-dom' +import initialState from './state.json' +import isUrl from 'is-url' +import { Map } from 'immutable' + + +const EMOJIS = [ + '😃', '😬', '🍔' +] + + +/** + * Define a schema. + * + * @type {Object} + */ + +const schema = { + nodes: { + paragraph: props =>

{props.children}

, + emoji: (props) => { + const { state, node } = props + const { data } = node + const code = data.get('code') + const isSelected = state.selection.hasFocusIn(node) + return {code} + } + } +} + +/** + * The links example. + * + * @type {Component} + */ + +class Emojis extends React.Component { + + /** + * Deserialize the raw initial state. + * + * @type {Object} + */ + + state = { + state: Raw.deserialize(initialState, { terse: true }) + }; + + /** + * On change. + * + * @param {State} state + */ + + onChange = (state) => { + this.setState({ state }) + } + + /** + * When clicking a emoji, insert it + * + * @param {Event} e + */ + + onClickEmoji = (e, code) => { + e.preventDefault() + let { state } = this.state + + state = state + .transform() + .insertInline({ + type: 'emoji', + isVoid: true, + data: { code } + }) + .apply() + + this.setState({ state }) + } + + /** + * Render the app. + * + * @return {Element} element + */ + + render = () => { + return ( +
+ {this.renderToolbar()} + {this.renderEditor()} +
+ ) + } + + /** + * Render the toolbar. + * + * @return {Element} element + */ + + renderToolbar = () => { + return ( +
+ {EMOJIS.map((emoji, i) => { + const onMouseDown = e => this.onClickEmoji(e, emoji) + return ( + + {emoji} + + ) + })} +
+ ) + } + + /** + * Render the editor. + * + * @return {Element} element + */ + + renderEditor = () => { + return ( +
+ +
+ ) + } + +} + +/** + * Export. + */ + +export default Emojis diff --git a/examples/emojis/state.json b/examples/emojis/state.json new file mode 100644 index 000000000..0272fc92e --- /dev/null +++ b/examples/emojis/state.json @@ -0,0 +1,50 @@ +{ + "nodes": [ + { + "kind": "block", + "type": "paragraph", + "nodes": [ + { + "kind": "text", + "text": "In addition to block nodes, you can create inline void nodes, like " + }, + { + "kind": "inline", + "type": "emoji", + "isVoid": true, + "data": { + "code": "😃" + } + }, + { + "kind": "text", + "text": "!" + } + ] + }, + { + "kind": "block", + "type": "paragraph", + "nodes": [ + { + "kind": "inline", + "type": "emoji", + "isVoid": true, + "data": { + "code": "🍔" + } + } + ] + }, + { + "kind": "block", + "type": "paragraph", + "nodes": [ + { + "kind": "text", + "text": "This example shows emojis in action." + } + ] + } + ] +} diff --git a/examples/index.css b/examples/index.css index 322123536..ce2ab9406 100644 --- a/examples/index.css +++ b/examples/index.css @@ -165,3 +165,7 @@ input:focus { .hover-menu .button[data-active="true"] { color: #fff; } + +.emoji.selected { + outline: 2px solid blue; +} diff --git a/examples/index.js b/examples/index.js index d617d7219..cb938132b 100644 --- a/examples/index.js +++ b/examples/index.js @@ -10,6 +10,7 @@ import { Router, Route, Link, IndexRedirect, hashHistory } from 'react-router' import AutoMarkdown from './auto-markdown' import CodeHighlighting from './code-highlighting' import Embeds from './embeds' +import Emojis from './emojis' import HoveringMenu from './hovering-menu' import Iframes from './iframes' import Images from './images' @@ -72,6 +73,7 @@ class App extends React.Component { {this.renderTab('Links', 'links')} {this.renderTab('Images', 'images')} {this.renderTab('Embeds', 'embeds')} + {this.renderTab('Emojis', 'emojis')} {this.renderTab('Tables', 'tables')} {this.renderTab('Code Highlighting', 'code-highlighting')} {this.renderTab('Paste HTML', 'paste-html')} @@ -126,6 +128,7 @@ const router = ( + diff --git a/src/components/content.js b/src/components/content.js index eb7b38ba8..f81326af4 100644 --- a/src/components/content.js +++ b/src/components/content.js @@ -691,6 +691,7 @@ class Content extends React.Component { to get the block to have - // the proper height. - if (text == '') return
+ renderText({ parent, text, index, ranges }) { + // COMPAT: If the text is empty and it's the only child, we need to render a + //
to get the block to have the proper height. + if (text == '' && parent.kind == 'block' && parent.text == '') return
+ + // COMPAT: If the text is empty otherwise, it's because it's on the edge of + // an inline void node, so we render a zero-width space so that the + // selection can be inserted next to it still. + if (text == '') return {'\u200B'} // COMPAT: Browsers will collapse trailing new lines at the end of blocks, // so we need to add an extra trailing new lines to prevent that. diff --git a/src/components/node.js b/src/components/node.js index 3a91463ec..e84e2dc81 100644 --- a/src/components/node.js +++ b/src/components/node.js @@ -33,6 +33,7 @@ class Node extends React.Component { static propTypes = { editor: React.PropTypes.object.isRequired, node: React.PropTypes.object.isRequired, + parent: React.PropTypes.object.isRequired, schema: React.PropTypes.object.isRequired, state: React.PropTypes.object.isRequired } @@ -237,6 +238,7 @@ class Node extends React.Component { { - const { editor, node, state } = this.props + const { editor, node, parent, state } = this.props const { Component } = this.state const children = node.nodes .map(child => this.renderNode(child)) @@ -276,6 +278,7 @@ class Node extends React.Component { attributes={attributes} key={node.key} editor={editor} + parent={parent} node={node} state={state} > @@ -325,7 +328,7 @@ class Node extends React.Component { */ renderLeaf = (ranges, range, index, offset) => { - const { node, schema, state } = this.props + const { node, parent, schema, state } = this.props const text = range.text const marks = range.marks @@ -335,6 +338,7 @@ class Node extends React.Component { index={index} marks={marks} node={node} + parent={parent} ranges={ranges} schema={schema} state={state} diff --git a/src/components/void.js b/src/components/void.js index f25cd89f7..a9a1fd250 100644 --- a/src/components/void.js +++ b/src/components/void.js @@ -31,6 +31,7 @@ class Void extends React.Component { children: React.PropTypes.any.isRequired, editor: React.PropTypes.object.isRequired, node: React.PropTypes.object.isRequired, + parent: React.PropTypes.object.isRequired, schema: React.PropTypes.object.isRequired, state: React.PropTypes.object.isRequired, }; @@ -66,7 +67,8 @@ class Void extends React.Component { // Make the outer wrapper relative, so the spacer can overlay it. const style = { - position: 'relative' + position: 'relative', + lineHeight: '0px' } return ( @@ -89,22 +91,12 @@ class Void extends React.Component { */ renderSpacer = () => { - // COMPAT: In Firefox, if the is positioned absolutely, it won't - // receive the cursor properly when navigating via arrow keys. - const style = IS_FIREFOX - ? { - pointerEvents: 'none', - width: '0px', - height: '0px', - lineHeight: '0px', - visibility: 'hidden' - } - : { - position: 'absolute', - top: '0px', - left: '-9999px', - textIndent: '-9999px' - } + const style = { + position: 'relative', + top: '0px', + left: '-9999px', + textIndent: '-9999px', + } return ( {this.renderLeaf()} @@ -137,6 +129,7 @@ class Void extends React.Component { schema={schema} state={state} node={child} + parent={node} ranges={ranges} index={index} text={text} diff --git a/src/models/node.js b/src/models/node.js index 14be69e69..428b70260 100644 --- a/src/models/node.js +++ b/src/models/node.js @@ -1121,6 +1121,37 @@ const Node = { node = node.removeDescendant(key) }) + // Ensure that void nodes are surrounded by text nodes + node = node.mapDescendants((desc) => { + if (desc.kind == 'text') { + return desc + } + + const nodes = desc.nodes.reduce((accu, child, i) => { + // We wrap only inline void nodes + if (!child.isVoid || child.kind === 'block') { + return accu.push(child) + } + + const prev = accu.last() + const next = desc.nodes.get(i + 1) + + if (!prev || prev.kind !== 'text') { + accu = accu.push(Text.create()) + } + + accu = accu.push(child) + + if (!next || next.kind !== 'text') { + accu = accu.push(Text.create()) + } + + return accu + }, List()) + + return desc.merge({ nodes }) + }) + return node }, diff --git a/src/plugins/core.js b/src/plugins/core.js index a76fe049d..d8bbbca79 100644 --- a/src/plugins/core.js +++ b/src/plugins/core.js @@ -188,11 +188,16 @@ function Plugin(options = {}) { const { fragment } = data const encoded = Base64.serializeNode(fragment) + const range = native.getRangeAt(0) + const contents = range.cloneContents() + + // Remove any zero-width space spans from the cloned DOM so that they don't + // show up elsewhere when copied. + const zws = [].slice.call(contents.querySelectorAll('.slate-zero-width-space')) + zws.forEach(zw => zw.parentNode.removeChild(zw)) // Wrap the first character of the selection in a span that has the encoded // fragment attached as an attribute, so it will show up in the copied HTML. - const range = native.getRangeAt(0) - const contents = range.cloneContents() const wrapper = window.document.createElement('span') const text = contents.childNodes[0] const char = text.textContent.slice(0, 1) @@ -328,6 +333,8 @@ function Plugin(options = {}) { case 'enter': return onKeyDownEnter(e, data, state) case 'backspace': return onKeyDownBackspace(e, data, state) case 'delete': return onKeyDownDelete(e, data, state) + case 'left': return onKeyDownLeft(e, data, state) + case 'right': return onKeyDownRight(e, data, state) case 'y': return onKeyDownY(e, data, state) case 'z': return onKeyDownZ(e, data, state) } @@ -450,6 +457,82 @@ function Plugin(options = {}) { .apply() } + /** + * On `left` key down, move backward. + * + * COMPAT: This is required to solve for the case where an inline void node is + * surrounded by empty text nodes with zero-width spaces in them. Without this + * the zero-width spaces will cause two arrow keys to jump to the next text. + * + * @param {Event} e + * @param {Object} data + * @param {State} state + * @return {State} + */ + + function onKeyDownLeft(e, data, state) { + if (data.isCtrl) return + if (data.isOpt) return + if (state.isExpanded) return + + const { document, startText } = state + const hasVoidParent = document.hasVoidParent(startText) + + if ( + startText.text == '' || + hasVoidParent + ) { + const previousText = document.getPreviousText(startText) + if (!previousText) return + + debug('onKeyDownLeft', { data }) + + e.preventDefault() + return state + .transform() + .collapseToEndOf(previousText) + .apply() + } + } + + /** + * On `right` key down, move forward. + * + * COMPAT: This is required to solve for the case where an inline void node is + * surrounded by empty text nodes with zero-width spaces in them. Without this + * the zero-width spaces will cause two arrow keys to jump to the next text. + * + * @param {Event} e + * @param {Object} data + * @param {State} state + * @return {State} + */ + + function onKeyDownRight(e, data, state) { + if (data.isCtrl) return + if (data.isOpt) return + if (state.isExpanded) return + + const { document, startText } = state + const hasVoidParent = document.hasVoidParent(startText) + + if ( + startText.text == '' || + hasVoidParent + ) { + const nextText = document.getNextText(startText) + if (!nextText) return state + + debug('onKeyDownRight', { data }) + + e.preventDefault() + return state + .transform() + .collapseToStartOf(nextText) + .apply() + } + } + /** * On `y` key down, redo. * diff --git a/src/transforms/at-current-range.js b/src/transforms/at-current-range.js index 385b47f35..767247091 100644 --- a/src/transforms/at-current-range.js +++ b/src/transforms/at-current-range.js @@ -117,7 +117,8 @@ export function deleteBackward(transform, n = 1) { if (prevBlock && prevBlock.isVoid) { after = selection } else if (prevInline && prevInline.isVoid) { - after = selection + const prevPrev = document.getPreviousText(previous) + after = selection.collapseToEndOf(prevPrev) } else { after = selection.collapseToEndOf(previous) } @@ -321,7 +322,13 @@ export function insertInline(transform, inline) { } else { - const text = document.getTexts().find(n => !keys.includes(n.key)) + const text = document.getTexts().find((n) => { + if (keys.includes(n.key)) return false + const parent = document.getParent(n) + if (parent.kind != 'inline') return false + return true + }) + after = selection.collapseToEndOf(text) } diff --git a/src/transforms/at-range.js b/src/transforms/at-range.js index a20eb46af..3fec4ecfb 100644 --- a/src/transforms/at-range.js +++ b/src/transforms/at-range.js @@ -195,6 +195,16 @@ export function deleteForwardAtRange(transform, range, n = 1) { if (range.isAtEndOf(text)) { const next = document.getNextText(text) + const nextBlock = document.getClosestBlock(next) + const nextInline = document.getClosestInline(next) + + if (nextBlock && nextBlock.isVoid) { + return transform.removeNodeByKey(nextBlock.key) + } + + if (nextInline && nextInline.isVoid) { + return transform.removeNodeByKey(nextInline.key) + } range = range.merge({ focusKey: next.key, diff --git a/test/rendering/fixtures/custom-block-void/output.html b/test/rendering/fixtures/custom-block-void/output.html index d453359e2..3897dc54f 100644 --- a/test/rendering/fixtures/custom-block-void/output.html +++ b/test/rendering/fixtures/custom-block-void/output.html @@ -1,9 +1,9 @@
-
- +
+ -
+ ​
diff --git a/test/rendering/fixtures/custom-inline-void/index.js b/test/rendering/fixtures/custom-inline-void/index.js new file mode 100644 index 000000000..5e197db44 --- /dev/null +++ b/test/rendering/fixtures/custom-inline-void/index.js @@ -0,0 +1,12 @@ + +import React from 'react' + +function Image(props) { + return +} + +export const schema = { + nodes: { + image: Image + } +} diff --git a/test/transforms/fixtures/at-current-range/insert-inline/with-inline/output.yaml b/test/rendering/fixtures/custom-inline-void/input.yaml similarity index 62% rename from test/transforms/fixtures/at-current-range/insert-inline/with-inline/output.yaml rename to test/rendering/fixtures/custom-inline-void/input.yaml index 3e75f2f14..0b778ab1e 100644 --- a/test/transforms/fixtures/at-current-range/insert-inline/with-inline/output.yaml +++ b/test/rendering/fixtures/custom-inline-void/input.yaml @@ -1,10 +1,8 @@ nodes: - kind: block - type: paragraph + type: default nodes: - kind: inline type: image isVoid: true - - kind: text - text: word diff --git a/test/rendering/fixtures/custom-inline-void/output.html b/test/rendering/fixtures/custom-inline-void/output.html new file mode 100644 index 000000000..029f98e66 --- /dev/null +++ b/test/rendering/fixtures/custom-inline-void/output.html @@ -0,0 +1,25 @@ + +
+
+ + + ​ + + + + + + ​ + + + + + + + + + ​ + + +
+
diff --git a/test/schema/fixtures/default-void-text-around/index.js b/test/schema/fixtures/default-void-text-around/index.js new file mode 100644 index 000000000..9a676e861 --- /dev/null +++ b/test/schema/fixtures/default-void-text-around/index.js @@ -0,0 +1,2 @@ + +export default {} diff --git a/test/schema/fixtures/default-void-text-around/input.yaml b/test/schema/fixtures/default-void-text-around/input.yaml new file mode 100644 index 000000000..5e6317f2e --- /dev/null +++ b/test/schema/fixtures/default-void-text-around/input.yaml @@ -0,0 +1,8 @@ + +nodes: + - kind: block + type: default + nodes: + - kind: inline + isVoid: true + type: image diff --git a/test/schema/fixtures/default-void-text-around/output.yaml b/test/schema/fixtures/default-void-text-around/output.yaml new file mode 100644 index 000000000..32ed911ff --- /dev/null +++ b/test/schema/fixtures/default-void-text-around/output.yaml @@ -0,0 +1,13 @@ + + +nodes: + - kind: block + type: default + nodes: + - kind: text + text: "" + - kind: inline + isVoid: true + type: image + - kind: text + text: "" diff --git a/test/serializers/fixtures/html/deserialize/inline-with-is-void/output.yaml b/test/serializers/fixtures/html/deserialize/inline-with-is-void/output.yaml index 96e7ad63d..491ca8845 100644 --- a/test/serializers/fixtures/html/deserialize/inline-with-is-void/output.yaml +++ b/test/serializers/fixtures/html/deserialize/inline-with-is-void/output.yaml @@ -4,6 +4,7 @@ nodes: isVoid: false data: {} nodes: + - characters: [] - type: link isVoid: true data: {} @@ -11,3 +12,4 @@ nodes: - characters: - text: " " marks: [] + - characters: [] diff --git a/test/serializers/fixtures/raw/deserialize-terse/inline-with-is-void/output.yaml b/test/serializers/fixtures/raw/deserialize-terse/inline-with-is-void/output.yaml index b06ff377b..5889839ee 100644 --- a/test/serializers/fixtures/raw/deserialize-terse/inline-with-is-void/output.yaml +++ b/test/serializers/fixtures/raw/deserialize-terse/inline-with-is-void/output.yaml @@ -4,10 +4,12 @@ nodes: isVoid: false data: {} nodes: - - type: link - isVoid: true - data: {} - nodes: - - characters: - - text: " " - marks: [] + - characters: [] + - type: link + isVoid: true + data: {} + nodes: + - characters: + - text: " " + marks: [] + - characters: [] diff --git a/test/serializers/fixtures/raw/deserialize/inline-with-is-void/output.yaml b/test/serializers/fixtures/raw/deserialize/inline-with-is-void/output.yaml index 96e7ad63d..491ca8845 100644 --- a/test/serializers/fixtures/raw/deserialize/inline-with-is-void/output.yaml +++ b/test/serializers/fixtures/raw/deserialize/inline-with-is-void/output.yaml @@ -4,6 +4,7 @@ nodes: isVoid: false data: {} nodes: + - characters: [] - type: link isVoid: true data: {} @@ -11,3 +12,4 @@ nodes: - characters: - text: " " marks: [] + - characters: [] diff --git a/test/serializers/fixtures/raw/serialize-terse/inline-with-is-void/output.yaml b/test/serializers/fixtures/raw/serialize-terse/inline-with-is-void/output.yaml index 7a85c63e4..cc9ac8b38 100644 --- a/test/serializers/fixtures/raw/serialize-terse/inline-with-is-void/output.yaml +++ b/test/serializers/fixtures/raw/serialize-terse/inline-with-is-void/output.yaml @@ -3,6 +3,10 @@ nodes: - kind: block type: paragraph nodes: + - kind: text + text: "" - kind: inline type: link isVoid: true + - kind: text + text: "" diff --git a/test/serializers/fixtures/raw/serialize/inline-with-is-void/output.yaml b/test/serializers/fixtures/raw/serialize/inline-with-is-void/output.yaml index d1dd09f0f..332307a7b 100644 --- a/test/serializers/fixtures/raw/serialize/inline-with-is-void/output.yaml +++ b/test/serializers/fixtures/raw/serialize/inline-with-is-void/output.yaml @@ -8,6 +8,11 @@ document: data: {} isVoid: false nodes: + - kind: text + ranges: + - kind: range + text: "" + marks: [] - kind: inline type: link isVoid: true @@ -18,3 +23,8 @@ document: - kind: range text: " " marks: [] + - kind: text + ranges: + - kind: range + text: "" + marks: [] diff --git a/test/transforms/fixtures/at-current-range/insert-inline/block-end/index.js b/test/transforms/fixtures/at-current-range/insert-inline/block-end/index.js index 6b17f8dda..d8fea23d9 100644 --- a/test/transforms/fixtures/at-current-range/insert-inline/block-end/index.js +++ b/test/transforms/fixtures/at-current-range/insert-inline/block-end/index.js @@ -21,7 +21,7 @@ export default function (state) { }) .apply() - const updated = next.document.getTexts().last() + const updated = next.document.getTexts().get(1) assert.deepEqual( next.selection.toJS(), diff --git a/test/transforms/fixtures/at-current-range/insert-inline/block-end/output.yaml b/test/transforms/fixtures/at-current-range/insert-inline/block-end/output.yaml index f333e4656..a4b0d95d5 100644 --- a/test/transforms/fixtures/at-current-range/insert-inline/block-end/output.yaml +++ b/test/transforms/fixtures/at-current-range/insert-inline/block-end/output.yaml @@ -8,3 +8,5 @@ nodes: - kind: inline type: hashtag isVoid: true + - kind: text + text: "" diff --git a/test/transforms/fixtures/at-current-range/insert-inline/block-start/index.js b/test/transforms/fixtures/at-current-range/insert-inline/block-start/index.js index 092bcf45b..6cdbdda92 100644 --- a/test/transforms/fixtures/at-current-range/insert-inline/block-start/index.js +++ b/test/transforms/fixtures/at-current-range/insert-inline/block-start/index.js @@ -21,7 +21,7 @@ export default function (state) { }) .apply() - const updated = next.document.getTexts().first() + const updated = next.document.getTexts().get(1) assert.deepEqual( next.selection.toJS(), diff --git a/test/transforms/fixtures/at-current-range/insert-inline/block-start/output.yaml b/test/transforms/fixtures/at-current-range/insert-inline/block-start/output.yaml index b1b784956..3f4c36b87 100644 --- a/test/transforms/fixtures/at-current-range/insert-inline/block-start/output.yaml +++ b/test/transforms/fixtures/at-current-range/insert-inline/block-start/output.yaml @@ -3,6 +3,8 @@ nodes: - kind: block type: paragraph nodes: + - kind: text + text: "" - kind: inline type: hashtag isVoid: true diff --git a/test/transforms/fixtures/at-current-range/insert-inline/inside-inline/index.js b/test/transforms/fixtures/at-current-range/insert-inline/inline-middle/index.js similarity index 100% rename from test/transforms/fixtures/at-current-range/insert-inline/inside-inline/index.js rename to test/transforms/fixtures/at-current-range/insert-inline/inline-middle/index.js diff --git a/test/transforms/fixtures/at-current-range/insert-inline/inside-inline/input.yaml b/test/transforms/fixtures/at-current-range/insert-inline/inline-middle/input.yaml similarity index 100% rename from test/transforms/fixtures/at-current-range/insert-inline/inside-inline/input.yaml rename to test/transforms/fixtures/at-current-range/insert-inline/inline-middle/input.yaml diff --git a/test/transforms/fixtures/at-current-range/insert-inline/inside-inline/output.yaml b/test/transforms/fixtures/at-current-range/insert-inline/inline-middle/output.yaml similarity index 100% rename from test/transforms/fixtures/at-current-range/insert-inline/inside-inline/output.yaml rename to test/transforms/fixtures/at-current-range/insert-inline/inline-middle/output.yaml diff --git a/test/transforms/fixtures/at-current-range/insert-inline/is-empty/index.js b/test/transforms/fixtures/at-current-range/insert-inline/is-empty/index.js index 048799136..6cdbdda92 100644 --- a/test/transforms/fixtures/at-current-range/insert-inline/is-empty/index.js +++ b/test/transforms/fixtures/at-current-range/insert-inline/is-empty/index.js @@ -21,7 +21,7 @@ export default function (state) { }) .apply() - const updated = next.document.getTexts().last() + const updated = next.document.getTexts().get(1) assert.deepEqual( next.selection.toJS(), diff --git a/test/transforms/fixtures/at-current-range/insert-inline/is-empty/output.yaml b/test/transforms/fixtures/at-current-range/insert-inline/is-empty/output.yaml index 936e672db..c06607fe2 100644 --- a/test/transforms/fixtures/at-current-range/insert-inline/is-empty/output.yaml +++ b/test/transforms/fixtures/at-current-range/insert-inline/is-empty/output.yaml @@ -3,6 +3,10 @@ nodes: - kind: block type: paragraph nodes: + - kind: text + text: "" - kind: inline type: hashtag isVoid: true + - kind: text + text: "" diff --git a/test/transforms/fixtures/at-current-range/insert-inline/with-inline/index.js b/test/transforms/fixtures/at-current-range/insert-inline/with-inline/index.js deleted file mode 100644 index afe5bd6e8..000000000 --- a/test/transforms/fixtures/at-current-range/insert-inline/with-inline/index.js +++ /dev/null @@ -1,33 +0,0 @@ - -import { Inline } from '../../../../../..' -import assert from 'assert' - -export default function (state) { - const { document, selection } = state - const texts = document.getTexts() - const first = texts.first() - const range = selection.merge({ - anchorKey: first.key, - anchorOffset: 0, - focusKey: first.key, - focusOffset: 0 - }) - - const next = state - .transform() - .moveTo(range) - .insertInline(Inline.create({ - type: 'image', - isVoid: true - })) - .apply() - - const updated = next.document.getTexts().first() - - assert.deepEqual( - next.selection.toJS(), - range.collapseToEndOf(updated).toJS() - ) - - return next -} diff --git a/test/transforms/fixtures/at-current-range/insert-inline/with-inline/input.yaml b/test/transforms/fixtures/at-current-range/insert-inline/with-inline/input.yaml deleted file mode 100644 index 27f668fe2..000000000 --- a/test/transforms/fixtures/at-current-range/insert-inline/with-inline/input.yaml +++ /dev/null @@ -1,7 +0,0 @@ - -nodes: - - kind: block - type: paragraph - nodes: - - kind: text - text: word diff --git a/test/transforms/fixtures/at-current-range/set-inline/with-is-void/output.yaml b/test/transforms/fixtures/at-current-range/set-inline/with-is-void/output.yaml index 07e15441b..057979d81 100644 --- a/test/transforms/fixtures/at-current-range/set-inline/with-is-void/output.yaml +++ b/test/transforms/fixtures/at-current-range/set-inline/with-is-void/output.yaml @@ -3,6 +3,10 @@ nodes: - kind: block type: paragraph nodes: + - kind: text + text: "" - kind: inline type: emoji isVoid: true + - kind: text + text: "" diff --git a/test/transforms/fixtures/at-range/insert-inline-at-range/block-end/output.yaml b/test/transforms/fixtures/at-range/insert-inline-at-range/block-end/output.yaml index f333e4656..a4b0d95d5 100644 --- a/test/transforms/fixtures/at-range/insert-inline-at-range/block-end/output.yaml +++ b/test/transforms/fixtures/at-range/insert-inline-at-range/block-end/output.yaml @@ -8,3 +8,5 @@ nodes: - kind: inline type: hashtag isVoid: true + - kind: text + text: "" diff --git a/test/transforms/fixtures/at-range/insert-inline-at-range/block-start/output.yaml b/test/transforms/fixtures/at-range/insert-inline-at-range/block-start/output.yaml index b1b784956..3f4c36b87 100644 --- a/test/transforms/fixtures/at-range/insert-inline-at-range/block-start/output.yaml +++ b/test/transforms/fixtures/at-range/insert-inline-at-range/block-start/output.yaml @@ -3,6 +3,8 @@ nodes: - kind: block type: paragraph nodes: + - kind: text + text: "" - kind: inline type: hashtag isVoid: true diff --git a/test/transforms/fixtures/at-range/insert-inline-at-range/is-empty/output.yaml b/test/transforms/fixtures/at-range/insert-inline-at-range/is-empty/output.yaml index 936e672db..c06607fe2 100644 --- a/test/transforms/fixtures/at-range/insert-inline-at-range/is-empty/output.yaml +++ b/test/transforms/fixtures/at-range/insert-inline-at-range/is-empty/output.yaml @@ -3,6 +3,10 @@ nodes: - kind: block type: paragraph nodes: + - kind: text + text: "" - kind: inline type: hashtag isVoid: true + - kind: text + text: "" diff --git a/test/transforms/fixtures/at-range/insert-inline-at-range/with-inline/output.yaml b/test/transforms/fixtures/at-range/insert-inline-at-range/with-inline/output.yaml index 3e75f2f14..fbfc98018 100644 --- a/test/transforms/fixtures/at-range/insert-inline-at-range/with-inline/output.yaml +++ b/test/transforms/fixtures/at-range/insert-inline-at-range/with-inline/output.yaml @@ -3,6 +3,8 @@ nodes: - kind: block type: paragraph nodes: + - kind: text + text: "" - kind: inline type: image isVoid: true diff --git a/test/transforms/fixtures/at-range/set-inline-at-range/with-is-void/output.yaml b/test/transforms/fixtures/at-range/set-inline-at-range/with-is-void/output.yaml index 07e15441b..057979d81 100644 --- a/test/transforms/fixtures/at-range/set-inline-at-range/with-is-void/output.yaml +++ b/test/transforms/fixtures/at-range/set-inline-at-range/with-is-void/output.yaml @@ -3,6 +3,10 @@ nodes: - kind: block type: paragraph nodes: + - kind: text + text: "" - kind: inline type: emoji isVoid: true + - kind: text + text: ""