vtils/_cjs/utils/isElementVisible.js

一个面向业务的 JavaScript/TypeScript 实用程序库。

"use strict";

exports.__esModule = true;
exports.isElementVisible = isElementVisible;
// ref: https://github.com/LuizAsFight/is-element-visible/blob/master/src/index.js

// @ts-nocheck
var isOverflowHidden = function isOverflowHidden(el) {
  return getComputedStyle(el, 'overflow') === 'hidden';
};
var getComputedStyle = function getComputedStyle(el, property) {
  var computedStyle = window.getComputedStyle ? document.defaultView.getComputedStyle(el, null) : el.currentStyle;
  return property ? computedStyle[property] : computedStyle;
};
var isOnDocument = function isOnDocument(el) {
  while (el = el.parentNode) {
    if (el === document) return true;
  }
  return false;
};
var isVisibleDueToOverflow = function isVisibleDueToOverflow(el) {
  var elPositioning = getPositioning(el.getBoundingClientRect());
  while (el = el.parentNode) {
    if (el.nodeType !== 9 && isOverflowHidden(el)) {
      var parentElPositioning = getPositioning(el.getBoundingClientRect());
      var isElInsideParentRectX = elPositioning.startX >= parentElPositioning.startX && elPositioning.endX <= parentElPositioning.endX;
      var isElInsideParentRectY = elPositioning.startY >= parentElPositioning.startY && elPositioning.endY <= parentElPositioning.endY;
      if (!isElInsideParentRectX || !isElInsideParentRectY) return false;
    }
  }
  return true;
};
var getPositioning = function getPositioning(_ref) {
  var x = _ref.x,
    width = _ref.width,
    y = _ref.y,
    height = _ref.height;
  return {
    startX: parseInt(x),
    endX: parseInt(x) + parseInt(width),
    startY: parseInt(y),
    endY: parseInt(y) + parseInt(height)
  };
};

/**
 * 检查 HTML 元素是否可见。
 *
 * @param el 要检查的 HTML 元素
 */
function isElementVisible(el) {
  if (!isOnDocument(el)) return false;
  var isHiddenDueToOpacity = getComputedStyle(el, 'opacity') === '0';
  var isHiddenDueToDisplay = getComputedStyle(el, 'display') === 'none';
  var isHiddenDueToVisibility = getComputedStyle(el, 'visibility') === 'hidden';
  if (isHiddenDueToOpacity || isHiddenDueToDisplay || isHiddenDueToVisibility) return false;
  return isVisibleDueToOverflow(el);
}