Permalink
Browse files

feat: Use dom utils (#1017)

* feat: dom utility methods

* Update index.js

* [tooltip.js] Use dom utils

* [dropdown.js] Use dom utils

* [scrollspy.js] Use dom utils

* feat(array mixin): Add polyfill for Array.find for IE

* [modal] use dom utils

* [popover.vue] Use dom utils

* [tooltip.vue] Use dom utils
  • Loading branch information...
tmorehouse committed Sep 8, 2017
1 parent 7ed199d commit 5ca9fe3ec58033725ddf766060fccb9cfd50f848
Showing with 57 additions and 22 deletions.
  1. +6 −20 lib/components/modal.vue
  2. +2 −1 lib/components/popover.vue
  3. +2 −1 lib/components/tooltip.vue
  4. +47 −0 lib/utils/array.js
@@ -93,7 +93,8 @@
<script>
import bBtn from './button';
import { listenOnRootMixin } from '../mixins';
import { from as arrayFrom } from '../utils/array'
import { from as arrayFrom, arrayFind } from '../utils/array';
import { isElement, isVisible, selectAll, select } from '../utils/dom';
const FOCUS_SELECTOR = [
'button:not([disabled])',
@@ -104,27 +105,12 @@
'[tabindex]:not([disabled]):not(.disabled)'
].join(',');
// Determine if an HTML element is visible - Faster than CSS check
function isVisible(el) {
return el && (el.offsetWidth > 0 || el.offsetHeight > 0);
}
// Find the first visible element contained in a given root element
function findFirstVisible(root, selector) {
if (!root || !root.querySelectorAll || !selector) {
if (!isElement(root) || !selector) {
return null;
}
let els = arrayFrom(root.querySelectorAll(selector));
// IE 10 & 11 do not support native array.find()
// So we try native find first, then fall back to a loop
let el = els.find ? els.find(el => isVisible(el)) : null;
for (let i = 0; !el && i < els.length; i++) {
if (isVisible(els[i])) {
el = els[i];
}
}
return el;
return arrayFind(selectAll(selector, root), isVisible) || null;
}
export default {
@@ -143,7 +129,7 @@
computed: {
body() {
if (typeof document !== 'undefined') {
return document.querySelector('body');
return document.body;
}
}
},
@@ -357,7 +343,7 @@
if (el) {
if (typeof el === 'string') {
// CSS Selector
el = document.querySelector(el);
el = select(el);
}
if (el && el.$el && typeof el.$el.focus === 'function') {
// Component vm reference
@@ -10,6 +10,7 @@
import PopOver from '../classes/popover';
import { isArray } from '../utils/array';
import { assign } from '../utils/object';
import { isElement } from '../utils/dom';
import { observeDom, warn } from '../utils';
export default {
@@ -160,7 +161,7 @@
} else if (typeof target === 'object' && target.$el) {
// Component reference
return target.$el;
} else if (typeof target === 'object' && target.tagName) {
} else if (typeof target === 'object' && isElement(target)) {
// Element reference
return target;
}
@@ -9,6 +9,7 @@
import ToolTip from '../classes/tooltip';
import { isArray } from '../utils/array';
import { assign } from '../utils/object';
import { isElement } from '../utils/dom';
import { observeDom, warn } from '../utils';
export default {
@@ -150,7 +151,7 @@
} else if (typeof target === 'object' && target.$el) {
// Component reference
return target.$el;
} else if (typeof target === 'object' && target.tagName) {
} else if (typeof target === 'object' && isElement(target)) {
// Element reference
return target;
}
@@ -78,6 +78,52 @@ if (!Array.from) {
})();
}
// https://tc39.github.io/ecma262/#sec-array.prototype.find
// Needed for IE support
if (!Array.prototype.find) {
Object.defineProperty(Array.prototype, 'find', {
value: function(predicate) {
// 1. Let O be ? ToObject(this value).
if (this == null) {
throw new TypeError('"this" is null or not defined');
}
const o = Object(this);
// 2. Let len be ? ToLength(? Get(O, "length")).
const len = o.length >>> 0;
// 3. If IsCallable(predicate) is false, throw a TypeError exception.
if (typeof predicate !== 'function') {
throw new TypeError('predicate must be a function');
}
// 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
const thisArg = arguments[1];
// 5. Let k be 0.
let k = 0;
// 6. Repeat, while k < len
while (k < len) {
// a. Let Pk be ! ToString(k).
// b. Let kValue be ? Get(O, Pk).
// c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
// d. If testResult is true, return kValue.
const kValue = o[k];
if (predicate.call(thisArg, kValue, k, o)) {
return kValue;
}
// e. Increase k by 1.
k++;
}
// 7. Return undefined.
return undefined;
}
});
}
if (!Array.isArray) {
Array.isArray = arg => Object.prototype.toString.call(arg) === "[object Array]";
}
@@ -88,6 +134,7 @@ export const isArray = Array.isArray;
// Instance
export const arrayIncludes = (array, value) => array.indexOf(value) !== -1;
export const arrayFind = (array, fn, thisArg) => array.find(fn, thisArg);
export function concat() {
return Array.prototype.concat.apply([], arguments);
}

0 comments on commit 5ca9fe3

Please sign in to comment.