@wix/design-system/dist/cjs/Range/test/Range.visual.js

@wix/design-system

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireDefault(require("react"));
var _react2 = require("@storybook/react");
var _vanilla = require("@wix/wix-ui-test-utils/vanilla");
var _Range = _interopRequireDefault(require("../Range"));
var _InputUni = _interopRequireDefault(require("../../Input/Input.uni.driver"));
var _Input = _interopRequireDefault(require("../../Input"));
var _DatePicker = _interopRequireDefault(require("../../DatePicker"));
var _excluded = ["index"],
  _excluded2 = ["index"];
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/Range/test/Range.visual.jsx",
  _this = void 0;
var dataHooks = {
  focusedInput: 'focused-input',
  focusedDatePicker: 'focused-date-picker',
  input: 'wsr-input'
};
var datePickerDate = new Date('2020-01-01');
var focusInput = function focusInput(index) {
  var node = document.body;
  var dataHookSelector = "[data-hook*=".concat(dataHooks.input, "]");
  var elements = node.querySelectorAll(dataHookSelector);
  elements[index].click();
  elements[index].focus();
};
var FocusedInput = function FocusedInput(_ref) {
  var index = _ref.index,
    props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
  _react["default"].useEffect(function () {
    focusInput(index);
  }, [index]);
  return /*#__PURE__*/_react["default"].createElement(_Input["default"], (0, _extends2["default"])({
    placeholder: "placeholder",
    dataHook: dataHooks.focusedInput
  }, props, {
    __self: _this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 33,
      columnNumber: 5
    }
  }));
};
var FocusedDatePicker = function FocusedDatePicker(_ref2) {
  var index = _ref2.index,
    props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
  _react["default"].useEffect(function () {
    focusInput(index);
  }, [index]);
  return /*#__PURE__*/_react["default"].createElement(_DatePicker["default"], (0, _extends2["default"])({
    placeholderText: "placeholder",
    dataHook: dataHooks.focusedDatePicker,
    value: datePickerDate
  }, props, {
    __self: _this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 47,
      columnNumber: 5
    }
  }));
};
var tests = [{
  describe: 'input',
  its: [{
    it: 'two elements',
    renderedComponent: /*#__PURE__*/_react["default"].createElement(_Range["default"], {
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 63,
        columnNumber: 11
      }
    }, /*#__PURE__*/_react["default"].createElement(_Input["default"], {
      placeholder: "placeholder",
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 64,
        columnNumber: 13
      }
    }), /*#__PURE__*/_react["default"].createElement(_Input["default"], {
      placeholder: "placeholder",
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 65,
        columnNumber: 13
      }
    }))
  }, {
    it: 'three elements',
    renderedComponent: /*#__PURE__*/_react["default"].createElement(_Range["default"], {
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 72,
        columnNumber: 11
      }
    }, /*#__PURE__*/_react["default"].createElement(_Input["default"], {
      placeholder: "placeholder",
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 73,
        columnNumber: 13
      }
    }), /*#__PURE__*/_react["default"].createElement(_Input["default"], {
      placeholder: "placeholder",
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 74,
        columnNumber: 13
      }
    }), /*#__PURE__*/_react["default"].createElement(_Input["default"], {
      placeholder: "placeholder",
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 75,
        columnNumber: 13
      }
    }))
  }]
}, {
  describe: 'datePicker',
  its: [{
    it: 'two elements',
    renderedComponent: /*#__PURE__*/_react["default"].createElement(_Range["default"], {
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 87,
        columnNumber: 11
      }
    }, /*#__PURE__*/_react["default"].createElement(_DatePicker["default"], {
      value: datePickerDate,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 88,
        columnNumber: 13
      }
    }), /*#__PURE__*/_react["default"].createElement(_DatePicker["default"], {
      value: datePickerDate,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 89,
        columnNumber: 13
      }
    }))
  }, {
    it: 'three elements',
    renderedComponent: /*#__PURE__*/_react["default"].createElement(_Range["default"], {
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 96,
        columnNumber: 11
      }
    }, /*#__PURE__*/_react["default"].createElement(_DatePicker["default"], {
      value: datePickerDate,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 97,
        columnNumber: 13
      }
    }), /*#__PURE__*/_react["default"].createElement(_DatePicker["default"], {
      value: datePickerDate,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 98,
        columnNumber: 13
      }
    }), /*#__PURE__*/_react["default"].createElement(_DatePicker["default"], {
      value: datePickerDate,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 99,
        columnNumber: 13
      }
    }))
  }]
}, {
  describe: 'focus',
  its: [{
    it: 'first input',
    renderedComponent: /*#__PURE__*/_react["default"].createElement(_Range["default"], {
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 111,
        columnNumber: 11
      }
    }, /*#__PURE__*/_react["default"].createElement(FocusedInput, {
      index: 0,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 112,
        columnNumber: 13
      }
    }), /*#__PURE__*/_react["default"].createElement(_Input["default"], {
      placeholder: "placeholder",
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 113,
        columnNumber: 13
      }
    }))
  }, {
    it: 'last input',
    renderedComponent: /*#__PURE__*/_react["default"].createElement(_Range["default"], {
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 120,
        columnNumber: 11
      }
    }, /*#__PURE__*/_react["default"].createElement(_Input["default"], {
      placeholder: "placeholder",
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 121,
        columnNumber: 13
      }
    }), /*#__PURE__*/_react["default"].createElement(FocusedInput, {
      index: 1,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 122,
        columnNumber: 13
      }
    }))
  }, {
    it: 'first datePicker',
    renderedComponent: /*#__PURE__*/_react["default"].createElement(_Range["default"], {
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 129,
        columnNumber: 11
      }
    }, /*#__PURE__*/_react["default"].createElement(FocusedDatePicker, {
      index: 0,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 130,
        columnNumber: 13
      }
    }), /*#__PURE__*/_react["default"].createElement(_DatePicker["default"], {
      value: datePickerDate,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 131,
        columnNumber: 13
      }
    }))
  }, {
    it: 'last datePicker',
    renderedComponent: /*#__PURE__*/_react["default"].createElement(_Range["default"], {
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 138,
        columnNumber: 11
      }
    }, /*#__PURE__*/_react["default"].createElement(_DatePicker["default"], {
      value: datePickerDate,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 139,
        columnNumber: 13
      }
    }), /*#__PURE__*/_react["default"].createElement(FocusedDatePicker, {
      index: 1,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 140,
        columnNumber: 13
      }
    }))
  }]
}];
tests.forEach(function (_ref3) {
  var describe = _ref3.describe,
    its = _ref3.its;
  return its.forEach(function (_ref4) {
    var it = _ref4.it,
      renderedComponent = _ref4.renderedComponent;
    (0, _react2.storiesOf)("Range/".concat(describe), module).add(it, function () {
      return renderedComponent;
    });
  });
});