@wix/design-system
Version:
@wix/design-system
416 lines • 16.6 kB
JavaScript
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/esm/Highlighter/test/Highlighter.spec.jsx";
import _regeneratorRuntime from "@babel/runtime/regenerator";
import React from 'react';
import Highlighter from '..';
import { createRendererWithUniDriver, cleanup } from '../../utils/test-utils/unit';
import { highlighterDriverFactory as highlighterUniDriverFactory } from '../Highlighter.uni.driver';
describe('Highlighter', function () {
afterEach(cleanup);
describe('[async]', function () {
runTests(createRendererWithUniDriver(highlighterUniDriverFactory));
});
function runTests(render) {
var _this = this;
it('should show highlighted text', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
var expectedResult, _render, driver;
return _regeneratorRuntime.wrap(function _callee$(_context) {
while (1) switch (_context.prev = _context.next) {
case 0:
expectedResult = '<span><strong>Opt</strong><span>ion 1</span></span>';
_render = render(/*#__PURE__*/React.createElement(Highlighter, {
match: "Opt",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 22,
columnNumber: 9
}
}, "Option 1")), driver = _render.driver;
_context.t0 = expect;
_context.next = 5;
return driver.exists();
case 5:
_context.t1 = _context.sent;
(0, _context.t0)(_context.t1).toEqual(true);
_context.t2 = expect;
_context.next = 10;
return driver.html();
case 10:
_context.t3 = _context.sent;
(0, _context.t2)(_context.t3).toEqual(expectedResult);
_context.t4 = expect;
_context.next = 15;
return driver.getElement();
case 15:
_context.t5 = _context.sent.outerHTML;
(0, _context.t4)(_context.t5).toEqual('<span><span><strong>Opt</strong><span>ion 1</span></span></span>');
case 17:
case "end":
return _context.stop();
}
}, _callee);
})));
it('should show highlighted text on first children level', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
var expectedResult, _render2, driver;
return _regeneratorRuntime.wrap(function _callee2$(_context2) {
while (1) switch (_context2.prev = _context2.next) {
case 0:
expectedResult = "<div><span><strong>Opt</strong><span>ion 1</span></span></div>";
_render2 = render(/*#__PURE__*/React.createElement(Highlighter, {
match: "Opt",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 36,
columnNumber: 9
}
}, /*#__PURE__*/React.createElement("div", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 37,
columnNumber: 11
}
}, "Option 1"))), driver = _render2.driver;
_context2.t0 = expect;
_context2.next = 5;
return driver.html();
case 5:
_context2.t1 = _context2.sent;
(0, _context2.t0)(_context2.t1).toEqual(expectedResult);
case 7:
case "end":
return _context2.stop();
}
}, _callee2);
})));
it('should show highlighted text on second children level', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
var expectedResult, _render3, driver;
return _regeneratorRuntime.wrap(function _callee3$(_context3) {
while (1) switch (_context3.prev = _context3.next) {
case 0:
expectedResult = "<span><span><span><strong>Opt</strong><span>ion</span></span></span></span>";
_render3 = render(/*#__PURE__*/React.createElement(Highlighter, {
match: "Opt",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 48,
columnNumber: 9
}
}, /*#__PURE__*/React.createElement("span", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 49,
columnNumber: 11
}
}, /*#__PURE__*/React.createElement("span", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 50,
columnNumber: 13
}
}, "Option")))), driver = _render3.driver;
_context3.t0 = expect;
_context3.next = 5;
return driver.html();
case 5:
_context3.t1 = _context3.sent;
(0, _context3.t0)(_context3.t1).toEqual(expectedResult);
case 7:
case "end":
return _context3.stop();
}
}, _callee3);
})));
it('should show highlighted text on array of children', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
var expectedResult, _render4, driver;
return _regeneratorRuntime.wrap(function _callee4$(_context4) {
while (1) switch (_context4.prev = _context4.next) {
case 0:
expectedResult = "<div><span><span><strong>Opt</strong><span>ion 1</span></span></span></div><div><span><span><strong>Opt</strong><span>ion 2</span></span></span></div>";
_render4 = render(/*#__PURE__*/React.createElement(Highlighter, {
match: "Opt",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 62,
columnNumber: 9
}
}, /*#__PURE__*/React.createElement("div", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 63,
columnNumber: 11
}
}, /*#__PURE__*/React.createElement("span", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 64,
columnNumber: 13
}
}, "Option 1")), /*#__PURE__*/React.createElement("div", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 66,
columnNumber: 11
}
}, /*#__PURE__*/React.createElement("span", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 67,
columnNumber: 13
}
}, "Option 2")))), driver = _render4.driver;
_context4.t0 = expect;
_context4.next = 5;
return driver.html();
case 5:
_context4.t1 = _context4.sent;
(0, _context4.t0)(_context4.t1).toEqual(expectedResult);
case 7:
case "end":
return _context4.stop();
}
}, _callee4);
})));
it('should show highlighted text on array of different children type', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
var expectedResult, _render5, driver;
return _regeneratorRuntime.wrap(function _callee5$(_context5) {
while (1) switch (_context5.prev = _context5.next) {
case 0:
expectedResult = "<span><strong>Opt</strong><span>ion 2</span></span><div><span><span><strong>Opt</strong><span>ion 1</span></span></span></div>";
_render5 = render(/*#__PURE__*/React.createElement(Highlighter, {
match: "Opt",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 79,
columnNumber: 9
}
}, "Option 2", /*#__PURE__*/React.createElement("div", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 81,
columnNumber: 11
}
}, /*#__PURE__*/React.createElement("span", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 82,
columnNumber: 13
}
}, "Option 1")))), driver = _render5.driver;
_context5.t0 = expect;
_context5.next = 5;
return driver.html();
case 5:
_context5.t1 = _context5.sent;
(0, _context5.t0)(_context5.t1).toEqual(expectedResult);
case 7:
case "end":
return _context5.stop();
}
}, _callee5);
})));
it('should show highlighted text on multiple match occurrences', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee6() {
var expectedResult, _render6, driver;
return _regeneratorRuntime.wrap(function _callee6$(_context6) {
while (1) switch (_context6.prev = _context6.next) {
case 0:
expectedResult = "<aside><span><span>O</span><strong>p</strong><span>tion</span><strong>p</strong></span></aside>";
_render6 = render(/*#__PURE__*/React.createElement(Highlighter, {
match: "p",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 94,
columnNumber: 9
}
}, /*#__PURE__*/React.createElement("aside", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 95,
columnNumber: 11
}
}, "Optionp"))), driver = _render6.driver;
_context6.t0 = expect;
_context6.next = 5;
return driver.html();
case 5:
_context6.t1 = _context6.sent;
(0, _context6.t0)(_context6.t1).toEqual(expectedResult);
case 7:
case "end":
return _context6.stop();
}
}, _callee6);
})));
it('should not be caseSensitive by default', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee7() {
var expectedResult, _render7, driver;
return _regeneratorRuntime.wrap(function _callee7$(_context7) {
while (1) switch (_context7.prev = _context7.next) {
case 0:
expectedResult = "<aside><span><span>O</span><strong>p</strong><span>tion</span><strong>P</strong></span></aside>";
_render7 = render(/*#__PURE__*/React.createElement(Highlighter, {
match: "p",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 106,
columnNumber: 9
}
}, /*#__PURE__*/React.createElement("aside", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 107,
columnNumber: 11
}
}, "OptionP"))), driver = _render7.driver;
_context7.t0 = expect;
_context7.next = 5;
return driver.html();
case 5:
_context7.t1 = _context7.sent;
(0, _context7.t0)(_context7.t1).toEqual(expectedResult);
case 7:
case "end":
return _context7.stop();
}
}, _callee7);
})));
it('should save styles of children', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee8() {
var expectedResult, _render8, driver;
return _regeneratorRuntime.wrap(function _callee8$(_context8) {
while (1) switch (_context8.prev = _context8.next) {
case 0:
expectedResult = "<div class=\"option-class\"><div><span><span>Arizona</span></span></div><div class=\"some-class\"></div></div>";
_render8 = render(/*#__PURE__*/React.createElement(Highlighter, {
match: "p",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 118,
columnNumber: 9
}
}, /*#__PURE__*/React.createElement("div", {
className: "option-class",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 119,
columnNumber: 11
}
}, /*#__PURE__*/React.createElement("div", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 120,
columnNumber: 13
}
}, "Arizona"), /*#__PURE__*/React.createElement("div", {
className: "some-class",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 121,
columnNumber: 13
}
})))), driver = _render8.driver;
_context8.t0 = expect;
_context8.next = 5;
return driver.html();
case 5:
_context8.t1 = _context8.sent;
(0, _context8.t0)(_context8.t1).toEqual(expectedResult);
case 7:
case "end":
return _context8.stop();
}
}, _callee8);
})));
it('should save dom structure of children', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee9() {
var expectedResult, _render9, driver;
return _regeneratorRuntime.wrap(function _callee9$(_context9) {
while (1) switch (_context9.prev = _context9.next) {
case 0:
expectedResult = "<div class=\"option-class\"><div><span><span><span><span>Arizona</span></span></span></span></div><div class=\"some-class\"><div class=\"some-class-2\"></div></div></div>";
_render9 = render(/*#__PURE__*/React.createElement(Highlighter, {
match: "p",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 133,
columnNumber: 9
}
}, /*#__PURE__*/React.createElement("div", {
className: "option-class",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 134,
columnNumber: 11
}
}, /*#__PURE__*/React.createElement("div", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 135,
columnNumber: 13
}
}, /*#__PURE__*/React.createElement("span", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 136,
columnNumber: 15
}
}, /*#__PURE__*/React.createElement("span", {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 137,
columnNumber: 17
}
}, "Arizona"))), /*#__PURE__*/React.createElement("div", {
className: "some-class",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 140,
columnNumber: 13
}
}, /*#__PURE__*/React.createElement("div", {
className: "some-class-2",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 141,
columnNumber: 15
}
}))))), driver = _render9.driver;
_context9.t0 = expect;
_context9.next = 5;
return driver.html();
case 5:
_context9.t1 = _context9.sent;
(0, _context9.t0)(_context9.t1).toEqual(expectedResult);
case 7:
case "end":
return _context9.stop();
}
}, _callee9);
})));
}
});