@gitlab/ui/dist/utils/use_mock_intersection_observer.js

GitLab UI Components

import { isMatch } from 'lodash-es';

function _arrayLikeToArray(r, a) {
  (null == a || a > r.length) && (a = r.length);
  for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
  return n;
}
function _arrayWithHoles(r) {
  if (Array.isArray(r)) return r;
}
function _iterableToArrayLimit(r, l) {
  var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
  if (null != t) {
    var e,
      n,
      i,
      u,
      a = [],
      f = !0,
      o = !1;
    try {
      if (i = (t = t.call(r)).next, 0 === l) {
        if (Object(t) !== t) return;
        f = !1;
      } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
    } catch (r) {
      o = !0, n = r;
    } finally {
      try {
        if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return;
      } finally {
        if (o) throw n;
      }
    }
    return a;
  }
}
function _nonIterableRest() {
  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
function _slicedToArray(r, e) {
  return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest();
}
function _unsupportedIterableToArray(r, a) {
  if (r) {
    if ("string" == typeof r) return _arrayLikeToArray(r, a);
    var t = {}.toString.call(r).slice(8, -1);
    return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
  }
}

/**
 * This class gives us a JSDom friendly DOM observer which we can manually trigger in tests
 *
 * Use this in place of MutationObserver or IntersectionObserver
 *
 * This class is largely influenced from [a test helper][1] in the main GitLab project
 *
 * [1]: https://gitlab.com/gitlab-org/gitlab/blob/a123813c63147392b95cd03c4744ae9db0575b0f/spec/frontend/helpers/mock_dom_observer.js#L95
 */
class MockObserver {
  constructor(cb) {
    this.$_cb = cb;
    this.$_observers = [];
  }
  observe(node) {
    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
    this.$_observers.push([node, options]);
  }
  disconnect() {
    this.$_observers = [];
  }
  takeRecords() {}
  $_triggerObserve(nodeParam) {
    let _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
      _ref$entry = _ref.entry,
      entry = _ref$entry === void 0 ? {} : _ref$entry,
      _ref$options = _ref.options,
      options = _ref$options === void 0 ? {} : _ref$options;
    const nodes = this.$_getNodesFromParam(nodeParam);
    nodes.forEach(node => {
      if (this.$_hasObserver(node, options)) {
        this.$_cb([{
          target: node,
          ...entry
        }]);
      }
    });
  }
  $_hasObserver(node) {
    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
    return this.$_observers.some(_ref2 => {
      let _ref3 = _slicedToArray(_ref2, 2),
        obvNode = _ref3[0],
        obvOptions = _ref3[1];
      return node === obvNode && isMatch(options, obvOptions);
    });
  }
  $_getNodesFromParam(nodeParam) {
    if (!nodeParam) {
      return this.$_observers.map(_ref4 => {
        let _ref5 = _slicedToArray(_ref4, 1),
          node = _ref5[0];
        return node;
      });
    }
    if (!Array.isArray(nodeParam)) {
      return [nodeParam];
    }
    return nodeParam;
  }
}
class MockIntersectionObserver extends MockObserver {
  unobserve(node) {
    this.$_observers = this.$_observers.filter(_ref6 => {
      let _ref7 = _slicedToArray(_ref6, 1),
        obvNode = _ref7[0];
      return node !== obvNode;
    });
  }
}
const useMockIntersectionObserver = () => {
  let instances;
  let origObserver;
  beforeEach(() => {
    instances = [];
    origObserver = global.IntersectionObserver;
    global.IntersectionObserver = jest.fn().mockImplementation(function () {
      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
        args[_key] = arguments[_key];
      }
      const mockObserver = new MockIntersectionObserver(...args);
      instances.push(mockObserver);
      return mockObserver;
    });
  });
  afterEach(() => {
    instances = [];
    global.IntersectionObserver = origObserver;
  });
  const trigger = function (observer) {
    for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
      args[_key2 - 1] = arguments[_key2];
    }
    observer.$_triggerObserve(...args);
  };
  const getInstances = () => {
    return instances;
  };
  return {
    getInstances,
    trigger
  };
};

export { useMockIntersectionObserver };