app-decorators
Version:
Collection of useful ES7 Decorators, writtin in ES6, that can be used for building webapps
296 lines (236 loc) • 9.63 kB
JavaScript
System.register(['app-decorators/src/libs/random-storage', 'app-decorators/src/libs/customelement', 'app-decorators/src/libs/element-to-function', 'jquery', '../../src/bootstrap', '../../src/helpers/delay'], function (_export, _context) {
"use strict";
var _storage, _Register, _elementToFunc, $, bootstrapPolyfills, delay, _this5, _createClass;
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
function _possibleConstructorReturn(self, call) {
if (!self) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return call && (typeof call === "object" || typeof call === "function") ? call : self;
}
function _inherits(subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
}
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
enumerable: false,
writable: true,
configurable: true
}
});
if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
}
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");
});
};
}
return {
setters: [function (_appDecoratorsSrcLibsRandomStorage) {
_storage = _appDecoratorsSrcLibsRandomStorage;
}, function (_appDecoratorsSrcLibsCustomelement) {
_Register = _appDecoratorsSrcLibsCustomelement;
}, function (_appDecoratorsSrcLibsElementToFunction) {
_elementToFunc = _appDecoratorsSrcLibsElementToFunction.default;
}, function (_jquery) {
$ = _jquery.default;
}, function (_srcBootstrap) {
bootstrapPolyfills = _srcBootstrap.bootstrapPolyfills;
}, function (_srcHelpersDelay) {
delay = _srcHelpersDelay.delay;
}],
execute: function () {
_this5 = this;
_createClass = function () {
function defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
}
return function (Constructor, protoProps, staticProps) {
if (protoProps) defineProperties(Constructor.prototype, protoProps);
if (staticProps) defineProperties(Constructor, staticProps);
return Constructor;
};
}();
describe('@component', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
var _ref2, component, getComponentName;
return regeneratorRuntime.wrap(function _callee2$(_context3) {
while (1) {
switch (_context3.prev = _context3.next) {
case 0:
_context3.next = 2;
return bootstrapPolyfills;
case 2:
_context3.next = 4;
return System.import('src/decorators/component');
case 4:
_ref2 = _context3.sent;
component = _ref2.component;
getComponentName = _ref2.getComponentName;
describe('getComponentName', function () {
it('should return name', function () {
var element1 = document.createElement('com-foo');
getComponentName.call(element1).should.be.equal('com-foo');
var element2 = document.createElement('img');
element2.setAttribute('is', 'my-image');
getComponentName.call(element2).should.be.equal('img[is="my-image"]');
});
});
describe('decorator', function () {
var _dec, _class, _class2, _temp, _dec2, _class3, _class4, _temp2, _dec3, _class5, _class6, _temp3, _dec4, _class7, _class8, _temp4;
var Foo = (_dec = component(), _dec(_class = (_temp = _class2 = function (_elementToFunc2) {
_inherits(Foo, _elementToFunc2);
function Foo() {
_classCallCheck(this, Foo);
return _possibleConstructorReturn(this, (Foo.__proto__ || Object.getPrototypeOf(Foo)).apply(this, arguments));
}
return Foo;
}(_elementToFunc(HTMLDivElement)), _class2.$$componentName = 'Foo', _temp)) || _class);
_Register.Register.customElement(Foo, _storage.storage.get(Foo).get('@component'));
it('should instance of HTMLElement', function () {
var foo = Foo.create();
foo.should.be.instanceOf(HTMLElement);
foo.outerHTML.should.equal('<com-foo></com-foo>');
});
// *********************** //
var Bar = (_dec2 = component({
extends: 'img'
}), _dec2(_class3 = (_temp2 = _class4 = function (_elementToFunc3) {
_inherits(Bar, _elementToFunc3);
function Bar() {
_classCallCheck(this, Bar);
return _possibleConstructorReturn(this, (Bar.__proto__ || Object.getPrototypeOf(Bar)).apply(this, arguments));
}
_createClass(Bar, [{
key: 'created',
value: function created() {
this.src = 'path/to/picture.png';
}
}], [{
key: 'extends',
get: function get() {
return 'img';
}
}]);
return Bar;
}(_elementToFunc(HTMLImageElement)), _class4.$$componentName = 'Bar', _temp2)) || _class3);
_Register.Register.customElement(Bar, _storage.storage.get(Bar).get('@component'));
it('should instance of HTMLImageElement', function () {
var bar = Bar.create();
bar.should.be.instanceOf(HTMLImageElement);
try {
bar.outerHTML.should.equal('<img src="path/to/picture.png" is="com-bar">');
} catch (e) {
bar.outerHTML.should.equal('<img is="com-bar" src="path/to/picture.png">');
}
});
// *********************** //
var Baz = (_dec3 = component({
name: 'my-bier'
}), _dec3(_class5 = (_temp3 = _class6 = function (_elementToFunc4) {
_inherits(Baz, _elementToFunc4);
function Baz() {
_classCallCheck(this, Baz);
return _possibleConstructorReturn(this, (Baz.__proto__ || Object.getPrototypeOf(Baz)).apply(this, arguments));
}
return Baz;
}(_elementToFunc(HTMLDivElement)), _class6.$$componentName = 'Baz', _temp3)) || _class5);
_Register.Register.customElement(Baz, _storage.storage.get(Baz).get('@component'));
it('should instance of HTMLElement + custom componentname', function () {
var baz = Baz.create();
baz.should.be.instanceOf(HTMLElement);
baz.outerHTML.should.equal('<my-bier></my-bier>');
});
// *********************** //
var Qux = (_dec4 = component({
name: 'my-qux',
extends: 'form'
}), _dec4(_class7 = (_temp4 = _class8 = function (_elementToFunc5) {
_inherits(Qux, _elementToFunc5);
function Qux() {
_classCallCheck(this, Qux);
return _possibleConstructorReturn(this, (Qux.__proto__ || Object.getPrototypeOf(Qux)).apply(this, arguments));
}
_createClass(Qux, [{
key: 'created',
value: function created() {
this.innerHTML = 'Hello World!';
}
}], [{
key: 'extends',
get: function get() {
return 'form';
}
}]);
return Qux;
}(_elementToFunc(HTMLFormElement)), _class8.$$componentName = 'Qux', _temp4)) || _class7);
_Register.Register.customElement(Qux, _storage.storage.get(Qux).get('@component'));
it('should instance of HTMLFormElement + custom componentname', function () {
var qux = Qux.create();
qux.should.be.instanceOf(HTMLFormElement);
qux.outerHTML.should.equal('<form is="my-qux">Hello World!</form>');
});
it('should create a element by passed @component config (name, extends) from out of dom', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
return regeneratorRuntime.wrap(function _callee$(_context2) {
while (1) {
switch (_context2.prev = _context2.next) {
case 0:
$('body').append('<form is="my-qux"></form>');
_context2.next = 3;
return delay(1);
case 3:
// test
$('form[is="my-qux"]').get(0).outerHTML.should.equal('<form is="my-qux">Hello World!</form>');
//cleanup
$('form[is="my-qux"]').remove();
case 5:
case 'end':
return _context2.stop();
}
}
}, _callee, _this5);
})));
});
case 9:
case 'end':
return _context3.stop();
}
}
}, _callee2, _this5);
})));
}
};
});
//# sourceMappingURL=component.spec.js.map