From ed593c732bcac1597f3a751cd515a0ce67fa3387 Mon Sep 17 00:00:00 2001 From: Ian Storm Taylor Date: Wed, 25 Oct 2017 17:55:18 -0700 Subject: [PATCH] remove some polyfills (#1288) * remove some polyfills * use for-of for iteration when possible --- packages/slate-html-serializer/src/index.js | 12 ++---- .../slate-react/src/components/content.js | 5 +-- packages/slate-react/src/components/editor.js | 8 ++-- .../slate-react/src/constants/environment.js | 9 ++--- .../src/utils/find-closest-node.js | 37 ------------------- packages/slate-react/src/utils/find-node.js | 4 +- packages/slate-react/src/utils/find-point.js | 7 ++-- packages/slate/package.json | 1 - packages/slate/src/models/node.js | 3 +- packages/slate/src/models/stack.js | 12 ++---- packages/slate/src/utils/memoize.js | 17 +++------ yarn.lock | 2 +- 12 files changed, 28 insertions(+), 89 deletions(-) delete mode 100644 packages/slate-react/src/utils/find-closest-node.js diff --git a/packages/slate-html-serializer/src/index.js b/packages/slate-html-serializer/src/index.js index 458a53aeb..7269fb919 100644 --- a/packages/slate-html-serializer/src/index.js +++ b/packages/slate-html-serializer/src/index.js @@ -256,8 +256,7 @@ class Html { } } - for (let i = 0; i < this.rules.length; i++) { - const rule = this.rules[i] + for (const rule of this.rules) { if (!rule.deserialize) continue const ret = rule.deserialize(element, next) const type = typeOf(ret) @@ -354,8 +353,7 @@ class Html { const children = node.nodes.map(this.serializeNode) - for (let i = 0; i < this.rules.length; i++) { - const rule = this.rules[i] + for (const rule of this.rules) { if (!rule.serialize) continue const ret = rule.serialize(node, children) if (ret) return addKey(ret) @@ -376,8 +374,7 @@ class Html { const text = this.serializeString(string) return leaf.marks.reduce((children, mark) => { - for (let i = 0; i < this.rules.length; i++) { - const rule = this.rules[i] + for (const rule of this.rules) { if (!rule.serialize) continue const ret = rule.serialize(mark, children) if (ret) return addKey(ret) @@ -395,8 +392,7 @@ class Html { */ serializeString = (string) => { - for (let i = 0; i < this.rules.length; i++) { - const rule = this.rules[i] + for (const rule of this.rules) { if (!rule.serialize) continue const ret = rule.serialize(string, string.text) if (ret) return ret diff --git a/packages/slate-react/src/components/content.js b/packages/slate-react/src/components/content.js index 24f9cde9f..da32435d2 100644 --- a/packages/slate-react/src/components/content.js +++ b/packages/slate-react/src/components/content.js @@ -8,7 +8,6 @@ import logger from 'slate-dev-logger' import EVENT_HANDLERS from '../constants/event-handlers' import Node from './node' -import findClosestNode from '../utils/find-closest-node' import findDOMRange from '../utils/find-dom-range' import findRange from '../utils/find-range' import scrollToSelection from '../utils/scroll-to-selection' @@ -210,7 +209,7 @@ class Content extends React.Component { const el = target.nodeType === 3 ? target.parentNode : target return ( (el.isContentEditable) && - (el === element || findClosestNode(el, '[data-slate-editor]') === element) + (el === element || el.closest('[data-slate-editor]') === element) ) } @@ -269,7 +268,7 @@ class Content extends React.Component { handler == 'onDragStart' ) { const { target } = event - const targetEditorNode = findClosestNode(target, '[data-slate-editor]') + const targetEditorNode = target.closest('[data-slate-editor]') if (targetEditorNode !== this.element) return } diff --git a/packages/slate-react/src/components/editor.js b/packages/slate-react/src/components/editor.js index 53f428ee2..62d7059b0 100644 --- a/packages/slate-react/src/components/editor.js +++ b/packages/slate-react/src/components/editor.js @@ -140,8 +140,7 @@ class Editor extends React.Component { let isNew = false // Check to see if any plugin-related properœties have changed. - for (let i = 0; i < PLUGINS_PROPS.length; i++) { - const prop = PLUGINS_PROPS[i] + for (const prop of PLUGINS_PROPS) { if (props[prop] == this.props[prop]) continue isNew = true break @@ -377,9 +376,8 @@ function resolvePlugins(props) { * Mix in the property types for the event handlers. */ -for (let i = 0; i < EVENT_HANDLERS.length; i++) { - const property = EVENT_HANDLERS[i] - Editor.propTypes[property] = Types.func +for (const prop of EVENT_HANDLERS) { + Editor.propTypes[prop] = Types.func } /** diff --git a/packages/slate-react/src/constants/environment.js b/packages/slate-react/src/constants/environment.js index 13bc4638b..acaba2d35 100644 --- a/packages/slate-react/src/constants/environment.js +++ b/packages/slate-react/src/constants/environment.js @@ -59,16 +59,14 @@ let OS if (browser) { const { userAgent } = window.navigator - for (let i = 0; i < BROWSER_RULES.length; i++) { - const [ name, regexp ] = BROWSER_RULES[i] + for (const [ name, regexp ] of BROWSER_RULES) { if (regexp.test(userAgent)) { BROWSER = name break } } - for (let i = 0; i < OS_RULES.length; i++) { - const [ name, regexp ] = OS_RULES[i] + for (const [ name, regexp ] of OS_RULES) { if (regexp.test(userAgent)) { OS = name break @@ -78,8 +76,7 @@ if (browser) { const testEl = window.document.createElement('div') testEl.contentEditable = true - for (let i = 0; i < EVENT_RULES.length; i++) { - const [ name, testFn ] = EVENT_RULES[i] + for (const [ name, testFn ] of EVENT_RULES) { EVENTS[name] = testFn(testEl) } } diff --git a/packages/slate-react/src/utils/find-closest-node.js b/packages/slate-react/src/utils/find-closest-node.js deleted file mode 100644 index 134c1bdde..000000000 --- a/packages/slate-react/src/utils/find-closest-node.js +++ /dev/null @@ -1,37 +0,0 @@ - -/** - * Find the closest ancestor of a DOM `element` that matches a given selector. - * - * COMPAT: In IE11, the `Node.closest` method doesn't exist natively, so we - * have to polyfill it. (2017/09/06) - * - * https://developer.mozilla.org/en-US/docs/Web/API/Element/closest#Polyfill - * - * @param {Element} node - * @param {String} selector - * @return {Element} - */ - -function findClosestNode(node, selector) { - if (typeof node.closest === 'function') return node.closest(selector) - - const matches = (node.document || node.ownerDocument).querySelectorAll(selector) - let parentNode = node - let i - - do { - i = matches.length - while (--i >= 0 && matches.item(i) !== parentNode); - } - while ((i < 0) && (parentNode = parentNode.parentElement)) - - return parentNode -} - -/** - * Export. - * - * @type {Function} - */ - -export default findClosestNode diff --git a/packages/slate-react/src/utils/find-node.js b/packages/slate-react/src/utils/find-node.js index 6380741ee..9c72aca67 100644 --- a/packages/slate-react/src/utils/find-node.js +++ b/packages/slate-react/src/utils/find-node.js @@ -1,6 +1,4 @@ -import findClosestNode from './find-closest-node' - /** * Find a Slate node from a DOM `element`. * @@ -9,7 +7,7 @@ import findClosestNode from './find-closest-node' */ function findNode(element, state) { - const closest = findClosestNode(element, '[data-key]') + const closest = element.closest('[data-key]') if (!closest) return null const key = closest.getAttribute('data-key') diff --git a/packages/slate-react/src/utils/find-point.js b/packages/slate-react/src/utils/find-point.js index b9822d004..dee8c66f5 100644 --- a/packages/slate-react/src/utils/find-point.js +++ b/packages/slate-react/src/utils/find-point.js @@ -2,7 +2,6 @@ import getWindow from 'get-window' import OffsetKey from './offset-key' -import findClosestNode from './find-closest-node' /** * Constants. @@ -32,7 +31,7 @@ function findPoint(nativeNode, nativeOffset, state) { const window = getWindow(nativeNode) const { parentNode } = nearestNode - let rangeNode = findClosestNode(parentNode, RANGE_SELECTOR) + let rangeNode = parentNode.closest(RANGE_SELECTOR) let offset let node @@ -40,7 +39,7 @@ function findPoint(nativeNode, nativeOffset, state) { // determine what the offset relative to the text node is. if (rangeNode) { const range = window.document.createRange() - const textNode = findClosestNode(rangeNode, TEXT_SELECTOR) + const textNode = rangeNode.closest(TEXT_SELECTOR) range.setStart(textNode, 0) range.setEnd(nearestNode, nearestOffset) node = textNode @@ -50,7 +49,7 @@ function findPoint(nativeNode, nativeOffset, state) { // For void nodes, the element with the offset key will be a cousin, not an // ancestor, so find it by going down from the nearest void parent. else { - const voidNode = findClosestNode(parentNode, VOID_SELECTOR) + const voidNode = parentNode.closest(VOID_SELECTOR) if (!voidNode) return null rangeNode = voidNode.querySelector(RANGE_SELECTOR) node = rangeNode diff --git a/packages/slate/package.json b/packages/slate/package.json index 4231406a6..4bcdf5e8e 100644 --- a/packages/slate/package.json +++ b/packages/slate/package.json @@ -8,7 +8,6 @@ "dependencies": { "debug": "^2.3.2", "direction": "^0.1.5", - "es6-map": "^0.1.4", "esrever": "^0.2.0", "is-empty": "^1.0.0", "is-plain-object": "^2.0.4", diff --git a/packages/slate/src/models/node.js b/packages/slate/src/models/node.js index 28169693c..0b1b225cd 100644 --- a/packages/slate/src/models/node.js +++ b/packages/slate/src/models/node.js @@ -649,8 +649,7 @@ class Node { getDescendantAtPath(path) { let descendant = this - for (let i = 0; i < path.length; i++) { - const index = path[i] + for (const index of path) { if (!descendant) return if (!descendant.nodes) return descendant = descendant.nodes.get(index) diff --git a/packages/slate/src/models/stack.js b/packages/slate/src/models/stack.js index a52b21e23..6291e7f30 100644 --- a/packages/slate/src/models/stack.js +++ b/packages/slate/src/models/stack.js @@ -76,8 +76,7 @@ class Stack extends Record(DEFAULTS) { find(property, ...args) { const plugins = this.getPluginsWith(property) - for (let i = 0; i < plugins.length; i++) { - const plugin = plugins[i] + for (const plugin of plugins) { const ret = plugin[property](...args) if (ret != null) return ret } @@ -95,8 +94,7 @@ class Stack extends Record(DEFAULTS) { const plugins = this.getPluginsWith(property) const array = [] - for (let i = 0; i < plugins.length; i++) { - const plugin = plugins[i] + for (const plugin of plugins) { const value = plugin[property](...args) if (value != null) array.push(value) } @@ -114,8 +112,7 @@ class Stack extends Record(DEFAULTS) { run(property, ...args) { const plugins = this.getPluginsWith(property) - for (let i = 0; i < plugins.length; i++) { - const plugin = plugins[i] + for (const plugin of plugins) { const ret = plugin[property](...args) if (ret != null) return } @@ -133,8 +130,7 @@ class Stack extends Record(DEFAULTS) { const plugins = this.getPluginsWith(property).reverse() let { children = null } = props - for (let i = 0; i < plugins.length; i++) { - const plugin = plugins[i] + for (const plugin of plugins) { const value = plugin[property](props, ...args) if (value == null) continue props.children = children = value diff --git a/packages/slate/src/utils/memoize.js b/packages/slate/src/utils/memoize.js index 35ae620f8..6d7791b92 100644 --- a/packages/slate/src/utils/memoize.js +++ b/packages/slate/src/utils/memoize.js @@ -1,6 +1,4 @@ -import Map from 'es6-map' - /** * Is in development? * @@ -67,8 +65,7 @@ const UNSET = undefined function memoize(object, properties, options = {}) { const { takesArguments = true } = options - for (let i = 0; i < properties.length; i++) { - const property = properties[i] + for (const property of properties) { const original = object[property] if (!original) { @@ -83,12 +80,12 @@ function memoize(object, properties, options = {}) { // If the cache key is different, previous caches must be cleared. if (CACHE_KEY !== this.__cache_key) { this.__cache_key = CACHE_KEY - this.__cache = new Map() + this.__cache = new Map() // eslint-disable-line no-undef,no-restricted-globals } } if (!this.__cache) { - this.__cache = new Map() + this.__cache = new Map() // eslint-disable-line no-undef,no-restricted-globals } let cachedValue @@ -133,8 +130,7 @@ function memoize(object, properties, options = {}) { */ function getIn(map, keys) { - for (let i = 0; i < keys.length; i++) { - const key = keys[i] + for (const key of keys) { map = map.get(key) if (map === UNSET) return UNSET } @@ -155,13 +151,12 @@ function setIn(map, keys, value) { let parent = map let child - for (let i = 0; i < keys.length; i++) { - const key = keys[i] + for (const key of keys) { child = parent.get(key) // If the path was not created yet... if (child === UNSET) { - child = new Map() + child = new Map() // eslint-disable-line no-undef,no-restricted-globals parent.set(key, child) } diff --git a/yarn.lock b/yarn.lock index 9967d92dc..b8f45d67f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2198,7 +2198,7 @@ es6-iterator@2, es6-iterator@^2.0.1, es6-iterator@~2.0.1: es5-ext "^0.10.14" es6-symbol "^3.1" -es6-map@^0.1.3, es6-map@^0.1.4: +es6-map@^0.1.3: version "0.1.5" resolved "https://registry.yarnpkg.com/es6-map/-/es6-map-0.1.5.tgz#9136e0503dcc06a301690f0bb14ff4e364e949f0" dependencies: