Commit aa80b28f by Иван Кубота

Support of async hook functions. Covered by test

parent 9f9361f0
......@@ -61,7 +61,10 @@ NS.apply = function(a,b) {
var anyTypeClsSetter = function(el, cls) {
if(typeof cls === 'function'){
cls(setters.cls(el));
var setter = setters.cls(el);
var result = cls(setter);
if(result instanceof _Promise)
result.then(setter);
}else if(typeof cls === 'object' && cls.hook){
cls.hook(setters.cls(el));
}else if(typeof cls === 'object'){
......@@ -436,6 +439,10 @@ NS.apply = function(a,b) {
};
release = subEl( hookFn );
if(release instanceof _Promise){
// TODO CHECK IF LEAKING
release.then(hookFn);
}
isNotFragment && el.__un.push(release);
}
}else if( subEl !== void 0 && subEl !== false && subEl !== null ){
......@@ -531,6 +538,8 @@ NS.apply = function(a,b) {
}
}else if(typeof token === 'function'){
args[i] = DataPieceFactory(refs, args[i]);
}else if(typeof token === 'number'){
out.push( token +'');
}
}
return depth === 0 && refs.length ? D.__cls(args, refs): out.join(' ');
......
......@@ -10,6 +10,9 @@ There is a <a href="https://www.npmjs.com/package/cms-tapir">cms-tapir package</
Library is capable of using reactive values.
Properties and children can be defined as functions. If function is presented — it would be called with a callback parameter. When callback parameter is called with some value — parameter would be updated with this value.
Async functions are also supported.
# Store
......
{
"name": "react-vanilla",
"version": "1.1.24",
"version": "1.1.26",
"description": "",
"main": "DOM.js",
"scripts": {
......@@ -21,6 +21,6 @@
"nyc": "^15.1.0",
"express": "*",
"terser": "^5.4.0",
"simplest-dom": "^0.0.20"
"simplest-dom": "^0.0.23"
}
}
......@@ -3,6 +3,12 @@ global.document = new Dom();
global.DocumentFragment = document.DocumentFragment;
require('../DOM.js')
var delay = async function(delay = 100){
await new Promise(function(resolve, reject){
setTimeout(resolve, delay)
});
};
var D = window.NS.D
const assert = require('chai').assert;
......@@ -14,7 +20,8 @@ describe('DOM lib', function(){
it( 'should create simple div with child', function(){
var div = D.div({cls: 'a b'}, 'c');
assert.equal(div.outerHTML, '<div class="a b">c</div>');
var result = div.outerHTML;
assert.equal(result, '<div class="a b">c</div>');
} );
it( 'should create simple div with attributes', function(){
......@@ -30,6 +37,22 @@ describe('DOM lib', function(){
assert.equal(div.outerHTML, '<div class="a"><div class="b"></div><div class="c"><div class="d"></div></div></div>');
} );
it( 'should work with async', async function(){
var div = D.div({
cls: async () => ((await delay(100)), 1) },
async () => ((await delay(100)), 10)
);
await delay(200);
if(div.outerHTML !== '<div data-hooked="yep" class="1">10</div>')
throw new Error(div.outerHTML);
else
return true;
} );
it( 'events', function(){
var clicked = 0
var div = D.div({onclick: ()=>clicked++});
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment