Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
preact - npm Package Compare versions
Comparing version 1.4.0 to 1.5.0
| { | ||
| "name": "preact", | ||
| "version": "1.4.0", | ||
| "version": "1.5.0", | ||
| "description": "Tiny & fast Component-based virtual DOM framework.", | ||
@@ -53,11 +53,4 @@ "main": "preact.js", | ||
| "uglify-js": "^2.4.24", | ||
| "webpack": "^1.12.1", | ||
| "xo": "^0.8.0" | ||
| }, | ||
| "xo": { | ||
| "esnext": true, | ||
| "ignore": [ | ||
| "*.js" | ||
| ] | ||
| "webpack": "^1.12.1" | ||
| } | ||
| } |
@@ -1,2 +0,2 @@ | ||
| !function(e,t){if("function"==typeof define&&define.amd)define(["exports"],t);else if("undefined"!=typeof exports)t(exports);else{var n={exports:{}};t(n.exports),e.preact=n.exports}}(this,function(e){"use strict";function t(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function n(e,t){var n=d(null,e),r=n._component;return r&&o(r,"componentWillMount"),t.appendChild(n),r&&o(r,"componentDidMount"),d}function r(e,t){for(var n=arguments.length,r=Array(n>2?n-2:0),a=2;n>a;a++)r[a-2]=arguments[a];var c=void 0,l=[],u=r.length,d=void 0,p=void 0;if(u){c=[];for(var f=0;u>f;f++){var h=r[f];if(!s(h)){h.join?d=h:(d=l,d[0]=h);for(var v=0;v<d.length;v++){var m=d[v],g=!s(m)&&!i(m);g&&(m=String(m)),g&&p?c[c.length-1]+=m:s(m)||c.push(m),p=g}}}}t&&t.children&&delete t.children;var y=new M(e,t||void 0,c||void 0);return o(z,"vnode",y),y}function o(e,t){for(var n=e[t],r=arguments.length,o=Array(r>2?r-2:0),i=2;r>i;i++)o[i-2]=arguments[i];return n&&"function"==typeof n?n.apply(e,o):void 0}function i(e){return e&&e.__isVNode===!0}function s(e){return null===e||void 0===e}function a(e,t){if(3===e.nodeType)return"string"==typeof t;var n=t.nodeName;return"function"==typeof n?e._componentConstructor===n:e.nodeName.toLowerCase()===n}function c(e,t){var n=e&&e._component;if(n&&e._componentConstructor===t.nodeName){var r=_(t);return n.setProps(r,T),e}return n&&u(e,n),l(t)}function l(e){var t=I.create(e.nodeName),n=_(e);t.setProps(n,w),t._render(U);var r=t.base;return r._component=t,r._componentConstructor=e.nodeName,r}function u(e,t){delete e._component,o(t,"componentWillUnmount");var n=t.base;n&&n.parentNode&&n.parentNode.removeChild(n),o(t,"componentDidUnmount"),I.collect(t)}function d(e,t,n){var r=e,i=t.nodeName;if("function"==typeof i)return c(e,t);if("string"==typeof t){if(e){if(3===e.nodeType)return e.textContent=t,e;1===e.nodeType&&F.collect(e)}return document.createTextNode(t)}(null===i||void 0===i)&&(i="x-undefined-element"),e?e.nodeName.toLowerCase()!==i?(r=F.create(i),f(r,S.call(e.childNodes)),1===e.nodeType&&F.collect(e)):e._component&&e._component!==n&&u(e,e._component):r=F.create(i);var s=y(r)||k,l=t.attributes||k;if(s!==k)for(var p in s)if(A.call(s,p)){var m=l[p];(void 0===m||null===m||m===!1)&&v(r,p,null,s[p])}if(l!==k)for(var g in l)if(A.call(l,g)){var b=l[g];if(void 0!==b&&null!==b&&b!==!1){var _=h(r,g,s[g]);b!==_&&v(r,g,b,_)}}for(var N=S.call(r.childNodes),x={},C=N.length;C--;){var w=N[C].nodeType,T=void 0;if(3===w)T=w.key;else{if(1!==w)continue;T=N[C].getAttribute("key")}T&&(x[T]=N.splice(C,1)[0])}var U=[];if(t.children)for(var C=0,P=t.children.length;P>C;C++){var R=t.children[C],D=R.attributes,T=void 0,O=void 0;if(D&&(T=D.key,O=T&&x[T]),!O){var W=N.length;if(N.length)for(var z=0;W>z;z++)if(a(N[z],R)){O=N.splice(z,1)[0];break}}U.push(d(O,R))}for(var C=0,W=U.length;W>C;C++)if(r.childNodes[C]!==U[C]){var O=U[C],L=O._component,M=r.childNodes[C+1];L&&o(L,"componentWillMount"),M?r.insertBefore(O,M):r.appendChild(O),L&&o(L,"componentDidMount")}for(var C=0,W=N.length;W>C;C++){var O=N[C],L=O._component;L&&o(L,"componentWillUnmount"),O.parentNode.removeChild(O),L?(o(L,"componentDidUnmount"),I.collect(L)):1===O.nodeType&&F.collect(O)}return r}function p(e,t,n){var r=t.split("."),o=r[0];return function(t){var i,a=this,c=e.state,l=void 0,u=void 0;for("string"==typeof n?(l=O(t,n),s(l)&&(a=a._component)&&(l=O(a,n))):l=(a.nodeName+a.type).match(/^input(checkbox|radio)$/i)?a.checked:a.value,"function"==typeof l&&(l=l.call(a)),u=0;u<r.length-1;u++)c=c[r[u]]||{};c[r[u]]=l,e.setState((i={},i[o]=e.state[o],i))}}function f(e,t){var n=t.length;if(2>=n)return e.appendChild(t[0]),void(2===n&&e.appendChild(t[1]));for(var r=document.createDocumentFragment(),o=0;n>o;o++)r.appendChild(t[o]);e.appendChild(r)}function h(e,t,n){return"class"===t?e.className:"style"===t?e.style.cssText:n}function v(e,t,n,r){"class"===t?e.className=n:"style"===t?e.style.cssText=n:m(e,t,n,r)}function m(e,t,n,r){if("on"===t.substring(0,2)){var o=V(t),i=e._listeners||(e._listeners={});return i[o]||e.addEventListener(o,g),void(i[o]=n)}var s=typeof n;null===n?e.removeAttribute(t):"function"!==s&&"object"!==s&&e.setAttribute(t,n)}function g(e){var t=this._listeners,n=t[V(e.type)];return n?n.call(this,o(z,"event",e)||e):void 0}function y(e){var t=e.attributes;return t&&t.getNamedItem?t.length?b(t):void 0:t}function b(e){for(var t={},n=e.length;n--;){var r=e[n];t[r.name]=r.value}return t}function _(e){var t=C({},e.attributes);return e.children&&(t.children=e.children),e.text&&(t._content=e.text),t}function N(e){var t="",n=": ",r="; ";for(var o in e)if(A.call(e,o)){var i=e[o];t+=G(o),t+=n,t+=i,"number"!=typeof i||A.call(R,o)||(t+="px"),t+=r}return t}function x(e){var t="";for(var n in e)e[n]&&(t&&(t+=" "),t+=n);return t}function C(e,t){for(var n in t)A.call(t,n)&&(e[n]=t[n]);return e}e.render=n,e.h=r;var k={},w={render:!1},T={renderSync:!0},U={build:!0},P="",R="boxFlex boxFlexGroup columnCount fillOpacity flex flexGrow flexPositive flexShrink flexNegative fontWeight lineClamp lineHeight opacity order orphans strokeOpacity widows zIndex zoom".split(" ").reduce(function(e,t){return e[t]=!0,e},{}),S=Array.prototype.slice,A=Object.prototype.hasOwnProperty,D=function(e){var t=arguments.length<=1||void 0===arguments[1]?{}:arguments[1];return function(n){return A.call(t,n)?t[n]:t[n]=e(n)}},O=function(e,t){return t.split(".").reduce(function(e,t){return e&&e[t]},e)},W={syncComponentUpdates:!0},z={};z.vnode=function(e){var t=e.attributes;if(t){var n=t.style;n&&!n.substring&&(t.style=N(n));var r=t["class"];A.call(t,"className")&&(r=t["class"]=t.className,delete t.className),r&&!r.substring&&(t["class"]=x(r))}};var L=function(){function e(){t(this,e),this._dirty=this._disableRendering=!1,this._linkedStates={},this.nextProps=this.base=null,this.props=o(this,"getDefaultProps")||{},this.state=o(this,"getInitialState")||{},o(this,"initialize")}return e.prototype.shouldComponentUpdate=function(e,t){return!0},e.prototype.linkState=function(e,t){var n=this._linkedStates,r=e+"|"+(t||"");return n[r]||(n[r]=p(this,e,t))},e.prototype.setState=function(e){C(this.state,e),this.triggerRender()},e.prototype.setProps=function(e){var t=arguments.length<=1||void 0===arguments[1]?k:arguments[1],n=this._disableRendering;this._disableRendering=!0,o(this,"componentWillReceiveProps",e,this.props),this.nextProps=e,this._disableRendering=n,t.renderSync&&W.syncComponentUpdates?this._render():t.render!==!1&&this.triggerRender()},e.prototype.triggerRender=function(){this._dirty||(this._dirty=!0,j.add(this))},e.prototype.render=function(e){return r("div",null,e.children)},e.prototype._render=function(e){if(!this._disableRendering){this._dirty=!1;var t=this.nextProps,n=this.state;if(this.base){if(o(this,"shouldComponentUpdate",t,n)===!1)return void(this.props=t);o(this,"componentWillUpdate",t,n)}this.props=t;var r=o(this,"render",t,n);if(this.base||e&&e.build){var i=d(this.base,r||P,this);if(this.base&&i!==this.base){var s=this.base.parentNode;s&&s.replaceChild(i,this.base)}this.base=i,o(this,"componentDidUpdate",t,n)}return r}},e}();e.Component=L;var M=function $(e,n,r){t(this,$),this.nodeName=e,this.attributes=n,this.children=r};e.VNode=M,M.prototype.__isVNode=!0;var j={items:[],itemsOffline:[],add:function(e){if(1===j.items.push(e)){var t=z.debounceRendering;t?t(j.process):setTimeout(j.process,0)}},process:function(){var e=j.items,t=e.length;if(t)for(j.items=j.itemsOffline,j.items.length=0,j.itemsOffline=e;t--;)e[t]._dirty&&e[t]._render()}},E=j.process,F={nodes:{},collect:function(e){F.clean(e);var t=F.normalizeName(e.nodeName),n=F.nodes[t];n?n.push(e):F.nodes[t]=[e]},create:function(e){var t=F.normalizeName(e),n=F.nodes[t];return n&&n.pop()||document.createElement(e)},clean:function(e){e.remove();var t=e.attributes&&e.attributes.length;if(t)for(var n=t;n--;)e.removeAttribute(e.attributes[n].name)},normalizeName:D(function(e){return e.toUpperCase()})},I={components:{},collect:function(e){var t=e.constructor.name,n=I.components[t];n?n.push(e):I.components[t]=[e]},create:function(e){var t=I.components[e.name];if(t&&t.length)for(var n=t.length;n--;)if(t[n].constructor===e)return t.splice(n,1)[0];return new e}},V=D(function(e){return e.replace(/^on/i,"").toLowerCase()}),G=D(function(e){return e.replace(/([A-Z])/,"-$1").toLowerCase()});e.options=W,e.hooks=z,e.rerender=E,e["default"]={options:W,hooks:z,render:n,rerender:E,h:r,Component:L}}); | ||
| !function(e,t){if("function"==typeof define&&define.amd)define(["exports"],t);else if("undefined"!=typeof exports)t(exports);else{var n={exports:{}};t(n.exports),e.preact=n.exports}}(this,function(e){"use strict";function t(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function n(e,t){var n=d(null,e),r=n._component;return r&&o(r,"componentWillMount"),t.appendChild(n),r&&o(r,"componentDidMount"),n}function r(e,t){for(var n=arguments.length,r=Array(n>2?n-2:0),a=2;n>a;a++)r[a-2]=arguments[a];var c=void 0,l=[],u=r.length,d=void 0,p=void 0;if(u){c=[];for(var f=0;u>f;f++){var h=r[f];if(!s(h)){h.join?d=h:(d=l,d[0]=h);for(var v=0;v<d.length;v++){var m=d[v],g=!s(m)&&!i(m);g&&(m=String(m)),g&&p?c[c.length-1]+=m:s(m)||c.push(m),p=g}}}}t&&t.children&&delete t.children;var y=new M(e,t||void 0,c||void 0);return o(z,"vnode",y),y}function o(e,t){for(var n=e[t],r=arguments.length,o=Array(r>2?r-2:0),i=2;r>i;i++)o[i-2]=arguments[i];return n&&"function"==typeof n?n.apply(e,o):void 0}function i(e){return e&&e.__isVNode===!0}function s(e){return null===e||void 0===e}function a(e,t){if(3===e.nodeType)return"string"==typeof t;var n=t.nodeName;return"function"==typeof n?e._componentConstructor===n:e.nodeName.toLowerCase()===n}function c(e,t){var n=e&&e._component;if(!t.nodeName.prototype.render)return d(e,t.nodeName(_(t))||P);if(n&&e._componentConstructor===t.nodeName){var r=_(t);return n.setProps(r,T),e}return n&&u(e,n),l(t)}function l(e){var t=I.create(e.nodeName),n=_(e);t.setProps(n,w),t._render(U);var r=t.base;return r._component=t,r._componentConstructor=e.nodeName,r}function u(e,t){delete e._component,o(t,"componentWillUnmount");var n=t.base;n&&n.parentNode&&n.parentNode.removeChild(n),o(t,"componentDidUnmount"),I.collect(t)}function d(e,t,n){var r=e,i=t.nodeName;if("function"==typeof i)return c(e,t);if("string"==typeof t){if(e){if(3===e.nodeType)return e.textContent=t,e;1===e.nodeType&&F.collect(e)}return document.createTextNode(t)}(null===i||void 0===i)&&(i="x-undefined-element"),e?e.nodeName.toLowerCase()!==i?(r=F.create(i),f(r,S.call(e.childNodes)),1===e.nodeType&&F.collect(e)):n&&e._component&&e._component!==n&&u(e,e._component):r=F.create(i);var s=y(r)||k,l=t.attributes||k;if(s!==k)for(var p in s)if(A.call(s,p)){var m=l[p];(void 0===m||null===m||m===!1)&&v(r,p,null,s[p])}if(l!==k)for(var g in l)if(A.call(l,g)){var b=l[g];if(void 0!==b&&null!==b&&b!==!1){var _=h(r,g,s[g]);b!==_&&v(r,g,b,_)}}for(var N=S.call(r.childNodes),x={},C=N.length;C--;){var w=N[C].nodeType,T=void 0;if(3===w)T=w.key;else{if(1!==w)continue;T=N[C].getAttribute("key")}T&&(x[T]=N.splice(C,1)[0])}var U=[];if(t.children)for(var C=0,P=t.children.length;P>C;C++){var R=t.children[C],D=R.attributes,T=void 0,O=void 0;if(D&&(T=D.key,O=T&&x[T]),!O){var W=N.length;if(N.length)for(var z=0;W>z;z++)if(a(N[z],R)){O=N.splice(z,1)[0];break}}U.push(d(O,R))}for(var C=0,W=U.length;W>C;C++)if(r.childNodes[C]!==U[C]){var O=U[C],L=O._component,M=r.childNodes[C+1];L&&o(L,"componentWillMount"),M?r.insertBefore(O,M):r.appendChild(O),L&&o(L,"componentDidMount")}for(var C=0,W=N.length;W>C;C++){var O=N[C],L=O._component;L&&o(L,"componentWillUnmount"),O.parentNode.removeChild(O),L?(o(L,"componentDidUnmount"),I.collect(L)):1===O.nodeType&&F.collect(O)}return r}function p(e,t,n){var r=t.split("."),o=r[0];return function(t){var i,a=this,c=e.state,l=void 0,u=void 0;for("string"==typeof n?(l=O(t,n),s(l)&&(a=a._component)&&(l=O(a,n))):l=(a.nodeName+a.type).match(/^input(checkbox|radio)$/i)?a.checked:a.value,"function"==typeof l&&(l=l.call(a)),u=0;u<r.length-1;u++)c=c[r[u]]||{};c[r[u]]=l,e.setState((i={},i[o]=e.state[o],i))}}function f(e,t){var n=t.length;if(2>=n)return e.appendChild(t[0]),void(2===n&&e.appendChild(t[1]));for(var r=document.createDocumentFragment(),o=0;n>o;o++)r.appendChild(t[o]);e.appendChild(r)}function h(e,t,n){return"class"===t?e.className:"style"===t?e.style.cssText:n}function v(e,t,n,r){"class"===t?e.className=n:"style"===t?e.style.cssText=n:m(e,t,n,r)}function m(e,t,n,r){if("on"===t.substring(0,2)){var o=V(t),i=e._listeners||(e._listeners={});return i[o]||e.addEventListener(o,g),void(i[o]=n)}var s=typeof n;null===n?e.removeAttribute(t):"function"!==s&&"object"!==s&&e.setAttribute(t,n)}function g(e){var t=this._listeners,n=t[V(e.type)];return n?n.call(this,o(z,"event",e)||e):void 0}function y(e){var t=e.attributes;return t&&t.getNamedItem?t.length?b(t):void 0:t}function b(e){for(var t={},n=e.length;n--;){var r=e[n];t[r.name]=r.value}return t}function _(e){var t=C({},e.attributes);return e.children&&(t.children=e.children),e.text&&(t._content=e.text),t}function N(e){var t="",n=": ",r="; ";for(var o in e)if(A.call(e,o)){var i=e[o];t+=G(o),t+=n,t+=i,"number"!=typeof i||A.call(R,o)||(t+="px"),t+=r}return t}function x(e){var t="";for(var n in e)e[n]&&(t&&(t+=" "),t+=n);return t}function C(e,t){for(var n in t)A.call(t,n)&&(e[n]=t[n]);return e}e.render=n,e.h=r;var k={},w={render:!1},T={renderSync:!0},U={build:!0},P="",R="boxFlex boxFlexGroup columnCount fillOpacity flex flexGrow flexPositive flexShrink flexNegative fontWeight lineClamp lineHeight opacity order orphans strokeOpacity widows zIndex zoom".split(" ").reduce(function(e,t){return e[t]=!0,e},{}),S=Array.prototype.slice,A=Object.prototype.hasOwnProperty,D=function(e){var t=arguments.length<=1||void 0===arguments[1]?{}:arguments[1];return function(n){return A.call(t,n)?t[n]:t[n]=e(n)}},O=function(e,t){return t.split(".").reduce(function(e,t){return e&&e[t]},e)},W={syncComponentUpdates:!0},z={};z.vnode=function(e){var t=e.attributes;if(t){var n=t.style;n&&!n.substring&&(t.style=N(n));var r=t["class"];A.call(t,"className")&&(r=t["class"]=t.className,delete t.className),r&&!r.substring&&(t["class"]=x(r))}};var L=function(){function e(){t(this,e),this._dirty=this._disableRendering=!1,this._linkedStates={},this.nextProps=this.base=null,this.props=o(this,"getDefaultProps")||{},this.state=o(this,"getInitialState")||{},o(this,"initialize")}return e.prototype.shouldComponentUpdate=function(e,t){return!0},e.prototype.linkState=function(e,t){var n=this._linkedStates,r=e+"|"+(t||"");return n[r]||(n[r]=p(this,e,t))},e.prototype.setState=function(e){C(this.state,e),this.triggerRender()},e.prototype.setProps=function(e){var t=arguments.length<=1||void 0===arguments[1]?k:arguments[1],n=this._disableRendering;this._disableRendering=!0,o(this,"componentWillReceiveProps",e,this.props),this.nextProps=e,this._disableRendering=n,t.render!==!1&&(t.renderSync||W.syncComponentUpdates?this._render():this.triggerRender())},e.prototype.triggerRender=function(){this._dirty||(this._dirty=!0,j.add(this))},e.prototype.render=function(e){return r("div",null,e.children)},e.prototype._render=function(e){if(!this._disableRendering){this._dirty=!1;var t=this.nextProps,n=this.state;if(this.base){if(o(this,"shouldComponentUpdate",t,n)===!1)return void(this.props=t);o(this,"componentWillUpdate",t,n)}this.props=t;var r=o(this,"render",t,n);if(this.base||e&&e.build){var i=d(this.base,r||P,this);if(this.base&&i!==this.base){var s=this.base.parentNode;s&&s.replaceChild(i,this.base)}this.base=i,o(this,"componentDidUpdate",t,n)}return r}},e}();e.Component=L;var M=function $(e,n,r){t(this,$),this.nodeName=e,this.attributes=n,this.children=r};e.VNode=M,M.prototype.__isVNode=!0;var j={items:[],itemsOffline:[],add:function(e){if(1===j.items.push(e)){var t=z.debounceRendering;t?t(j.process):setTimeout(j.process,0)}},process:function(){var e=j.items,t=e.length;if(t)for(j.items=j.itemsOffline,j.items.length=0,j.itemsOffline=e;t--;)e[t]._dirty&&e[t]._render()}},E=j.process,F={nodes:{},collect:function(e){F.clean(e);var t=F.normalizeName(e.nodeName),n=F.nodes[t];n?n.push(e):F.nodes[t]=[e]},create:function(e){var t=F.normalizeName(e),n=F.nodes[t];return n&&n.pop()||document.createElement(e)},clean:function(e){e.remove();var t=e.attributes&&e.attributes.length;if(t)for(var n=t;n--;)e.removeAttribute(e.attributes[n].name)},normalizeName:D(function(e){return e.toUpperCase()})},I={components:{},collect:function(e){var t=e.constructor.name,n=I.components[t];n?n.push(e):I.components[t]=[e]},create:function(e){var t=I.components[e.name];if(t&&t.length)for(var n=t.length;n--;)if(t[n].constructor===e)return t.splice(n,1)[0];return new e}},V=D(function(e){return e.replace(/^on/i,"").toLowerCase()}),G=D(function(e){return e.replace(/([A-Z])/,"-$1").toLowerCase()});e.options=W,e.hooks=z,e.rerender=E,e["default"]={options:W,hooks:z,render:n,rerender:E,h:r,Component:L}}); | ||
| //# sourceMappingURL=preact.js.map |
@@ -35,3 +35,3 @@ const EMPTY = {}; | ||
| if (c) hook(c, 'componentDidMount'); | ||
| return build; | ||
| return built; | ||
| } | ||
@@ -130,8 +130,10 @@ | ||
| this._disableRendering = d; | ||
| if (opts.renderSync && options.syncComponentUpdates) { | ||
| this._render(); | ||
| if (opts.render!==false) { | ||
| if (opts.renderSync || options.syncComponentUpdates) { | ||
| this._render(); | ||
| } | ||
| else { | ||
| this.triggerRender(); | ||
| } | ||
| } | ||
| else if (opts.render!==false) { | ||
| this.triggerRender(); | ||
| } | ||
| } | ||
@@ -295,2 +297,5 @@ | ||
| let c = dom && dom._component; | ||
| if (!vnode.nodeName.prototype.render) { | ||
| return build(dom, vnode.nodeName(getNodeProps(vnode)) || EMPTY_BASE); | ||
| } | ||
@@ -375,3 +380,3 @@ if (c && dom._componentConstructor===vnode.nodeName) { | ||
| } | ||
| else if (dom._component && dom._component!==rootComponent) { | ||
| else if (rootComponent && dom._component && dom._component!==rootComponent) { | ||
| unmountComponent(dom, dom._component); | ||
@@ -460,3 +465,3 @@ } | ||
| for (let i=0, len=newChildren.length; i<len; i++) { | ||
| // we're intentionally re-referencing out.childNodes here as it is a live array (akin to live NodeList) | ||
| // we're intentionally re-referencing out.childNodes here as it is a live NodeList | ||
| if (out.childNodes[i]!==newChildren[i]) { | ||
@@ -546,2 +551,5 @@ let child = newChildren[i], | ||
| } | ||
| else { | ||
| console.warn('Skipping non-dirty queued update', items[len]); | ||
| } | ||
| } | ||
@@ -548,0 +556,0 @@ } |
@@ -1,2 +0,3 @@ | ||
| import { h, render } from '../../preact'; | ||
| import { h, render, rerender, Component } from '../../src/preact'; | ||
| // import { h, render, rerender, Component } from '../../preact'; | ||
| let { expect } = chai; | ||
@@ -14,2 +15,6 @@ | ||
| beforeEach( () => { | ||
| scratch.innerHTML = ''; | ||
| }); | ||
| after( () => { | ||
@@ -20,5 +25,3 @@ scratch.parentNode.removeChild(scratch); | ||
| it('should basic empty nodes (<* />)', () => { | ||
| scratch.innerHTML = ''; | ||
| it('should create empty nodes (<* />)', () => { | ||
| render(<div />, scratch); | ||
@@ -45,5 +48,3 @@ expect(scratch.childNodes) | ||
| it('should nested empty nodes', () => { | ||
| scratch.innerHTML = ''; | ||
| it('should nest empty nodes', () => { | ||
| render(( | ||
@@ -69,4 +70,2 @@ <div> | ||
| it('should apply string attributes', () => { | ||
| scratch.innerHTML = ''; | ||
| render(<div foo="bar" data-foo="databar" />, scratch); | ||
@@ -84,8 +83,8 @@ | ||
| it('should apply class/className as String', () => { | ||
| scratch.innerHTML = ''; | ||
| it('should apply class as String', () => { | ||
| render(<div class="foo" />, scratch); | ||
| expect(scratch.childNodes[0]).to.have.property('className', 'foo'); | ||
| }); | ||
| scratch.innerHTML = ''; | ||
| it('should alias className to class', () => { | ||
| render(<div className="bar" />, scratch); | ||
@@ -96,3 +95,2 @@ expect(scratch.childNodes[0]).to.have.property('className', 'bar'); | ||
| it('should apply style as String', () => { | ||
| scratch.innerHTML = ''; | ||
| render(<div style="top:5px; position:relative;" />, scratch); | ||
@@ -105,4 +103,2 @@ expect(scratch.childNodes[0]).to.have.deep.property('style.cssText') | ||
| it('should only register on* functions as handlers', () => { | ||
| scratch.innerHTML = ''; | ||
| let click = () => {}, | ||
@@ -127,4 +123,2 @@ onclick = () => {}, | ||
| it('should serialize style objects', () => { | ||
| scratch.innerHTML = ''; | ||
| render(<div style={{ | ||
@@ -151,4 +145,2 @@ color: 'rgb(255, 255, 255)', | ||
| it('should serialize class/className', () => { | ||
| scratch.innerHTML = ''; | ||
| render(<div class={{ | ||
@@ -173,2 +165,234 @@ no1: false, | ||
| }); | ||
| it('should render components', () => { | ||
| class C1 extends Component { | ||
| render() { | ||
| return <div>C1</div>; | ||
| } | ||
| } | ||
| sinon.spy(C1.prototype, 'render'); | ||
| render(<C1 />, scratch); | ||
| expect(C1.prototype.render) | ||
| .to.have.been.calledOnce | ||
| .and.to.have.been.calledWithMatch({}, {}) | ||
| .and.to.have.returned(sinon.match({ nodeName:'div' })); | ||
| expect(scratch.innerHTML).to.equal('<div>C1</div>'); | ||
| }); | ||
| it('should render components with props', () => { | ||
| const PROPS = { foo:'bar', onBaz:()=>{} }; | ||
| class C2 extends Component { | ||
| render(props) { | ||
| return <div {...props} />; | ||
| } | ||
| } | ||
| sinon.spy(C2.prototype, 'render'); | ||
| render(<C2 {...PROPS} />, scratch); | ||
| expect(C2.prototype.render) | ||
| .to.have.been.calledOnce | ||
| .and.to.have.been.calledWithMatch(PROPS, {}) | ||
| .and.to.have.returned(sinon.match({ | ||
| nodeName: 'div', | ||
| attributes: PROPS | ||
| })); | ||
| expect(scratch.innerHTML).to.equal('<div foo="bar"></div>'); | ||
| }); | ||
| it('should render functional components', () => { | ||
| const PROPS = { foo:'bar', onBaz:()=>{} }; | ||
| const C3 = sinon.spy( props => <div {...props} /> ); | ||
| render(<C3 {...PROPS} />, scratch); | ||
| expect(C3) | ||
| .to.have.been.calledOnce | ||
| .and.to.have.been.calledWithExactly(PROPS) | ||
| .and.to.have.returned(sinon.match({ | ||
| nodeName: 'div', | ||
| attributes: PROPS | ||
| })); | ||
| expect(scratch.innerHTML).to.equal('<div foo="bar"></div>'); | ||
| }); | ||
| it('should render nested functional components', () => { | ||
| const PROPS = { foo:'bar', onBaz:()=>{} }; | ||
| const Outer = sinon.spy( | ||
| props => <Inner {...props} /> | ||
| ); | ||
| const Inner = sinon.spy( | ||
| props => <div {...props}>inner</div> | ||
| ); | ||
| render(<Outer {...PROPS} />, scratch); | ||
| expect(Outer) | ||
| .to.have.been.calledOnce | ||
| .and.to.have.been.calledWithExactly(PROPS) | ||
| .and.to.have.returned(sinon.match({ | ||
| nodeName: Inner, | ||
| attributes: PROPS | ||
| })); | ||
| expect(Inner) | ||
| .to.have.been.calledOnce | ||
| .and.to.have.been.calledWithExactly(PROPS) | ||
| .and.to.have.returned(sinon.match({ | ||
| nodeName: 'div', | ||
| attributes: PROPS, | ||
| children: ['inner'] | ||
| })); | ||
| expect(scratch.innerHTML).to.equal('<div foo="bar">inner</div>'); | ||
| }); | ||
| it('should re-render nested functional components', () => { | ||
| let doRender = null; | ||
| class Outer extends Component { | ||
| componentDidMount() { | ||
| let i = 1; | ||
| doRender = () => this.setState({ i: ++i }); | ||
| } | ||
| componentWillUnmount() {} | ||
| render(props, { i }) { | ||
| return <Inner i={i} {...props} />; | ||
| } | ||
| } | ||
| sinon.spy(Outer.prototype, 'render'); | ||
| sinon.spy(Outer.prototype, 'componentWillUnmount'); | ||
| let j = 0; | ||
| const Inner = sinon.spy( | ||
| props => <div j={ ++j } {...props}>inner</div> | ||
| ); | ||
| render(<Outer foo="bar" />, scratch); | ||
| // update & flush | ||
| doRender(); | ||
| rerender(); | ||
| expect(Outer.prototype.componentWillUnmount) | ||
| .not.to.have.been.called; | ||
| expect(Inner).to.have.been.calledTwice; | ||
| expect(Inner.secondCall) | ||
| .to.have.been.calledWithExactly({ foo:'bar', i:2 }) | ||
| .and.to.have.returned(sinon.match({ | ||
| attributes: { | ||
| j: 2, | ||
| i: 2, | ||
| foo: 'bar' | ||
| } | ||
| })); | ||
| expect(scratch.innerHTML).to.equal('<div j="2" foo="bar" i="2">inner</div>'); | ||
| // update & flush | ||
| doRender(); | ||
| rerender(); | ||
| expect(Inner).to.have.been.calledThrice; | ||
| expect(Inner.thirdCall) | ||
| .to.have.been.calledWithExactly({ foo:'bar', i:3 }) | ||
| .and.to.have.returned(sinon.match({ | ||
| attributes: { | ||
| j: 3, | ||
| i: 3, | ||
| foo: 'bar' | ||
| } | ||
| })); | ||
| expect(scratch.innerHTML).to.equal('<div j="3" foo="bar" i="3">inner</div>'); | ||
| }); | ||
| it('should re-render nested components', () => { | ||
| let doRender = null; | ||
| class Outer extends Component { | ||
| componentDidMount() { | ||
| let i = 1; | ||
| doRender = () => this.setState({ i: ++i }); | ||
| } | ||
| componentWillUnmount() {} | ||
| render(props, { i }) { | ||
| return <Inner i={i} {...props} />; | ||
| } | ||
| } | ||
| sinon.spy(Outer.prototype, 'render'); | ||
| sinon.spy(Outer.prototype, 'componentWillUnmount'); | ||
| let j = 0; | ||
| class Inner extends Component { | ||
| componentDidMount() {} | ||
| componentWillUnmount() {} | ||
| render(props) { | ||
| return <div j={ ++j } {...props}>inner</div>; | ||
| } | ||
| } | ||
| sinon.spy(Inner.prototype, 'constructor'); | ||
| sinon.spy(Inner.prototype, 'render'); | ||
| sinon.spy(Inner.prototype, 'componentDidMount'); | ||
| sinon.spy(Inner.prototype, 'componentWillUnmount'); | ||
| render(<Outer foo="bar" />, scratch); | ||
| console.log('1', scratch.firstElementChild._componentConstructor); | ||
| // update & flush | ||
| doRender(); | ||
| rerender(); | ||
| console.log('2', scratch.firstElementChild && scratch.firstElementChild._component); | ||
| console.log('3', scratch.firstElementChild && scratch.firstElementChild._componentConstructor); | ||
| expect(Outer.prototype.componentWillUnmount).not.to.have.been.called; | ||
| expect(Inner.prototype.constructor).to.have.been.calledOnce; | ||
| expect(Inner.prototype.componentWillUnmount).not.to.have.been.called; | ||
| expect(Inner.prototype.componentDidMount).to.have.been.calledOnce; | ||
| expect(Inner.prototype.render).to.have.been.calledTwice; | ||
| expect(Inner.prototype.render.secondCall) | ||
| .to.have.been.calledWith({ foo:'bar', i:2 }) | ||
| .and.to.have.returned(sinon.match({ | ||
| attributes: { | ||
| j: 2, | ||
| i: 2, | ||
| foo: 'bar' | ||
| } | ||
| })); | ||
| expect(scratch.innerHTML).to.equal('<div j="2" i="2" foo="bar">inner</div>'); | ||
| // update & flush | ||
| doRender(); | ||
| rerender(); | ||
| expect(Inner.prototype.componentWillUnmount).not.to.have.been.called; | ||
| expect(Inner.prototype.componentDidMount).to.have.been.calledOnce; | ||
| expect(Inner.prototype.render).to.have.been.calledThrice; | ||
| expect(Inner.prototype.render.thirdCall) | ||
| .to.have.been.calledWithExactly({ foo:'bar', i:3 }) | ||
| .and.to.have.returned(sinon.match({ | ||
| attributes: { | ||
| j: 3, | ||
| i: 3, | ||
| foo: 'bar' | ||
| } | ||
| })); | ||
| expect(scratch.innerHTML).to.equal('<div j="3" foo="bar" i="3">inner</div>'); | ||
| }); | ||
| }); |
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by6.25%
110346
- Dev dependency count
- decreased by-4%
24
- Lines of code
- increased by20.08%
1142
No dependency changes