wix-style-react
Version:
wix-style-react
500 lines (402 loc) • 16.1 kB
JavaScript
'use strict';
var _eyes = require('eyes.it');
var _eyes2 = _interopRequireDefault(_eyes);
var _AutoExampleDriver = require('wix-storybook-utils/AutoExampleDriver');
var _AutoExampleDriver2 = _interopRequireDefault(_AutoExampleDriver);
var _protractor = require('wix-ui-test-utils/protractor');
var _protractor2 = require('wix-ui-core/dist/src/testkit/protractor');
var _protractor3 = require('../../testkit/protractor');
var _constants = require('./constants');
var _storySettings = require('../../stories/Text/storySettings');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
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"); }); }; }
describe('Text', function () {
var storyUrl = (0, _protractor.createStoryUrl)({
kind: _storySettings.storySettings.kind,
story: _storySettings.storySettings.storyName,
withExamples: false
});
var storyUrlWithExamples = (0, _protractor.createStoryUrl)({
kind: _storySettings.storySettings.kind,
story: _storySettings.storySettings.storyName,
withExamples: true
});
var init = function () {
var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref2) {
var url = _ref2.url,
dataHook = _ref2.dataHook;
var driver;
return regeneratorRuntime.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
_context.next = 2;
return browser.get(url);
case 2:
driver = (0, _protractor3.textTestkitFactory)({ dataHook: dataHook });
_context.next = 5;
return (0, _protractor.waitForVisibilityOf)(driver.element(), 'Cannot find Text');
case 5:
return _context.abrupt('return', driver);
case 6:
case 'end':
return _context.stop();
}
}
}, _callee, undefined);
}));
return function init(_x) {
return _ref.apply(this, arguments);
};
}();
describe('AutoExample', function () {
var driver = void 0;
beforeAll(_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 init({ url: storyUrl, dataHook: 'storybook-text' });
case 2:
driver = _context2.sent;
case 3:
case 'end':
return _context2.stop();
}
}
}, _callee2, undefined);
})));
afterEach(function () {
return _AutoExampleDriver2.default.reset();
});
_eyes2.default.it('should display correct content', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
return regeneratorRuntime.wrap(function _callee3$(_context3) {
while (1) {
switch (_context3.prev = _context3.next) {
case 0:
_context3.t0 = expect;
_context3.next = 3;
return driver.getText();
case 3:
_context3.t1 = _context3.sent;
(0, _context3.t0)(_context3.t1).toBe('Some text');
case 5:
case 'end':
return _context3.stop();
}
}
}, _callee3, undefined);
})));
_eyes2.default.it('light prop', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4() {
return regeneratorRuntime.wrap(function _callee4$(_context4) {
while (1) {
switch (_context4.prev = _context4.next) {
case 0:
_context4.next = 2;
return _eyes2.default.checkWindow('dark');
case 2:
_context4.next = 4;
return _AutoExampleDriver2.default.setProps({ light: true });
case 4:
_context4.next = 6;
return (0, _protractor.waitForVisibilityOf)(driver.element(), 'Cannot find Text');
case 6:
_context4.next = 8;
return _eyes2.default.checkWindow('light');
case 8:
case 'end':
return _context4.stop();
}
}
}, _callee4, undefined);
})));
_eyes2.default.it('size prop', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
var _iteratorNormalCompletion, _didIteratorError, _iteratorError, _iterator, _step, size;
return regeneratorRuntime.wrap(function _callee5$(_context5) {
while (1) {
switch (_context5.prev = _context5.next) {
case 0:
_iteratorNormalCompletion = true;
_didIteratorError = false;
_iteratorError = undefined;
_context5.prev = 3;
_iterator = Object.keys(_constants.SIZES)[Symbol.iterator]();
case 5:
if (_iteratorNormalCompletion = (_step = _iterator.next()).done) {
_context5.next = 16;
break;
}
size = _step.value;
_context5.next = 9;
return _AutoExampleDriver2.default.setProps({ size: size });
case 9:
_context5.next = 11;
return (0, _protractor.waitForVisibilityOf)(driver.element(), 'Cannot find Text');
case 11:
_context5.next = 13;
return _eyes2.default.checkWindow(size);
case 13:
_iteratorNormalCompletion = true;
_context5.next = 5;
break;
case 16:
_context5.next = 22;
break;
case 18:
_context5.prev = 18;
_context5.t0 = _context5['catch'](3);
_didIteratorError = true;
_iteratorError = _context5.t0;
case 22:
_context5.prev = 22;
_context5.prev = 23;
if (!_iteratorNormalCompletion && _iterator.return) {
_iterator.return();
}
case 25:
_context5.prev = 25;
if (!_didIteratorError) {
_context5.next = 28;
break;
}
throw _iteratorError;
case 28:
return _context5.finish(25);
case 29:
return _context5.finish(22);
case 30:
case 'end':
return _context5.stop();
}
}
}, _callee5, undefined, [[3, 18, 22, 30], [23,, 25, 29]]);
})));
_eyes2.default.it('skin prop', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee6() {
var _iteratorNormalCompletion2, _didIteratorError2, _iteratorError2, _iterator2, _step2, skin;
return regeneratorRuntime.wrap(function _callee6$(_context6) {
while (1) {
switch (_context6.prev = _context6.next) {
case 0:
_iteratorNormalCompletion2 = true;
_didIteratorError2 = false;
_iteratorError2 = undefined;
_context6.prev = 3;
_iterator2 = Object.keys(_constants.SKINS)[Symbol.iterator]();
case 5:
if (_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done) {
_context6.next = 16;
break;
}
skin = _step2.value;
_context6.next = 9;
return _AutoExampleDriver2.default.setProps({ skin: skin });
case 9:
_context6.next = 11;
return (0, _protractor.waitForVisibilityOf)(driver.element(), 'Cannot find Text');
case 11:
_context6.next = 13;
return _eyes2.default.checkWindow(skin);
case 13:
_iteratorNormalCompletion2 = true;
_context6.next = 5;
break;
case 16:
_context6.next = 22;
break;
case 18:
_context6.prev = 18;
_context6.t0 = _context6['catch'](3);
_didIteratorError2 = true;
_iteratorError2 = _context6.t0;
case 22:
_context6.prev = 22;
_context6.prev = 23;
if (!_iteratorNormalCompletion2 && _iterator2.return) {
_iterator2.return();
}
case 25:
_context6.prev = 25;
if (!_didIteratorError2) {
_context6.next = 28;
break;
}
throw _iteratorError2;
case 28:
return _context6.finish(25);
case 29:
return _context6.finish(22);
case 30:
case 'end':
return _context6.stop();
}
}
}, _callee6, undefined, [[3, 18, 22, 30], [23,, 25, 29]]);
})));
_eyes2.default.it('weight prop', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee7() {
var _iteratorNormalCompletion3, _didIteratorError3, _iteratorError3, _iterator3, _step3, weight;
return regeneratorRuntime.wrap(function _callee7$(_context7) {
while (1) {
switch (_context7.prev = _context7.next) {
case 0:
_iteratorNormalCompletion3 = true;
_didIteratorError3 = false;
_iteratorError3 = undefined;
_context7.prev = 3;
_iterator3 = Object.keys(_constants.WEIGHTS)[Symbol.iterator]();
case 5:
if (_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done) {
_context7.next = 16;
break;
}
weight = _step3.value;
_context7.next = 9;
return _AutoExampleDriver2.default.setProps({ weight: weight });
case 9:
_context7.next = 11;
return (0, _protractor.waitForVisibilityOf)(driver.element(), 'Cannot find Text');
case 11:
_context7.next = 13;
return _eyes2.default.checkWindow(weight);
case 13:
_iteratorNormalCompletion3 = true;
_context7.next = 5;
break;
case 16:
_context7.next = 22;
break;
case 18:
_context7.prev = 18;
_context7.t0 = _context7['catch'](3);
_didIteratorError3 = true;
_iteratorError3 = _context7.t0;
case 22:
_context7.prev = 22;
_context7.prev = 23;
if (!_iteratorNormalCompletion3 && _iterator3.return) {
_iterator3.return();
}
case 25:
_context7.prev = 25;
if (!_didIteratorError3) {
_context7.next = 28;
break;
}
throw _iteratorError3;
case 28:
return _context7.finish(25);
case 29:
return _context7.finish(22);
case 30:
case 'end':
return _context7.stop();
}
}
}, _callee7, undefined, [[3, 18, 22, 30], [23,, 25, 29]]);
})));
});
describe('with tooltip', function () {
_eyes2.default.it('should not show tooltip on hover when text is not truncated with ellipses', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee8() {
var dataHook, driver, tooltipDriver;
return regeneratorRuntime.wrap(function _callee8$(_context8) {
while (1) {
switch (_context8.prev = _context8.next) {
case 0:
dataHook = 'storybook-text';
_context8.next = 3;
return init({ url: storyUrl, dataHook: dataHook });
case 3:
driver = _context8.sent;
tooltipDriver = (0, _protractor2.tooltipTestkitFactory)({ dataHook: dataHook });
_context8.next = 7;
return (0, _protractor.waitForVisibilityOf)(driver.element(), 'Cannot find Text');
case 7:
_context8.t0 = expect;
_context8.next = 10;
return tooltipDriver.isContentElementExists();
case 10:
_context8.t1 = _context8.sent;
(0, _context8.t0)(_context8.t1).toBeFalsy();
_context8.next = 14;
return tooltipDriver.mouseEnter();
case 14:
_context8.t2 = expect;
_context8.next = 17;
return tooltipDriver.isContentElementExists();
case 17:
_context8.t3 = _context8.sent;
(0, _context8.t2)(_context8.t3).toBeFalsy();
case 19:
case 'end':
return _context8.stop();
}
}
}, _callee8, undefined);
})));
_eyes2.default.it('should show tooltip on hover when text is truncated with ellipses', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee9() {
var dataHook, driver, tooltipDriver;
return regeneratorRuntime.wrap(function _callee9$(_context9) {
while (1) {
switch (_context9.prev = _context9.next) {
case 0:
dataHook = 'text-with-ellipses';
_context9.next = 3;
return init({ url: storyUrlWithExamples, dataHook: dataHook });
case 3:
driver = _context9.sent;
tooltipDriver = (0, _protractor2.tooltipTestkitFactory)({ dataHook: dataHook });
_context9.next = 7;
return (0, _protractor.waitForVisibilityOf)(driver.element(), 'Cannot find Text');
case 7:
_context9.t0 = expect;
_context9.next = 10;
return tooltipDriver.isContentElementExists();
case 10:
_context9.t1 = _context9.sent;
(0, _context9.t0)(_context9.t1).toBeFalsy();
_context9.next = 14;
return tooltipDriver.mouseEnter();
case 14:
_context9.t2 = expect;
_context9.next = 17;
return tooltipDriver.isContentElementExists();
case 17:
_context9.t3 = _context9.sent;
(0, _context9.t2)(_context9.t3).toBeTruthy();
case 19:
case 'end':
return _context9.stop();
}
}
}, _callee9, undefined);
})));
});
describe('anchors', function () {
var testName = 'should apply link styling only to direct <a> children';
_eyes2.default.it(testName, _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee10() {
var driver;
return regeneratorRuntime.wrap(function _callee10$(_context10) {
while (1) {
switch (_context10.prev = _context10.next) {
case 0:
_context10.next = 2;
return init({
url: storyUrlWithExamples,
dataHook: 'storybook-text-link'
});
case 2:
driver = _context10.sent;
_context10.next = 5;
return (0, _protractor.scrollToElement)(driver.element());
case 5:
_context10.next = 7;
return _eyes2.default.checkWindow(testName);
case 7:
case 'end':
return _context10.stop();
}
}
}, _callee10, undefined);
})));
});
});