wix-style-react/dist/es/src/Input/Input.driver.js

wix-style-react

import ReactTestUtils from 'react-dom/test-utils';
import styles from './Input.scss';

var inputDriverFactory = function inputDriverFactory(_ref) {
  var element = _ref.element;

  var input = element && element.querySelector('input');
  var clearButton = element && element.querySelector('[data-hook=input-clear-button]');
  var suffixNode = element && element.querySelector('.' + styles.suffix);
  var unitNode = element && element.querySelector('.' + styles.unit);
  var magnifyingGlassNode = element && element.querySelector('.' + styles.magnifyingGlass);
  var menuArrowNode = element && element.querySelector('.' + styles.menuArrow);
  var getName = function getName() {
    return input.getAttribute('name');
  };
  var getType = function getType() {
    return input.getAttribute('type');
  };

  var driver = {
    trigger: function trigger(_trigger, event) {
      return ReactTestUtils.Simulate[_trigger](input, event);
    },
    focus: function focus(options) {
      input.focus(options);
      ReactTestUtils.Simulate.focus(input);
    },
    blur: function blur() {
      input.blur();
      ReactTestUtils.Simulate.blur(input);
    },
    getName: getName,
    getType: getType,
    keyDown: function keyDown(key) {
      return ReactTestUtils.Simulate.keyDown(input, { key: key });
    },
    click: function click() {
      return ReactTestUtils.Simulate.click(input);
    },
    clickSuffix: function clickSuffix() {
      return ReactTestUtils.Simulate.click(suffixNode);
    },
    clickClear: function clickClear() {
      return ReactTestUtils.Simulate.click(clearButton);
    },
    clickUnit: function clickUnit() {
      return ReactTestUtils.Simulate.click(unitNode);
    },
    clickMagnifyingGlass: function clickMagnifyingGlass() {
      return ReactTestUtils.Simulate.click(magnifyingGlassNode);
    },
    clickMenuArrow: function clickMenuArrow() {
      return ReactTestUtils.Simulate.click(menuArrowNode);
    },
    mouseOver: function mouseOver() {
      return ReactTestUtils.Simulate.mouseOver(input);
    },
    mouseOut: function mouseOut() {
      return ReactTestUtils.Simulate.mouseOut(input);
    },
    clearText: function clearText() {
      return driver.enterText('');
    },
    enterText: function enterText(text) {
      input.value = text;
      ReactTestUtils.Simulate.change(input, {
        target: { name: getName(), type: getType(), value: text }
      });
    },
    getValue: function getValue() {
      return input.value;
    },
    getPlaceholder: function getPlaceholder() {
      return input.placeholder;
    },
    getDefaultValue: function getDefaultValue() {
      return input.defaultValue;
    },
    getTabIndex: function getTabIndex() {
      return input.tabIndex;
    },
    getReadOnly: function getReadOnly() {
      return input.readOnly;
    },
    getTextOverflow: function getTextOverflow() {
      return input.style['text-overflow'];
    },
    getAriaLabel: function getAriaLabel() {
      return input.getAttribute('aria-label');
    },
    getAriaControls: function getAriaControls() {
      return input.getAttribute('aria-controls');
    },
    getAriaDescribedby: function getAriaDescribedby() {
      return input.getAttribute('aria-describedby');
    },
    getAutocomplete: function getAutocomplete() {
      return input.getAttribute('autocomplete');
    },
    getRequired: function getRequired() {
      return input.required;
    },
    hasPrefix: function hasPrefix() {
      return element.querySelectorAll('.' + styles.prefix).length === 1;
    },
    hasPrefixClass: function hasPrefixClass() {
      return element.querySelectorAll('.' + styles.input + '.' + styles.withPrefix).length === 1;
    },
    hasSuffix: function hasSuffix() {
      return !!suffixNode;
    },
    hasSuffixClass: function hasSuffixClass() {
      return element.querySelectorAll('.' + styles.input + '.' + styles.withSuffix).length === 1;
    },
    hasSuffixesClass: function hasSuffixesClass() {
      return element.querySelectorAll('.' + styles.input + '.' + styles.withSuffixes).length === 1;
    },
    prefixComponentExists: function prefixComponentExists(style) {
      return !!element.querySelector('.' + styles.prefix + ' ' + style);
    },
    suffixComponentExists: function suffixComponentExists(style) {
      return !!element.querySelector('.' + styles.suffix + ' ' + style);
    },
    isMenuArrowLast: function isMenuArrowLast() {
      return element.querySelectorAll('.' + styles.suffixes + ' .' + styles.suffix + ':last-child > .' + styles.menuArrow).length === 1;
    },
    hasExclamation: function hasExclamation() {
      return !!element.querySelector('.' + styles.exclamation);
    },
    isNarrowError: function isNarrowError() {
      return !!element.querySelector('.' + styles.narrow);
    },
    hasHelp: function hasHelp() {
      return !!element.querySelector('.' + styles.help);
    },
    hasError: function hasError() {
      return element.classList.contains(styles.hasError);
    },
    getTooltipElement: function getTooltipElement() {
      return element;
    },
    hasLoader: function hasLoader() {
      return element.querySelector('.loaderContainer');
    },
    getTooltipDataHook: function getTooltipDataHook() {
      return 'input-tooltip';
    },
    getDataHook: function getDataHook() {
      return element.getAttribute('data-hook');
    },
    getUnit: function getUnit() {
      return unitNode.textContent;
    },
    hasMagnifyingGlass: function hasMagnifyingGlass() {
      return !!magnifyingGlassNode;
    },
    hasMenuArrow: function hasMenuArrow() {
      return !!menuArrowNode;
    },
    hasClearButton: function hasClearButton() {
      return !!clearButton;
    },
    isRTL: function isRTL() {
      return element.className.indexOf(styles.rtl) >= 0;
    },
    isFocusedStyle: function isFocusedStyle() {
      return element.classList.contains(styles.hasFocus);
    },
    isHoveredStyle: function isHoveredStyle() {
      return element.classList.contains(styles.hasHover);
    },
    isDisabled: function isDisabled() {
      return element.classList.contains(styles.disabled);
    },
    isOfStyle: function isOfStyle(style) {
      return element.classList.contains(styles['theme-' + style]);
    },
    isOfSize: function isOfSize(size) {
      return element.classList.contains(styles['size-' + size]);
    },
    isFocus: function isFocus() {
      return document.activeElement === input;
    },
    exists: function exists() {
      return !!(element && element.querySelector('input'));
    },
    startComposing: function startComposing() {
      return ReactTestUtils.Simulate.compositionStart(input);
    },
    endComposing: function endComposing() {
      return ReactTestUtils.Simulate.compositionEnd(input);
    },
    getCursorLocation: function getCursorLocation() {
      return input.selectionStart;
    },
    getRootElementClasses: function getRootElementClasses() {
      return element.classList;
    },
    getInputElementClasses: function getInputElementClasses() {
      return input.classList;
    },
    hasRightBorderRadius: function hasRightBorderRadius() {
      return !element.classList.contains(styles.noRightBorderRadius);
    },
    hasLeftBorderRadius: function hasLeftBorderRadius() {
      return !element.classList.contains(styles.noLeftBorderRadius);
    }
  };

  return driver;
};

export default inputDriverFactory;