shineout
Version:
A components library for React
187 lines (183 loc) • 9.08 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports._convertCamelToDash = _convertCamelToDash;
exports.attributesTest = attributesTest;
exports.baseTest = baseTest;
exports.childrenTest = childrenTest;
exports.classContentTest = classContentTest;
exports.classTest = classTest;
exports.componentsClassTest = componentsClassTest;
exports.delay = exports.createClassName = void 0;
exports.displayTest = displayTest;
exports.hasAttributesTest = hasAttributesTest;
exports.inputPlaceholderTest = inputPlaceholderTest;
exports.inputValueTest = inputValueTest;
exports.snapshotTest = snapshotTest;
exports.snapshotTestByClick = snapshotTestByClick;
exports.styleContainTest = styleContainTest;
exports.styleContentTest = styleContentTest;
exports.styleTest = styleTest;
exports.textContentTest = textContentTest;
var _react = _interopRequireDefault(require("react"));
var _react2 = require("@testing-library/react");
var _shineoutStyle = require("@sheinx/shineout-style");
var _version = _interopRequireDefault(require("@sheinx/shineout-style/src/version"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function classTest(element, className) {
var bool = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
expect(element === null || element === void 0 ? void 0 : element.classList.contains(className)).toBe(bool);
}
function snapshotTest(component) {
var testName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
test("should render correctly ".concat(testName), function () {
var _render = (0, _react2.render)(component),
container = _render.container;
expect(container.firstChild).toMatchSnapshot();
});
}
function snapshotTestByClick(component) {
var testName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
var wrapper = arguments.length > 2 ? arguments[2] : undefined;
test("should render correctly ".concat(testName), function () {
var _render2 = (0, _react2.render)(component),
container = _render2.container;
_react2.fireEvent.click(container.querySelector('button'));
expect(document.querySelector(wrapper)).toMatchSnapshot();
});
}
function attributesTest(element, attr, content) {
expect(element.getAttribute(attr)).toBe(content);
}
function hasAttributesTest(element, attr) {
var bool = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
expect(element.hasAttribute(attr)).toBe(bool);
}
// test component class after excludes in components
function componentsClassTest(components, bool, componentClassName) {
var excludes = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
components.forEach(function (component) {
if (excludes.length && excludes.includes(component.textContent) === !bool) return;
classTest(component, componentClassName, bool);
});
}
function textContentTest(element, text) {
expect(element.textContent).toBe(text);
}
// test component class content
function classContentTest(element, name) {
var _element$getAttribute;
var bool = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
expect((_element$getAttribute = element.getAttribute('class')) === null || _element$getAttribute === void 0 ? void 0 : _element$getAttribute.includes(name)).toBe(bool);
}
function styleTest(element, style) {
attributesTest(element, 'style', style);
}
function styleContainTest(element, styleObject) {
expect(element.style).toEqual(expect.objectContaining(styleObject));
}
function styleContentTest(element, styles) {
var bool = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
var elementStyle = element.getAttribute('style');
if (Array.isArray(styles)) {
// 如果是数组,检查每个样式属性是否都存在
var allMatch = styles.every(function (style) {
return elementStyle === null || elementStyle === void 0 ? void 0 : elementStyle.includes(style);
});
expect(allMatch).toBe(bool);
} else {
// 原有的字符串匹配方式
expect(elementStyle === null || elementStyle === void 0 ? void 0 : elementStyle.includes(styles)).toBe(bool);
}
}
function baseTest(Component, selector) {
var styleV = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
backgroundColor: 'red'
};
var styleRender = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'background-color: red;';
var className = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 'demo';
var data = arguments.length > 5 ? arguments[5] : undefined;
test('should render when set style and className', function () {
var renderedComponent;
if ( /*#__PURE__*/_react.default.isValidElement(Component)) {
// 如果传递的是 JSX 元素
renderedComponent = /*#__PURE__*/_react.default.cloneElement(Component);
} else {
// 如果传递的是 React 组件类型
var _ComponentType = Component;
renderedComponent = /*#__PURE__*/(0, _jsxRuntime.jsx)(_ComponentType, {
style: styleV,
className: className,
data: data
});
}
var _render3 = (0, _react2.render)(renderedComponent),
container = _render3.container;
var component = container.querySelector(selector);
classTest(component, className);
styleTest(component, styleRender);
});
}
function childrenTest(Component, selector) {
test('should set children', function () {
var _component$querySelec;
var testContent = 'Test Children';
var children = /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
className: "test",
children: testContent
});
var _render4 = (0, _react2.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
children: children
})),
container = _render4.container;
var component = container.querySelector(selector);
expect(component).toBeTruthy();
expect(component === null || component === void 0 ? void 0 : component.querySelectorAll('.test').length).toBe(1);
expect(component === null || component === void 0 || (_component$querySelec = component.querySelector('.test')) === null || _component$querySelec === void 0 ? void 0 : _component$querySelec.textContent).toBe(testContent);
});
}
function inputValueTest(element, value) {
attributesTest(element, 'value', value);
}
function inputPlaceholderTest(element, value) {
attributesTest(element, 'placeholder', value);
}
function displayTest(Component, displayName) {
test('should start with Shineout display', function () {
expect(Component.displayName).toBe(displayName);
});
}
var delay = exports.delay = function delay(time) {
return new Promise(function (resolve) {
setTimeout(function () {
resolve();
}, time);
});
};
function _convertCamelToDash(str) {
return str.replace(/([A-Z])/g, '-$1').replace(/^-/, '').toLowerCase();
}
function convertHashClassName(componentsName, key) {
var prefix = 'soui';
return (0, _shineoutStyle.generateClassName)(_version.default, prefix, "".concat(componentsName, "-"), key);
}
// Automatically generate corresponding className according to jss type
var createClassName = exports.createClassName = function createClassName(componentsName, originClasses, originItemClasses) {
var prefix = "soui-".concat(componentsName, "-");
var classNamesMap = {};
var classes = [].concat(_toConsumableArray(originClasses), _toConsumableArray(originItemClasses));
classes.forEach(function (item) {
classNamesMap[item] = "".concat(prefix).concat(_convertCamelToDash(item));
// classNamesMap[item] = convertHashClassName(componentsName, item);
if (!originItemClasses.includes(item)) classNamesMap[item] = ".".concat(classNamesMap[item]);
});
return classNamesMap;
};