wix-style-react/dist/es/src/PopoverMenu/PopoverMenu.spec.js

wix-style-react

var _this = this;

function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { step("next", value); }, function (err) { step("throw", err); }); } } return step("next"); }); }; }

import React from 'react';
import waitForCond from 'wait-for-cond';

import popoverMenuDriverFactory from './PopoverMenu.driver';
import PopoverMenu from './PopoverMenu';
import PopoverMenuItem from '../PopoverMenuItem/PopoverMenuItem';
import { createDriverFactory } from 'wix-ui-test-utils/driver-factory';
import { isTestkitExists, isEnzymeTestkitExists } from '../../test/utils/testkit-sanity';
import { popoverMenuTestkitFactory } from '../../testkit';
import { popoverMenuTestkitFactory as enzymePopoverMenuTestkitFactory } from '../../testkit/enzyme';
import { mount } from 'enzyme';

var waitFor = function waitFor(fn) {
  return waitForCond.assert(fn, 5000);
};

afterEach(function () {
  // under the hood PopoverMenu uses Tooltip component, which renders straight into document.body
  // thus need to keep it maintained
  document.body.innerHTML = '';
});

var menuItemDataHook = 'myItemDataHook';

describe('PopoverMenu', function () {
  var createDriver = createDriverFactory(popoverMenuDriverFactory);

  it('should render trigger button', function () {
    var driver = createDriver(React.createElement(PopoverMenu, null));

    expect(driver.exists()).toBe(true);
  });

  it('should render popover menu on trigger button click', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
    var menuItem1Text, menuItem1Listener, driver;
    return regeneratorRuntime.wrap(function _callee$(_context) {
      while (1) {
        switch (_context.prev = _context.next) {
          case 0:
            menuItem1Text = 'Menu Item';
            menuItem1Listener = jest.fn();
            driver = createDriver(React.createElement(
              PopoverMenu,
              null,
              React.createElement(PopoverMenuItem, {
                dataHook: menuItemDataHook,
                text: menuItem1Text,
                onClick: menuItem1Listener
              }),
              React.createElement(PopoverMenuItem, { dataHook: menuItemDataHook, text: 'Menu Item #2' })
            )).init.menuItemDataHook(menuItemDataHook);


            driver.click();

            _context.next = 6;
            return waitFor(function () {
              expect(driver.menu.isShown()).toBe(true);
            });

          case 6:

            expect(driver.menu.itemsLength()).toBe(2);
            expect(driver.menu.itemContentAt(0)).toBe(menuItem1Text);

            driver.menu.clickItemAt(0);
            expect(menuItem1Listener).toBeCalled();

            _context.next = 12;
            return waitFor(function () {
              expect(driver.menu.isShown()).toBe(false);
            });

          case 12:
          case 'end':
            return _context.stop();
        }
      }
    }, _callee, _this);
  })));

  it('should not render non-existing items', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
    var driver;
    return regeneratorRuntime.wrap(function _callee2$(_context2) {
      while (1) {
        switch (_context2.prev = _context2.next) {
          case 0:
            driver = createDriver(React.createElement(
              PopoverMenu,
              null,
              React.createElement(PopoverMenuItem, { dataHook: menuItemDataHook, text: 'Menu Item #1' }),
              false && React.createElement(PopoverMenuItem, { dataHook: menuItemDataHook, text: 'Menu Item #2' })
            )).init.menuItemDataHook(menuItemDataHook);


            driver.click();

            _context2.next = 4;
            return waitFor(function () {
              expect(driver.menu.isShown()).toBe(true);
            });

          case 4:

            expect(driver.menu.itemsLength()).toBe(1);

          case 5:
          case 'end':
            return _context2.stop();
        }
      }
    }, _callee2, _this);
  })));

  it('should render item disabled', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
    var menuItem1Listener, driver;
    return regeneratorRuntime.wrap(function _callee3$(_context3) {
      while (1) {
        switch (_context3.prev = _context3.next) {
          case 0:
            menuItem1Listener = jest.fn();
            driver = createDriver(React.createElement(
              PopoverMenu,
              null,
              React.createElement(PopoverMenuItem, {
                dataHook: menuItemDataHook,
                onClick: menuItem1Listener,
                disabled: true
              })
            )).init.menuItemDataHook(menuItemDataHook);


            driver.click();

            _context3.next = 5;
            return waitFor(function () {
              expect(driver.menu.isShown()).toBe(true);
            });

          case 5:

            driver.menu.clickItemAt(0);
            expect(menuItem1Listener).not.toBeCalled();

          case 7:
          case 'end':
            return _context3.stop();
        }
      }
    }, _callee3, _this);
  })));
});

describe('Testkits', function () {
  var genPopoverMenuElement = function genPopoverMenuElement() {
    return React.createElement(
      PopoverMenu,
      null,
      React.createElement(PopoverMenuItem, { text: 'Menu Item #1' }),
      React.createElement(PopoverMenuItem, { text: 'Menu Item #2' })
    );
  };

  it('Using ReactTestUtils testkit', function () {
    expect(isTestkitExists(genPopoverMenuElement(), popoverMenuTestkitFactory)).toBe(true);
  });

  it('Using Enzyme testkit', function () {
    expect(isEnzymeTestkitExists(genPopoverMenuElement(), enzymePopoverMenuTestkitFactory, mount)).toBe(true);
  });
});