@wix/design-system/dist/cjs/InputWithOptions/test/InputWithOptions.legacy.spec.js

@wix/design-system

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _react = _interopRequireDefault(require("react"));
var _InputWithOptions = _interopRequireDefault(require("../InputWithOptions.driver"));
var _react2 = require("@testing-library/react");
var _InputWithOptions2 = _interopRequireDefault(require("../InputWithOptions"));
var _react3 = require("../../utils/test-utils/react");
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/InputWithOptions/test/InputWithOptions.legacy.spec.jsx",
  _this = void 0;
var options = [{
  id: 0,
  value: 'Option 1'
}, {
  id: 1,
  value: 'Option 2'
}, {
  id: 2,
  value: 'Option 3',
  disabled: true
}, {
  id: 3,
  value: 'Option 4'
}, {
  id: 'divider1',
  value: '-'
}, {
  id: 'element1',
  value: /*#__PURE__*/_react["default"].createElement("span", {
    style: {
      color: 'brown'
    },
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 15,
      columnNumber: 12
    }
  }, "Option 4")
}, {
  id: 5,
  value: 'An option with a veryyyyyyyyy long text that exceeds the input'
}];
describe('InputWithOptions legacy testkit', function () {
  var setup = function setup() {
    var DATA_HOOK = 'testing';
    var _renderLegacy = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_InputWithOptions2["default"], {
        options: options,
        dataHook: DATA_HOOK,
        __self: _this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 28,
          columnNumber: 7
        }
      })),
      baseElement = _renderLegacy.baseElement;
    return (0, _InputWithOptions["default"])({
      element: baseElement,
      dataHook: DATA_HOOK
    });
  };
  it('should pass', function () {
    var _setup = setup(),
      driver = _setup.driver,
      inputDriver = _setup.inputDriver,
      dropdownLayoutDriver = _setup.dropdownLayoutDriver;
    expect(driver.exists()).toBeTruthy();
    expect(dropdownLayoutDriver.exists()).toBe(false);
    (0, _react3.act)(function () {
      inputDriver.click();
    });
    expect(dropdownLayoutDriver.exists()).toBe(true);
    (0, _react3.act)(function () {
      // dropdownLayoutDriver.clickAtOption(0); // or:
      driver.selectOptionById(0);
    });
    (0, _react2.waitFor)(function () {
      expect(dropdownLayoutDriver.exists()).toBe(false);
    });
  });
  it('should blur', function () {
    var _setup2 = setup(),
      driver = _setup2.driver,
      inputDriver = _setup2.inputDriver,
      dropdownLayoutDriver = _setup2.dropdownLayoutDriver;
    expect(driver.exists()).toBeTruthy();
    expect(dropdownLayoutDriver.isShown()).toBe(false);
    (0, _react3.act)(function () {
      inputDriver.click();
    });
    expect(dropdownLayoutDriver.isShown()).toBe(true);
    (0, _react3.act)(function () {
      driver.blur();
    });
    (0, _react2.waitFor)(function () {
      expect(dropdownLayoutDriver.isShown()).toBe(false);
    });
  });
  it('should close dropdown on Escape', function () {
    var _setup3 = setup(),
      driver = _setup3.driver,
      dropdownLayoutDriver = _setup3.dropdownLayoutDriver;
    expect(driver.exists()).toBeTruthy();
    expect(dropdownLayoutDriver.isShown()).toBe(false);
    driver.pressKey('ArrowDown');
    (0, _react2.waitFor)(function () {
      expect(dropdownLayoutDriver.isShown()).toBe(true);
    });
    driver.pressKey('Enter');
    (0, _react2.waitFor)(function () {
      expect(dropdownLayoutDriver.isShown()).toBe(false);
    });
    driver.pressKey('Escape');
    expect(dropdownLayoutDriver.isShown()).toBe(false);
  });
});