Add node.getLeafXAtRange and node.getRootXAtRange (#2399)

#### Is this adding or improving a _feature_ or fixing a _bug_?

Adding and improving

#### What's the new behavior?

Renames the following node methods (deprecating the old ones):

- `getBlocksAtRangeAsArray` -> `getLeafBlocksAtRangeAsArray`
- `getBlocksAtRange` -> `getLeafBlocksAtRange`
- `getInlinesAtRangeAsArray` -> `getLeafInlinesAtRangeAsArray`
- `getInlinesAtRange` -> `getLeafInlinesAtRange`

Adds the following nodes methods:

- `getRootBlocksAtRange`
- `getRootInlinesAtRange`

#### How does this change work?

Have not changed the implementation of the renamed methods. Added tests for both renamed methods and added methods.

#### Have you checked that...?

* [x] The new code matches the existing patterns and styles.
* [x] The tests pass with `yarn test`.
* [x] The linter passes with `yarn lint`. (Fix errors with `yarn prettier`.)
* [x] The relevant examples still work. (Run examples with `yarn watch`.)

#### Does this fix any issues or need any specific reviewers?

Discussed in #2351

packages/slate/src/commands/at-range.js

@@ -916,7 +916,7 @@ Commands.removeMarkAtRange = (editor, range, mark) => {
 Commands.setBlocksAtRange = (editor, range, properties) => {
   const { value } = editor
   const { document } = value
-  const blocks = document.getBlocksAtRange(range)
+  const blocks = document.getLeafBlocksAtRange(range)
 
   const { start, end, isCollapsed } = range
   const isStartVoid = document.hasVoidParent(start.key, editor)
@@ -955,7 +955,7 @@ Commands.setBlocksAtRange = (editor, range, properties) => {
 Commands.setInlinesAtRange = (editor, range, properties) => {
   const { value } = editor
   const { document } = value
-  const inlines = document.getInlinesAtRange(range)
+  const inlines = document.getLeafInlinesAtRange(range)
 
   editor.withoutNormalizing(() => {
     inlines.forEach(inline => {
@@ -1076,7 +1076,7 @@ Commands.unwrapBlockAtRange = (editor, range, properties) => {
 
   const { value } = editor
   let { document } = value
-  const blocks = document.getBlocksAtRange(range)
+  const blocks = document.getLeafBlocksAtRange(range)
   const wrappers = blocks
     .map(block => {
       return document.getClosest(block.key, parent => {
@@ -1202,7 +1202,7 @@ Commands.wrapBlockAtRange = (editor, range, block) => {
   const { value } = editor
   const { document } = value
 
-  const blocks = document.getBlocksAtRange(range)
+  const blocks = document.getLeafBlocksAtRange(range)
   const firstblock = blocks.first()
   const lastblock = blocks.last()
   let parent, siblings, index
@@ -1282,7 +1282,7 @@ Commands.wrapInlineAtRange = (editor, range, inline) => {
   inline = Inline.create(inline)
   inline = inline.set('nodes', inline.nodes.clear())
 
-  const blocks = document.getBlocksAtRange(range)
+  const blocks = document.getLeafBlocksAtRange(range)
   let startBlock = document.getClosestBlock(start.key)
   let endBlock = document.getClosestBlock(end.key)
   const startInline = document.getClosestInline(start.key)

packages/slate/src/interfaces/element.js

@@ -1,5 +1,6 @@
 import direction from 'direction'
 import invariant from 'tiny-invariant'
+import warning from 'tiny-warning'
 import { List, OrderedSet, Set, Stack } from 'immutable'
 
 import mixin from '../utils/mixin'
@@ -275,34 +276,28 @@ class ElementInterface {
    */
 
   getBlocksAtRange(range) {
-    const array = this.getBlocksAtRangeAsArray(range)
-    // Eliminate duplicates by converting to an `OrderedSet` first.
-    return List(OrderedSet(array))
+    warning(
+      false,
+      'As of slate@0.44 the `node.getBlocksAtRange` method has been renamed to `getLeafBlocksAtRange`.'
+    )
+
+    return this.getLeafBlocksAtRange(range)
   }
 
   /**
-   * Get the leaf block descendants in a `range` as an array
+   * Get the bottom-most block descendants in a `range` as an array
    *
    * @param {Range} range
    * @return {Array}
    */
 
   getBlocksAtRangeAsArray(range) {
-    range = this.resolveRange(range)
-    if (range.isUnset) return []
+    warning(
+      false,
+      'As of slate@0.44 the `node.getBlocksAtRangeAsArray` method has been renamed to `getLeafBlocksAtRangeAsArray`.'
+    )
 
-    const { start, end } = range
-    const startBlock = this.getClosestBlock(start.key)
-
-    // PERF: the most common case is when the range is in a single block node,
-    // where we can avoid a lot of iterating of the tree.
-    if (start.key === end.key) return [startBlock]
-
-    const endBlock = this.getClosestBlock(end.key)
-    const blocks = this.getBlocksAsArray()
-    const startIndex = blocks.indexOf(startBlock)
-    const endIndex = blocks.indexOf(endBlock)
-    return blocks.slice(startIndex, endIndex + 1)
+    return this.getLeafBlocksAtRangeAsArray(range)
   }
 
   /**
@@ -640,35 +635,35 @@ class ElementInterface {
   }
 
   /**
-   * Get the closest inline nodes for each text node in a `range`.
+   * Get the bottom-most inline nodes for each text node in a `range`.
    *
    * @param {Range} range
    * @return {List<Node>}
    */
 
   getInlinesAtRange(range) {
-    const array = this.getInlinesAtRangeAsArray(range)
-    // Remove duplicates by converting it to an `OrderedSet` first.
-    const list = List(OrderedSet(array))
-    return list
+    warning(
+      false,
+      'As of slate@0.44 the `node.getInlinesAtRange` method has been renamed to `getLeafInlinesAtRange`.'
+    )
+
+    return this.getLeafInlinesAtRange(range)
   }
 
   /**
-   * Get the closest inline nodes for each text node in a `range` as an array.
+   * Get the bottom-most inline nodes for each text node in a `range` as an array.
    *
    * @param {Range} range
    * @return {Array}
    */
 
   getInlinesAtRangeAsArray(range) {
-    range = this.resolveRange(range)
-    if (range.isUnset) return []
+    warning(
+      false,
+      'As of slate@0.44 the `node.getInlinesAtRangeAsArray` method has been renamed to `getLeafInlinesAtRangeAsArray`.'
+    )
 
-    const array = this.getTextsAtRangeAsArray(range)
-      .map(text => this.getClosestInline(text.key))
-      .filter(exists => exists)
-
-    return array
+    return this.getLeafInlinesAtRangeAsArray(range)
   }
 
   /**
@@ -731,6 +726,76 @@ class ElementInterface {
     return marks
   }
 
+  /**
+   * Get the bottom-most block descendants in a `range`.
+   *
+   * @param {Range} range
+   * @return {List<Node>}
+   */
+
+  getLeafBlocksAtRange(range) {
+    const array = this.getLeafBlocksAtRangeAsArray(range)
+    // Eliminate duplicates by converting to an `OrderedSet` first.
+    return List(OrderedSet(array))
+  }
+
+  /**
+   * Get the bottom-most descendants in a `range` as an array
+   *
+   * @param {Range} range
+   * @return {Array}
+   */
+
+  getLeafBlocksAtRangeAsArray(range) {
+    range = this.resolveRange(range)
+    if (range.isUnset) return []
+
+    const { start, end } = range
+    const startBlock = this.getClosestBlock(start.key)
+
+    // PERF: the most common case is when the range is in a single block node,
+    // where we can avoid a lot of iterating of the tree.
+    if (start.key === end.key) return [startBlock]
+
+    const endBlock = this.getClosestBlock(end.key)
+    const blocks = this.getBlocksAsArray()
+    const startIndex = blocks.indexOf(startBlock)
+    const endIndex = blocks.indexOf(endBlock)
+    return blocks.slice(startIndex, endIndex + 1)
+  }
+
+  /**
+   * Get the bottom-most inline nodes for each text node in a `range`.
+   *
+   * @param {Range} range
+   * @return {List<Node>}
+   */
+
+  getLeafInlinesAtRange(range) {
+    const array = this.getLeafInlinesAtRangeAsArray(range)
+    // Remove duplicates by converting it to an `OrderedSet` first.
+    const list = List(OrderedSet(array))
+    return list
+  }
+
+  /**
+   * Get the bottom-most inline nodes for each text node in a `range` as an array.
+   *
+   * @param {Range} range
+   * @return {Array}
+   */
+
+  getLeafInlinesAtRangeAsArray(range) {
+    range = this.resolveRange(range)
+    if (range.isUnset) return []
+
+    const array = this.getTextsAtRangeAsArray(range)
+      .map(text => this.getClosestInline(text.key))
+      .filter(exists => exists)
+
+    return array
+  }
+
   /**
    * Get all of the marks for all of the characters of every text node.
    *
@@ -1154,6 +1219,62 @@ class ElementInterface {
     return closest
   }
 
+  /**
+   * Get the highest block descendants in a `range`.
+   *
+   * @param {Range} range
+   * @return {List<Node>}
+   */
+
+  getRootBlocksAtRange(range) {
+    range = this.resolveRange(range)
+    if (range.isUnset) return List()
+
+    const { start, end } = range
+    const startBlock = this.getFurthestBlock(start.key)
+
+    // PERF: the most common case is when the range is in a single block node,
+    // where we can avoid a lot of iterating of the tree.
+    if (start.key === end.key) return List([startBlock])
+
+    const endBlock = this.getFurthestBlock(end.key)
+    const startIndex = this.nodes.indexOf(startBlock)
+    const endIndex = this.nodes.indexOf(endBlock)
+    return this.nodes.slice(startIndex, endIndex + 1)
+  }
+
+  /**
+   * Get the top-most inline nodes for each text node in a `range`.
+   *
+   * @param {Range} range
+   * @return {List<Node>}
+   */
+
+  getRootInlinesAtRange(range) {
+    const array = this.getRootInlinesAtRangeAsArray(range)
+    // Remove duplicates by converting it to an `OrderedSet` first.
+    const list = List(OrderedSet(array))
+    return list
+  }
+
+  /**
+   * Get the top-most inline nodes for each text node in a `range` as an array.
+   *
+   * @param {Range} range
+   * @return {Array}
+   */
+
+  getRootInlinesAtRangeAsArray(range) {
+    range = this.resolveRange(range)
+    if (range.isUnset) return List()
+
+    const array = this.getTextsAtRangeAsArray(range)
+      .map(text => this.getFurthestInline(text.key))
+      .filter(exists => exists)
+
+    return array
+  }
+
   /**
    * Get the previous node from a node in the tree.
    *
@@ -1862,8 +1983,9 @@ memoize(ElementInterface.prototype, [
   'getDecorations',
   'getFragmentAtRange',
   'getInlinesAsArray',
-  'getInlinesAtRangeAsArray',
   'getInlinesByTypeAsArray',
+  'getLeafBlocksAtRangeAsArray',
+  'getLeafInlinesAtRangeAsArray',
   'getMarksAsArray',
   'getMarksAtPosition',
   'getNodesAtRange',
@@ -1874,6 +1996,8 @@ memoize(ElementInterface.prototype, [
   'getOffset',
   'getOffsetAtRange',
   'getPreviousBlock',
+  'getRootBlocksAtRange',
+  'getRootInlinesAtRangeAsArray',
   'getTextAtOffset',
   'getTextDirection',
   'getTextsAsArray',

packages/slate/src/models/value.js

@@ -378,7 +378,7 @@ class Value extends Record(DEFAULTS) {
   get blocks() {
     return this.selection.isUnset
       ? new List()
-      : this.document.getBlocksAtRange(this.selection)
+      : this.document.getLeafBlocksAtRange(this.selection)
   }
 
   /**
@@ -394,7 +394,7 @@ class Value extends Record(DEFAULTS) {
   }
 
   /**
-   * Get the inline nodes in the current selection.
+   * Get the bottom-most inline nodes in the current selection.
    *
    * @return {List<Inline>}
    */
@@ -402,7 +402,7 @@ class Value extends Record(DEFAULTS) {
   get inlines() {
     return this.selection.isUnset
       ? new List()
-      : this.document.getInlinesAtRange(this.selection)
+      : this.document.getLeafInlinesAtRange(this.selection)
   }
 
   /**

packages/slate/test/models/node/get-leaf-blocks-at-range-as-array/multiple-blocks.js

@@ -0,0 +1,35 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          tw<anchor />o
+        </text>
+      </paragraph>
+      <image key="e" src="https://example.com/image2.png">
+        <text key="f" />
+      </image>
+      <paragraph key="g">
+        <inline type="link" key="h">
+          <text key="i">three</text>
+        </inline>
+        <text key="j">
+          <focus />four
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['c', 'e', 'g']

packages/slate/test/models/node/get-leaf-blocks-at-range-as-array/nested-blocks-cursor-in-first-leaf-of-first-parent.js

@@ -0,0 +1,28 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">
+              on<cursor />e
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+      <paragraph key="e">
+        <text key="f">two</text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['c']

packages/slate/test/models/node/get-leaf-blocks-at-range-as-array/nested-blocks-cursor-in-first-leaf-of-second-parent.js

@@ -0,0 +1,34 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">one</text>
+          </paragraph>
+          <paragraph key="e">
+            <text key="f">two</text>
+          </paragraph>
+        </quote>
+        <quote key="g">
+          <paragraph key="h">
+            <text key="i">
+              three
+              <cursor />
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['h']

packages/slate/test/models/node/get-leaf-blocks-at-range-as-array/nested-blocks-cursor-in-second-leaf-of-first-parent.js

@@ -0,0 +1,32 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">one</text>
+          </paragraph>
+          <paragraph key="e">
+            <text key="f">
+              <cursor />
+              two
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+      <paragraph key="g">
+        <text key="h">three</text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['e']

packages/slate/test/models/node/get-leaf-blocks-at-range-as-array/nested-blocks-selection-overlapping-multiple-blocks.js

@@ -0,0 +1,43 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">
+          <focus />
+          one
+        </text>
+      </paragraph>
+      <quote key="c">
+        <quote key="d">
+          <paragraph key="e">
+            <text key="f">two</text>
+          </paragraph>
+        </quote>
+        <quote key="g">
+          <paragraph key="h">
+            <text key="i">three</text>
+          </paragraph>
+          <paragraph key="j">
+            <text key="k">
+              <anchor />
+              four
+            </text>
+          </paragraph>
+          <paragraph key="l">
+            <text key="m">five</text>
+          </paragraph>
+        </quote>
+      </quote>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['a', 'e', 'h', 'j']

packages/slate/test/models/node/get-leaf-blocks-at-range-as-array/nested-blocks-selection-overlapping-texts-in-second-parent.js

@@ -0,0 +1,41 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">one</text>
+          </paragraph>
+        </quote>
+        <quote key="e">
+          <paragraph key="f">
+            <text key="g">
+              <anchor />two
+            </text>
+          </paragraph>
+          <paragraph key="h">
+            <text key="i">three</text>
+          </paragraph>
+          <paragraph key="j">
+            <text key="k">
+              f<focus />our
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+      <paragraph key="l">
+        <text key="m">five</text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['f', 'h', 'j']

packages/slate/test/models/node/get-leaf-blocks-at-range-as-array/nested-blocks-selection-spanning-first-text.js

@@ -0,0 +1,28 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">
+              <anchor />one<focus />
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+      <paragraph key="e">
+        <text key="f">two</text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['c']

packages/slate/test/models/node/get-leaf-blocks-at-range-as-array/single-block-with-inline.js

@@ -0,0 +1,24 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+        <inline type="link" key="c">
+          <text key="d">
+            tw<cursor />o
+          </text>
+        </inline>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['a']

packages/slate/test/models/node/get-leaf-blocks-at-range-as-array/single-block.js

@@ -0,0 +1,25 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          <cursor />
+          two
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['c']

packages/slate/test/models/node/get-leaf-blocks-at-range-as-array/single-void-block.js

@@ -0,0 +1,23 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <image key="a" src="https://example.com/image2.png">
+        <text key="b" />
+      </image>
+    </document>
+    <selection isFocused={false}>
+      <anchor key="b" offset={0} />
+      <focus key="b" offset={0} />
+    </selection>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['a']

packages/slate/test/models/node/get-leaf-blocks-at-range/multiple-blocks.js

@@ -0,0 +1,36 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          tw<anchor />o
+        </text>
+      </paragraph>
+      <image key="e" src="https://example.com/image2.png">
+        <text key="f" />
+      </image>
+      <paragraph key="g">
+        <inline type="link" key="h">
+          <text key="i">three</text>
+        </inline>
+        <text key="j">
+          <focus />four
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['c', 'e', 'g'])

packages/slate/test/models/node/get-leaf-blocks-at-range/nested-blocks-cursor-in-first-leaf-of-first-parent.js

@@ -0,0 +1,29 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">
+              on<cursor />e
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+      <paragraph key="e">
+        <text key="f">two</text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['c'])

packages/slate/test/models/node/get-leaf-blocks-at-range/nested-blocks-cursor-in-first-leaf-of-second-parent.js

@@ -0,0 +1,35 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">one</text>
+          </paragraph>
+          <paragraph key="e">
+            <text key="f">two</text>
+          </paragraph>
+        </quote>
+        <quote key="g">
+          <paragraph key="h">
+            <text key="i">
+              three
+              <cursor />
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['h'])

packages/slate/test/models/node/get-leaf-blocks-at-range/nested-blocks-cursor-in-second-leaf-of-first-parent.js

@@ -0,0 +1,33 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">one</text>
+          </paragraph>
+          <paragraph key="e">
+            <text key="f">
+              <cursor />
+              two
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+      <paragraph key="g">
+        <text key="h">three</text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['e'])

packages/slate/test/models/node/get-leaf-blocks-at-range/nested-blocks-selection-overlapping-multiple-blocks.js

@@ -0,0 +1,44 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">
+          <focus />
+          one
+        </text>
+      </paragraph>
+      <quote key="c">
+        <quote key="d">
+          <paragraph key="e">
+            <text key="f">two</text>
+          </paragraph>
+        </quote>
+        <quote key="g">
+          <paragraph key="h">
+            <text key="i">three</text>
+          </paragraph>
+          <paragraph key="j">
+            <text key="k">
+              <anchor />
+              four
+            </text>
+          </paragraph>
+          <paragraph key="l">
+            <text key="m">five</text>
+          </paragraph>
+        </quote>
+      </quote>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['a', 'e', 'h', 'j'])

packages/slate/test/models/node/get-leaf-blocks-at-range/nested-blocks-selection-overlapping-texts-in-second-parent.js

@@ -0,0 +1,42 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">one</text>
+          </paragraph>
+        </quote>
+        <quote key="e">
+          <paragraph key="f">
+            <text key="g">
+              <anchor />two
+            </text>
+          </paragraph>
+          <paragraph key="h">
+            <text key="i">three</text>
+          </paragraph>
+          <paragraph key="j">
+            <text key="k">
+              f<focus />our
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+      <paragraph key="l">
+        <text key="m">five</text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['f', 'h', 'j'])

packages/slate/test/models/node/get-leaf-blocks-at-range/nested-blocks-selection-spanning-first-text.js

@@ -0,0 +1,29 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">
+              <anchor />one<focus />
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+      <paragraph key="e">
+        <text key="f">two</text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['c'])

packages/slate/test/models/node/get-leaf-blocks-at-range/single-block-with-inline.js

@@ -0,0 +1,25 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+        <inline type="link" key="c">
+          <text key="d">
+            tw<cursor />o
+          </text>
+        </inline>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['a'])

packages/slate/test/models/node/get-leaf-blocks-at-range/single-block.js

@@ -0,0 +1,26 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          <cursor />
+          two
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['c'])

packages/slate/test/models/node/get-leaf-blocks-at-range/single-void-block.js

@@ -0,0 +1,24 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <image key="a" src="https://example.com/image2.png">
+        <text key="b" />
+      </image>
+    </document>
+    <selection isFocused={false}>
+      <anchor key="b" offset={0} />
+      <focus key="b" offset={0} />
+    </selection>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['a'])

packages/slate/test/models/node/get-leaf-inlines-at-range-as-array/multiple-blocks-no-inline.js

@@ -0,0 +1,32 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          tw<anchor />o
+        </text>
+      </paragraph>
+      <image key="e" src="https://example.com/image2.png">
+        <text key="f" />
+      </image>
+      <paragraph key="g">
+        <text key="h">
+          <focus />four
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafInlinesAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = []

packages/slate/test/models/node/get-leaf-inlines-at-range-as-array/multiple-blocks.js

@@ -0,0 +1,43 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          tw<anchor />o
+        </text>
+        <inline type="link" key="e">
+          <text key="f">three</text>
+        </inline>
+      </paragraph>
+      <image key="g" src="https://example.com/image2.png">
+        <text key="h" />
+      </image>
+      <paragraph key="i">
+        <inline type="link" key="j">
+          <inline type="link-part" key="k">
+            <text key="l">four</text>
+          </inline>
+          <inline type="link-part" key="m">
+            <text key="n">five</text>
+          </inline>
+        </inline>
+        <text key="o">
+          <focus />six
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafInlinesAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['e', 'k', 'm']

packages/slate/test/models/node/get-leaf-inlines-at-range-as-array/nested-with-text-on-every-level.js

@@ -0,0 +1,36 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <inline type="i1" key="b">
+          <inline type="i2" key="c">
+            <inline type="i3" key="d">
+              <text key="e">
+                o<anchor />ne
+              </text>
+            </inline>
+          </inline>
+          <inline type="i2" key="f">
+            <inline type="i3" key="g">
+              <text key="h">two</text>
+            </inline>
+            <text key="i">three</text>
+          </inline>
+          <text key="j">
+            four<focus />
+          </text>
+        </inline>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafInlinesAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['d', 'g', 'f', 'b']

packages/slate/test/models/node/get-leaf-inlines-at-range/multiple-blocks-no-inline.js

@@ -0,0 +1,33 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          tw<anchor />o
+        </text>
+      </paragraph>
+      <image key="e" src="https://example.com/image2.png">
+        <text key="f" />
+      </image>
+      <paragraph key="g">
+        <text key="h">
+          <focus />four
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafInlinesAtRange(selection).map(n => n.key)
+}
+
+export const output = List()

packages/slate/test/models/node/get-leaf-inlines-at-range/multiple-blocks.js

@@ -0,0 +1,44 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          tw<anchor />o
+        </text>
+        <inline type="link" key="e">
+          <text key="f">three</text>
+        </inline>
+      </paragraph>
+      <image key="g" src="https://example.com/image2.png">
+        <text key="h" />
+      </image>
+      <paragraph key="i">
+        <inline type="link" key="j">
+          <inline type="link-part" key="k">
+            <text key="l">four</text>
+          </inline>
+          <inline type="link-part" key="m">
+            <text key="n">five</text>
+          </inline>
+        </inline>
+        <text key="o">
+          <focus />six
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafInlinesAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['e', 'k', 'm'])

packages/slate/test/models/node/get-leaf-inlines-at-range/nested-with-text-on-every-level.js

@@ -0,0 +1,37 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <inline type="i1" key="b">
+          <inline type="i2" key="c">
+            <inline type="i3" key="d">
+              <text key="e">
+                o<anchor />ne
+              </text>
+            </inline>
+          </inline>
+          <inline type="i2" key="f">
+            <inline type="i3" key="g">
+              <text key="h">two</text>
+            </inline>
+            <text key="i">three</text>
+          </inline>
+          <text key="j">
+            four<focus />
+          </text>
+        </inline>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getLeafInlinesAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['d', 'g', 'f', 'b'])

packages/slate/test/models/node/get-root-blocks-at-range/multiple-blocks.js

@@ -0,0 +1,36 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          tw<anchor />o
+        </text>
+      </paragraph>
+      <image key="e" src="https://example.com/image2.png">
+        <text key="f" />
+      </image>
+      <paragraph key="g">
+        <inline type="link" key="h">
+          <text key="i">three</text>
+        </inline>
+        <text key="j">
+          <focus />four
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['c', 'e', 'g'])

packages/slate/test/models/node/get-root-blocks-at-range/nested-blocks-cursor-in-first-leaf-of-first-parent.js

@@ -0,0 +1,29 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">
+              on<cursor />e
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+      <paragraph key="e">
+        <text key="f">two</text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['a'])

packages/slate/test/models/node/get-root-blocks-at-range/nested-blocks-cursor-in-first-leaf-of-second-parent.js

@@ -0,0 +1,35 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">one</text>
+          </paragraph>
+          <paragraph key="e">
+            <text key="f">two</text>
+          </paragraph>
+        </quote>
+        <quote key="g">
+          <paragraph key="h">
+            <text key="i">
+              three
+              <cursor />
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['a'])

packages/slate/test/models/node/get-root-blocks-at-range/nested-blocks-cursor-in-second-leaf-of-first-parent.js

@@ -0,0 +1,33 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">one</text>
+          </paragraph>
+          <paragraph key="e">
+            <text key="f">
+              <cursor />
+              two
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+      <paragraph key="g">
+        <text key="h">three</text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['a'])

packages/slate/test/models/node/get-root-blocks-at-range/nested-blocks-selection-overlapping-multiple-blocks.js

@@ -0,0 +1,44 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">
+          <focus />
+          one
+        </text>
+      </paragraph>
+      <quote key="c">
+        <quote key="d">
+          <paragraph key="e">
+            <text key="f">two</text>
+          </paragraph>
+        </quote>
+        <quote key="g">
+          <paragraph key="h">
+            <text key="i">three</text>
+          </paragraph>
+          <paragraph key="j">
+            <text key="k">
+              <anchor />
+              four
+            </text>
+          </paragraph>
+          <paragraph key="l">
+            <text key="m">five</text>
+          </paragraph>
+        </quote>
+      </quote>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['a', 'c'])

packages/slate/test/models/node/get-root-blocks-at-range/nested-blocks-selection-overlapping-texts-in-second-parent.js

@@ -0,0 +1,42 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">one</text>
+          </paragraph>
+        </quote>
+        <quote key="e">
+          <paragraph key="f">
+            <text key="g">
+              <anchor />two
+            </text>
+          </paragraph>
+          <paragraph key="h">
+            <text key="i">three</text>
+          </paragraph>
+          <paragraph key="j">
+            <text key="k">
+              f<focus />our
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+      <paragraph key="l">
+        <text key="m">five</text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['a'])

packages/slate/test/models/node/get-root-blocks-at-range/nested-blocks-selection-spanning-first-text.js

@@ -0,0 +1,29 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <quote key="a">
+        <quote key="b">
+          <paragraph key="c">
+            <text key="d">
+              <anchor />one<focus />
+            </text>
+          </paragraph>
+        </quote>
+      </quote>
+      <paragraph key="e">
+        <text key="f">two</text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['a'])

packages/slate/test/models/node/get-root-blocks-at-range/single-block-with-inline.js

@@ -0,0 +1,25 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+        <inline type="link" key="c">
+          <text key="d">
+            tw<cursor />o
+          </text>
+        </inline>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['a'])

packages/slate/test/models/node/get-root-blocks-at-range/single-block.js

@@ -0,0 +1,26 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          <cursor />
+          two
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['c'])

packages/slate/test/models/node/get-root-blocks-at-range/single-void-block.js

@@ -0,0 +1,24 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <image key="a" src="https://example.com/image2.png">
+        <text key="b" />
+      </image>
+    </document>
+    <selection isFocused={false}>
+      <anchor key="b" offset={0} />
+      <focus key="b" offset={0} />
+    </selection>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootBlocksAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['a'])

packages/slate/test/models/node/get-root-inlines-at-range-as-array/multiple-blocks-no-inline.js

@@ -0,0 +1,32 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          tw<anchor />o
+        </text>
+      </paragraph>
+      <image key="e" src="https://example.com/image2.png">
+        <text key="f" />
+      </image>
+      <paragraph key="g">
+        <text key="h">
+          <focus />four
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootInlinesAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = []

packages/slate/test/models/node/get-root-inlines-at-range-as-array/multiple-blocks.js

@@ -0,0 +1,43 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          tw<anchor />o
+        </text>
+        <inline type="link" key="e">
+          <text key="f">three</text>
+        </inline>
+      </paragraph>
+      <image key="g" src="https://example.com/image2.png">
+        <text key="h" />
+      </image>
+      <paragraph key="i">
+        <inline type="link" key="j">
+          <inline type="link-part" key="k">
+            <text key="l">four</text>
+          </inline>
+          <inline type="link-part" key="m">
+            <text key="n">five</text>
+          </inline>
+        </inline>
+        <text key="o">
+          <focus />six
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootInlinesAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['e', 'j', 'j']

packages/slate/test/models/node/get-root-inlines-at-range-as-array/nested-with-text-on-every-level.js

@@ -0,0 +1,36 @@
+/** @jsx h */
+
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <inline type="i1" key="b">
+          <inline type="i2" key="c">
+            <inline type="i3" key="d">
+              <text key="e">
+                o<anchor />ne
+              </text>
+            </inline>
+          </inline>
+          <inline type="i2" key="f">
+            <inline type="i3" key="g">
+              <text key="h">two</text>
+            </inline>
+            <text key="i">three</text>
+          </inline>
+          <text key="j">
+            four<focus />
+          </text>
+        </inline>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootInlinesAtRangeAsArray(selection).map(n => n.key)
+}
+
+export const output = ['b', 'b', 'b', 'b']

packages/slate/test/models/node/get-root-inlines-at-range/multiple-blocks-no-inline.js

@@ -0,0 +1,33 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          tw<anchor />o
+        </text>
+      </paragraph>
+      <image key="e" src="https://example.com/image2.png">
+        <text key="f" />
+      </image>
+      <paragraph key="g">
+        <text key="h">
+          <focus />four
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootInlinesAtRange(selection).map(n => n.key)
+}
+
+export const output = List()

packages/slate/test/models/node/get-root-inlines-at-range/multiple-blocks.js

@@ -0,0 +1,44 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <text key="b">one</text>
+      </paragraph>
+      <paragraph key="c">
+        <text key="d">
+          tw<anchor />o
+        </text>
+        <inline type="link" key="e">
+          <text key="f">three</text>
+        </inline>
+      </paragraph>
+      <image key="g" src="https://example.com/image2.png">
+        <text key="h" />
+      </image>
+      <paragraph key="i">
+        <inline type="link" key="j">
+          <inline type="link-part" key="k">
+            <text key="l">four</text>
+          </inline>
+          <inline type="link-part" key="m">
+            <text key="n">five</text>
+          </inline>
+        </inline>
+        <text key="o">
+          <focus />six
+        </text>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootInlinesAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['e', 'j'])

packages/slate/test/models/node/get-root-inlines-at-range/nested-with-text-on-every-level.js

@@ -0,0 +1,37 @@
+/** @jsx h */
+
+import { List } from 'immutable'
+import h from '../../../helpers/h'
+
+export const input = (
+  <value>
+    <document>
+      <paragraph key="a">
+        <inline type="i1" key="b">
+          <inline type="i2" key="c">
+            <inline type="i3" key="d">
+              <text key="e">
+                o<anchor />ne
+              </text>
+            </inline>
+          </inline>
+          <inline type="i2" key="f">
+            <inline type="i3" key="g">
+              <text key="h">two</text>
+            </inline>
+            <text key="i">three</text>
+          </inline>
+          <text key="j">
+            four<focus />
+          </text>
+        </inline>
+      </paragraph>
+    </document>
+  </value>
+)
+
+export default function({ document, selection }) {
+  return document.getRootInlinesAtRange(selection).map(n => n.key)
+}
+
+export const output = List(['b'])