vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Added safe checks to DomHandler's methods

pull/2817/head
mertsincan 2022-07-29 01:54:54 +01:00
parent f6ee238924
commit 7a01f9e32f
1 changed files with 214 additions and 170 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

90
src/components/utils/DomHandler.js
View File

@ -1,19 +1,25 @@
export default {
innerWidth(el) {
if (el) {
let width = el.offsetWidth;
let style = getComputedStyle(el);
width += parseFloat(style.paddingLeft) + parseFloat(style.paddingRight);
return width;
}
return 0;
},
width(el) {
if (el) {
let width = el.offsetWidth;
let style = getComputedStyle(el);
width -= parseFloat(style.paddingLeft) + parseFloat(style.paddingRight);
return width;
}
return 0;
},
getWindowScrollTop() {
@ -37,9 +43,7 @@ export default {
return width;
}
else {
return 0;
}
},
getOuterHeight(el, margin) {
@ -53,9 +57,7 @@ export default {
return height;
}
else {
return 0;
}
},
getClientHeight(el, margin) {
@ -68,9 +70,8 @@ export default {
}
return height;
} else {
return 0;
}
return 0;
},
getViewport() {
@ -85,25 +86,35 @@ export default {
},
getOffset(el) {
var rect = el.getBoundingClientRect();
if (el) {
let rect = el.getBoundingClientRect();
return {
top: rect.top + (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0),
left: rect.left + (window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0),
};
}
return {
top: 'auto',
left: 'auto'
};
},
index(element) {
if (element) {
let children = element.parentNode.childNodes;
let num = 0;
for (var i = 0; i < children.length; i++) {
for (let i = 0; i < children.length; i++) {
if (children[i] === element) return num;
if (children[i].nodeType === 1) num++;
}
}
return -1;
},
addMultipleClasses(element, className) {
if (element && className) {
if (element.classList) {
let styles = className.split(' ');
for (let i = 0; i < styles.length; i++) {
@ -117,20 +128,25 @@ export default {
element.className += ' ' + styles[i];
}
}
}
},
addClass(element, className) {
if (element && className) {
if (element.classList)
element.classList.add(className);
else
element.className += ' ' + className;
}
},
removeClass(element, className) {
if (element && className) {
if (element.classList)
element.classList.remove(className);
else
element.className = element.className.replace(new RegExp('(^|\\b)' + className.split(' ').join('|') + '(\\b|$)', 'gi'), ' ');
}
},
hasClass(element, className) {
@ -145,32 +161,42 @@ export default {
},
find(element, selector) {
return element.querySelectorAll(selector);
return element ? element.querySelectorAll(selector) : [];
},
findSingle(element, selector) {
if (element) {
return element.querySelector(selector);
}
return null;
},
getHeight(el) {
if (el) {
let height = el.offsetHeight;
let style = getComputedStyle(el);
height -= parseFloat(style.paddingTop) + parseFloat(style.paddingBottom) + parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth);
return height;
}
return 0;
},
getWidth(el) {
if (el) {
let width = el.offsetWidth;
let style = getComputedStyle(el);
width -= parseFloat(style.paddingLeft) + parseFloat(style.paddingRight) + parseFloat(style.borderLeftWidth) + parseFloat(style.borderRightWidth);
return width;
}
return 0;
},
absolutePosition(element, target) {
if (element) {
let elementDimensions = element.offsetParent ? { width: element.offsetWidth, height: element.offsetHeight } : this.getHiddenElementDimensions(element)
let elementOuterHeight = elementDimensions.height;
let elementOuterWidth = elementDimensions.width;
@ -202,9 +228,11 @@ export default {
element.style.top = top + 'px';
element.style.left = left + 'px';
}
},
relativePosition(element, target) {
if (element) {
let elementDimensions = element.offsetParent ? { width: element.offsetWidth, height: element.offsetHeight } : this.getHiddenElementDimensions(element);
const targetHeight = target.offsetHeight;
const targetOffset = target.getBoundingClientRect();
@ -238,6 +266,7 @@ export default {
element.style.top = top + 'px';
element.style.left = left + 'px';
}
},
getParents(element, parents = []) {
@ -277,6 +306,7 @@ export default {
},
getHiddenElementOuterHeight(element) {
if (element) {
element.style.visibility = 'hidden';
element.style.display = 'block';
let elementHeight = element.offsetHeight;
@ -284,9 +314,12 @@ export default {
element.style.visibility = 'visible';
return elementHeight;
}
return 0;
},
getHiddenElementOuterWidth(element) {
if (element) {
element.style.visibility = 'hidden';
element.style.display = 'block';
let elementWidth = element.offsetWidth;
@ -294,10 +327,13 @@ export default {
element.style.visibility = 'visible';
return elementWidth;
}
return 0;
},
getHiddenElementDimensions(element) {
var dimensions = {};
if (element) {
let dimensions = {};
element.style.visibility = 'hidden';
element.style.display = 'block';
dimensions.width = element.offsetWidth;
@ -306,14 +342,17 @@ export default {
element.style.visibility = 'visible';
return dimensions;
}
return 0;
},
fadeIn(element, duration) {
if (element) {
element.style.opacity = 0;
var last = +new Date();
var opacity = 0;
var tick = function () {
let last = +new Date();
let opacity = 0;
let tick = function () {
opacity = +element.style.opacity + (new Date().getTime() - last) / duration;
element.style.opacity = opacity;
last = +new Date();
@ -324,10 +363,12 @@ export default {
};
tick();
}
},
fadeOut(element, ms) {
var opacity = 1,
if (element) {
let opacity = 1,
interval = 50,
duration = ms,
gap = interval / duration;
@ -342,6 +383,7 @@ export default {
element.style.opacity = opacity;
}, interval);
}
},
getUserAgent() {
@ -446,7 +488,7 @@ export default {
},
isVisible(element) {
return element.offsetParent != null;
return element && element.offsetParent != null;
},
invokeElementMethod(element, methodName, args) {
@ -457,12 +499,14 @@ export default {
return !!(typeof window !== 'undefined' && window.document && window.document.createElement);
},
getFocusableElements(element) {
let focusableElements = this.find(element, `button:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden]),
[href][clientHeight][clientWidth]:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden]),
input:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden]), select:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden]),
textarea:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden]), [tabIndex]:not([tabIndex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden]),
[contenteditable]:not([tabIndex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden])`
getFocusableElements(element, selector = '') {
let focusableElements = this.find(element, `button:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden])${selector},
[href][clientHeight][clientWidth]:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden])${selector},
input:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden])${selector},
select:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden])${selector},
textarea:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden])${selector},
[tabIndex]:not([tabIndex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden])${selector},
[contenteditable]:not([tabIndex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden])${selector}`
);
let visibleFocusableElements = [];
@ -474,8 +518,8 @@ export default {
return visibleFocusableElements;
},
getFirstFocusableElement(element) {
const focusableElements = this.getFocusableElements(element);
getFirstFocusableElement(element, selector) {
const focusableElements = this.getFocusableElements(element, selector);
return focusableElements.length > 0 ? focusableElements[0] : null;
},