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

GitLab UI Components

import _isArray from 'lodash/isArray';
import _isMatch from 'lodash/isMatch';

function _classCallCheck(instance, Constructor) {
  if (!(instance instanceof Constructor)) {
    throw new TypeError("Cannot call a class as a function");
  }
}

function _defineProperties(target, props) {
  for (var i = 0; i < props.length; i++) {
    var descriptor = props[i];
    descriptor.enumerable = descriptor.enumerable || false;
    descriptor.configurable = true;
    if ("value" in descriptor) descriptor.writable = true;
    Object.defineProperty(target, descriptor.key, descriptor);
  }
}

function _createClass(Constructor, protoProps, staticProps) {
  if (protoProps) _defineProperties(Constructor.prototype, protoProps);
  if (staticProps) _defineProperties(Constructor, staticProps);
  return Constructor;
}

function _defineProperty(obj, key, value) {
  if (key in obj) {
    Object.defineProperty(obj, key, {
      value: value,
      enumerable: true,
      configurable: true,
      writable: true
    });
  } else {
    obj[key] = value;
  }

  return obj;
}

function ownKeys(object, enumerableOnly) {
  var keys = Object.keys(object);

  if (Object.getOwnPropertySymbols) {
    var symbols = Object.getOwnPropertySymbols(object);
    if (enumerableOnly) symbols = symbols.filter(function (sym) {
      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
    });
    keys.push.apply(keys, symbols);
  }

  return keys;
}

function _objectSpread2(target) {
  for (var i = 1; i < arguments.length; i++) {
    var source = arguments[i] != null ? arguments[i] : {};

    if (i % 2) {
      ownKeys(Object(source), true).forEach(function (key) {
        _defineProperty(target, key, source[key]);
      });
    } else if (Object.getOwnPropertyDescriptors) {
      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
    } else {
      ownKeys(Object(source)).forEach(function (key) {
        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
      });
    }
  }

  return target;
}

function _inherits(subClass, superClass) {
  if (typeof superClass !== "function" && superClass !== null) {
    throw new TypeError("Super expression must either be null or a function");
  }

  subClass.prototype = Object.create(superClass && superClass.prototype, {
    constructor: {
      value: subClass,
      writable: true,
      configurable: true
    }
  });
  if (superClass) _setPrototypeOf(subClass, superClass);
}

function _getPrototypeOf(o) {
  _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
    return o.__proto__ || Object.getPrototypeOf(o);
  };
  return _getPrototypeOf(o);
}

function _setPrototypeOf(o, p) {
  _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
    o.__proto__ = p;
    return o;
  };

  return _setPrototypeOf(o, p);
}

function _isNativeReflectConstruct() {
  if (typeof Reflect === "undefined" || !Reflect.construct) return false;
  if (Reflect.construct.sham) return false;
  if (typeof Proxy === "function") return true;

  try {
    Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
    return true;
  } catch (e) {
    return false;
  }
}

function _construct(Parent, args, Class) {
  if (_isNativeReflectConstruct()) {
    _construct = Reflect.construct;
  } else {
    _construct = function _construct(Parent, args, Class) {
      var a = [null];
      a.push.apply(a, args);
      var Constructor = Function.bind.apply(Parent, a);
      var instance = new Constructor();
      if (Class) _setPrototypeOf(instance, Class.prototype);
      return instance;
    };
  }

  return _construct.apply(null, arguments);
}

function _assertThisInitialized(self) {
  if (self === void 0) {
    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
  }

  return self;
}

function _possibleConstructorReturn(self, call) {
  if (call && (typeof call === "object" || typeof call === "function")) {
    return call;
  }

  return _assertThisInitialized(self);
}

function _createSuper(Derived) {
  var hasNativeReflectConstruct = _isNativeReflectConstruct();

  return function _createSuperInternal() {
    var Super = _getPrototypeOf(Derived),
        result;

    if (hasNativeReflectConstruct) {
      var NewTarget = _getPrototypeOf(this).constructor;

      result = Reflect.construct(Super, arguments, NewTarget);
    } else {
      result = Super.apply(this, arguments);
    }

    return _possibleConstructorReturn(this, result);
  };
}

function _slicedToArray(arr, i) {
  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
}

function _arrayWithHoles(arr) {
  if (Array.isArray(arr)) return arr;
}

function _iterableToArrayLimit(arr, i) {
  if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
  var _arr = [];
  var _n = true;
  var _d = false;
  var _e = undefined;

  try {
    for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
      _arr.push(_s.value);

      if (i && _arr.length === i) break;
    }
  } catch (err) {
    _d = true;
    _e = err;
  } finally {
    try {
      if (!_n && _i["return"] != null) _i["return"]();
    } finally {
      if (_d) throw _e;
    }
  }

  return _arr;
}

function _unsupportedIterableToArray(o, minLen) {
  if (!o) return;
  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
  var n = Object.prototype.toString.call(o).slice(8, -1);
  if (n === "Object" && o.constructor) n = o.constructor.name;
  if (n === "Map" || n === "Set") return Array.from(o);
  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
}

function _arrayLikeToArray(arr, len) {
  if (len == null || len > arr.length) len = arr.length;

  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];

  return arr2;
}

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.");
}

/**
 * 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
 */
var MockObserver = /*#__PURE__*/function () {
  function MockObserver(cb) {
    _classCallCheck(this, MockObserver);

    this.$_cb = cb;
    this.$_observers = [];
  }

  _createClass(MockObserver, [{
    key: "observe",
    value: function observe(node) {
      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
      this.$_observers.push([node, options]);
    }
  }, {
    key: "disconnect",
    value: function disconnect() {
      this.$_observers = [];
    }
  }, {
    key: "takeRecords",
    value: function takeRecords() {} // eslint-disable-next-line babel/camelcase

  }, {
    key: "$_triggerObserve",
    value: function $_triggerObserve(nodeParam) {
      var _this = this;

      var _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;

      var nodes = this.$_getNodesFromParam(nodeParam);
      nodes.forEach(function (node) {
        if (_this.$_hasObserver(node, options)) {
          _this.$_cb([_objectSpread2({
            target: node
          }, entry)]);
        }
      });
    } // eslint-disable-next-line babel/camelcase

  }, {
    key: "$_hasObserver",
    value: function $_hasObserver(node) {
      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
      return this.$_observers.some(function (_ref2) {
        var _ref3 = _slicedToArray(_ref2, 2),
            obvNode = _ref3[0],
            obvOptions = _ref3[1];

        return node === obvNode && _isMatch(options, obvOptions);
      });
    }
  }, {
    key: "$_getNodesFromParam",
    value: function $_getNodesFromParam(nodeParam) {
      if (!nodeParam) {
        return this.$_observers.map(function (_ref4) {
          var _ref5 = _slicedToArray(_ref4, 1),
              node = _ref5[0];

          return node;
        });
      }

      if (!_isArray(nodeParam)) {
        return [nodeParam];
      }

      return nodeParam;
    }
  }]);

  return MockObserver;
}();

var MockIntersectionObserver = /*#__PURE__*/function (_MockObserver) {
  _inherits(MockIntersectionObserver, _MockObserver);

  var _super = _createSuper(MockIntersectionObserver);

  function MockIntersectionObserver() {
    _classCallCheck(this, MockIntersectionObserver);

    return _super.apply(this, arguments);
  }

  _createClass(MockIntersectionObserver, [{
    key: "unobserve",
    value: function unobserve(node) {
      this.$_observers = this.$_observers.filter(function (_ref6) {
        var _ref7 = _slicedToArray(_ref6, 1),
            obvNode = _ref7[0];

        return node !== obvNode;
      });
    }
  }]);

  return MockIntersectionObserver;
}(MockObserver);

var useMockIntersectionObserver = function useMockIntersectionObserver() {
  var instances;
  var origObserver;
  beforeEach(function () {
    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];
      }

      var mockObserver = _construct(MockIntersectionObserver, args);

      instances.push(mockObserver);
      return mockObserver;
    });
  });
  afterEach(function () {
    instances = [];
    global.IntersectionObserver = origObserver;
  });

  var trigger = function trigger(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.apply(observer, args);
  };

  var getInstances = function getInstances() {
    return instances;
  };

  return {
    getInstances: getInstances,
    trigger: trigger
  };
};

export default useMockIntersectionObserver;