@elastic/eui/optimize/es/test/rtl/component_helpers.js

Elastic UI Component Library

import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import _regeneratorRuntime from "@babel/runtime/regenerator";
/*
 * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
 * or more contributor license agreements. Licensed under the Elastic License
 * 2.0 and the Server Side Public License, v 1; you may not use this file except
 * in compliance with, at your election, the Elastic License 2.0 or the Server
 * Side Public License, v 1.
 */

import '@testing-library/jest-dom';
import { waitFor, fireEvent } from '@testing-library/react';
import { screen } from './custom_render';

/**
 * Ensure the EuiPopover being tested is open/closed before continuing
 * Note: Because EuiPopover is portalled, we want to query `document`
 * instead of the `container` returned by RTL's render()
 */
export var waitForEuiPopoverOpen = /*#__PURE__*/function () {
  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
    return _regeneratorRuntime.wrap(function _callee$(_context) {
      while (1) switch (_context.prev = _context.next) {
        case 0:
          _context.next = 2;
          return waitFor(function () {
            var openPopover = document.querySelector('[data-popover-open]');
            expect(openPopover).toBeTruthy();
          });
        case 2:
          return _context.abrupt("return", _context.sent);
        case 3:
        case "end":
          return _context.stop();
      }
    }, _callee);
  }));
  return function waitForEuiPopoverOpen() {
    return _ref.apply(this, arguments);
  };
}();
export var waitForEuiPopoverClose = /*#__PURE__*/function () {
  var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
      while (1) switch (_context2.prev = _context2.next) {
        case 0:
          _context2.next = 2;
          return waitFor(function () {
            var openPopover = document.querySelector('[data-popover-open]');
            expect(openPopover).toBeFalsy();
          });
        case 2:
          return _context2.abrupt("return", _context2.sent);
        case 3:
        case "end":
          return _context2.stop();
      }
    }, _callee2);
  }));
  return function waitForEuiPopoverClose() {
    return _ref2.apply(this, arguments);
  };
}();

/**
 * jsdom does not track keyboard vs. mouse input modality, so `:focus-visible`
 * always returns false. Call this before `fireEvent.focus()` on an element that
 * should be treated as keyboard-focused.
 *
 * Returns a cleanup function, call it after test assertions to restore the spy.
 */
export var simulateFocusVisible = function simulateFocusVisible(element) {
  var originalMatches = Element.prototype.matches.bind(element);
  var spy = jest.spyOn(element, 'matches').mockImplementation(function (selector) {
    return selector === ':focus-visible' ? true : originalMatches(selector);
  });
  return function () {
    return spy.mockRestore();
  };
};

/**
 * Prefer this over `fireEvent.focus()` in tooltip tests. Plain `fireEvent.focus`
 * does not set `:focus-visible` in jsdom and will not trigger the tooltip.
 *
 * Returns a cleanup function to restore the mock after assertions.
 */
export var focusEuiToolTipTrigger = function focusEuiToolTipTrigger(element) {
  var cleanup = simulateFocusVisible(element);
  fireEvent.focus(element);
  return cleanup;
};

/**
 * EuiComboBox
 */

export var showEuiComboBoxOptions = /*#__PURE__*/function () {
  var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
    return _regeneratorRuntime.wrap(function _callee3$(_context3) {
      while (1) switch (_context3.prev = _context3.next) {
        case 0:
          fireEvent.click(screen.getByTestSubject('comboBoxToggleListButton'));
          _context3.next = 3;
          return waitForEuiPopoverOpen();
        case 3:
          _context3.next = 5;
          return waitFor(function () {
            expect(screen.getByRole('listbox')).toBeInTheDocument();
          });
        case 5:
        case "end":
          return _context3.stop();
      }
    }, _callee3);
  }));
  return function showEuiComboBoxOptions() {
    return _ref3.apply(this, arguments);
  };
}();

/**
 * EuiContextMenu
 */

export var waitForEuiContextMenuPanelTransition = /*#__PURE__*/function () {
  var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
    var getPanels;
    return _regeneratorRuntime.wrap(function _callee4$(_context4) {
      while (1) switch (_context4.prev = _context4.next) {
        case 0:
          // Used document instead of container or screen due to context menus living in portals
          getPanels = function getPanels() {
            return document.querySelectorAll('.euiContextMenuPanel');
          }; // 2 panels will appear for the transition animation
          _context4.next = 3;
          return waitFor(function () {
            expect(getPanels().length).toEqual(2);
          });
        case 3:
          // Outgoing panel will be removed on animation end
          fireEvent.animationEnd(getPanels()[0]);
          if (getPanels().length > 1) {
            fireEvent.animationEnd(getPanels()[1]);
          }

          // Transition/animation is done once we're back to 1 panel
          expect(getPanels().length).toEqual(1);
        case 6:
        case "end":
          return _context4.stop();
      }
    }, _callee4);
  }));
  return function waitForEuiContextMenuPanelTransition() {
    return _ref4.apply(this, arguments);
  };
}();