driver-dom - npm Package Compare versions

Comparing version 2.1.3 to 2.2.0

dist/driver-dom.js

@@ -515,2 +515,10 @@ (function () {
     var hydrate = _ref.hydrate;
+
+    // Nested render may reset `isHydrating`, `recolectHydrationChild` will not work correctly after render.
+    if (isHydrating && !hydrate) {
+      {
+        throw new Error('Nested render is not allowed when hydrating. ' + 'If necessary, trigger render in useEffect.');
+      }
+    }
+
     isHydrating = hydrate;
@@ -517,0 +525,0 @@ }

dist/driver-dom.min.js

@@ -1,2 +0,2 @@
-!function(){var h,e=/[-+]?\d*\.?\d+(rpx)/g,t=/opa|ntw|ne[ch]|ex(?:s|g|n|p|$)|^ord|zoo|grid|orp|ows|mnc|^columns$|bs|erim|onit/i,r=/^on[A-Z]/,i="dangerouslySetInnerHTML",u="__html",o="innerHTML",_="className",x="class",y="style",f="textContent",b="createElement",c="createComment",l="createTextNode",a="setAttribute",g="removeAttribute",w="http://www.w3.org/2000/svg",d=8,s="|",T="",v="__i",A="__a",m="__h",C=T,E=!1,p=750,M=4;function L(n){return function(n,e){e=Math.pow(10,e+1);return 10*Math.round(Math.floor(n*e)/10)/e}(parseFloat(n)/(p/100),M)+"vw"}function n(e){var t=Object.create(null);return function(n){return t[n]||(t[n]=e(n))}}var N=n(function(n){return e.test(n)?n.replace(e,L):n}),P=n(function(n){return n.replace(/-([a-z])/gi,function(n,e){return e.toUpperCase()})}),j=n(function(n){return!t.test(n)}),z=n(function(n){return r.test(n)});function B(n){var e=n.childNodes;null==n[v]&&(n[v]=0);var t=e[n[v]++];return t&&t.nodeType===d&&t.data===s?e[n[v]++]:t}function H(n,e){if(!E||n[A])return e.appendChild(n)}function O(n,e,t){(t=t||e.parentNode).replaceChild(n,e)}function R(n,e,t){(t=t||e.parentNode).insertBefore(n,e)}function S(n,e,t){return n.addEventListener(e,t)}function $(e,t,r,n){if(t===i)return e[o]!==r[u]&&(e[o]=r[u]),void(e[m]=!0);if(t===_&&(t=x),!n&&t in e)try{e[t]=r}catch(n){e[a](t,r)}else e[a](t,r)}function D(n,e,t,r){for(var i in void 0===r&&(r=!0),e){var u=e[i],o=void 0;"number"==typeof u&&j(i)?t?(o=u+"rpx",r&&(o=N(o))):o=u+"px":o=r?N(u):u,"-"===i[0]&&"-"===i[1]?n.style.setProperty(i,o):n.style[i]=o}}var F={__proto__:null,setViewportWidth:function(n){p=n},setUnitPrecision:function(n){M=n},setDecimalPixelTransformer:function(){},setTagNamePrefix:function(n){C=n},createBody:function(){return document.body},createEmpty:function(n){var e,t=n._parent;if(E){n=B(t);if(n){if(n.nodeType===d)return n;O(e=document[c](T),n,t)}else(e=document[c](T))[A]=!0}else e=document[c](T);return e},createText:function(n,e){var t,r=e._parent;if(E){e=B(r);if(e){if(3===e.nodeType)return n!==e[f]&&(e[f]=n),e;O(t=document[l](n),e,r)}else(t=document[l](n))[A]=!0}else t=document[l](n);return t},updateText:function(n,e){n[f]=e},createElement:function(e,n,t,r,i){void 0===i&&(i=!0);var u,t=t._parent;h="svg"===e||t&&t.namespaceURI===w;var o,f=null;function c(){var n;u=h?document.createElementNS(w,e):C?(n="function"==typeof n?n(e):n,document[b](n+e)):document[b](e)}if(E)if(f=B(t))if(e===f.nodeName.toLowerCase()){for(var l=f.attributes,a=l.length;a--;){var d=l[a].name,s=n[d];if(d===x&&null==n[_]&&null==s||d===y&&(null==s||0===Object.keys(s).length)||d!==x&&d!==y&&null==s)f[g](d);else if(d===y)for(var v=f.style.length;0<v;v--){var m=P(f.style[v-1]);null==s[m]&&(f.style[m]=T)}}u=f}else c(),O(u,f,t);else c(),u[A]=!0;else c();for(o in n){var p=n[o];"children"!==o&&null!=p&&(o===y?D(u,p,r,i):z(o)?S(u,o.slice(2).toLowerCase(),p):$(u,o,p,h))}return u},appendChild:H,removeChild:function(n,e){(e=e||n.parentNode)&&e.removeChild(n)},replaceChild:O,insertAfter:function(n,e,t){t=t||e.parentNode,(e=e.nextSibling)?e!==n&&R(n,e,t):H(n,t)},insertBefore:R,addEventListener:S,removeEventListener:function(n,e,t){return n.removeEventListener(e,t)},removeAttribute:function(n,e){if(e===i)return n[o]=null;if(e===_&&(e=x),e in n)try{n[e]=null}catch(n){}n[g](e)},setAttribute:$,setStyle:D,beforeRender:function(n){E=n.hydrate},afterRender:function(n){E&&(!function n(e){if(!e[m]){var t=e.childNodes.length,r=e[v]||0;if(0<t-r)for(var i=t-1;r<=i;i--)e.removeChild(e.childNodes[i]);for(var u=e.childNodes.length-1;0<=u;u--)n(e.childNodes[u])}}(n.container),E=!1)},removeChildren:function(n){n.textContent=T}};"undefined"!=typeof module?module.exports=F:self.DriverDOM=F}();
+!function(){var h,e=/[-+]?\d*\.?\d+(rpx)/g,t=/opa|ntw|ne[ch]|ex(?:s|g|n|p|$)|^ord|zoo|grid|orp|ows|mnc|^columns$|bs|erim|onit/i,r=/^on[A-Z]/,i="dangerouslySetInnerHTML",o="__html",u="innerHTML",_="className",x="class",y="style",f="textContent",b="createElement",c="createComment",l="createTextNode",a="setAttribute",g="removeAttribute",w="http://www.w3.org/2000/svg",d=8,s="|",T="",v="__i",A="__a",m="__h",C=T,E=!1,p=750,M=4;function L(n){return function(n,e){e=Math.pow(10,e+1);return 10*Math.round(Math.floor(n*e)/10)/e}(parseFloat(n)/(p/100),M)+"vw"}function n(e){var t=Object.create(null);return function(n){return t[n]||(t[n]=e(n))}}var N=n(function(n){return e.test(n)?n.replace(e,L):n}),P=n(function(n){return n.replace(/-([a-z])/gi,function(n,e){return e.toUpperCase()})}),j=n(function(n){return!t.test(n)}),z=n(function(n){return r.test(n)});function B(n){var e=n.childNodes;null==n[v]&&(n[v]=0);var t=e[n[v]++];return t&&t.nodeType===d&&t.data===s?e[n[v]++]:t}function H(n,e){if(!E||n[A])return e.appendChild(n)}function O(n,e,t){(t=t||e.parentNode).replaceChild(n,e)}function R(n,e,t){(t=t||e.parentNode).insertBefore(n,e)}function S(n,e,t){return n.addEventListener(e,t)}function $(e,t,r,n){if(t===i)return e[u]!==r[o]&&(e[u]=r[o]),void(e[m]=!0);if(t===_&&(t=x),!n&&t in e)try{e[t]=r}catch(n){e[a](t,r)}else e[a](t,r)}function D(n,e,t,r){for(var i in void 0===r&&(r=!0),e){var o=e[i],u=void 0;"number"==typeof o&&j(i)?t?(u=o+"rpx",r&&(u=N(u))):u=o+"px":u=r?N(o):o,"-"===i[0]&&"-"===i[1]?n.style.setProperty(i,u):n.style[i]=u}}var F={__proto__:null,setViewportWidth:function(n){p=n},setUnitPrecision:function(n){M=n},setDecimalPixelTransformer:function(){},setTagNamePrefix:function(n){C=n},createBody:function(){return document.body},createEmpty:function(n){var e,t=n._parent;if(E){n=B(t);if(n){if(n.nodeType===d)return n;O(e=document[c](T),n,t)}else(e=document[c](T))[A]=!0}else e=document[c](T);return e},createText:function(n,e){var t,r=e._parent;if(E){e=B(r);if(e){if(3===e.nodeType)return n!==e[f]&&(e[f]=n),e;O(t=document[l](n),e,r)}else(t=document[l](n))[A]=!0}else t=document[l](n);return t},updateText:function(n,e){n[f]=e},createElement:function(e,n,t,r,i){void 0===i&&(i=!0);var o,t=t._parent;h="svg"===e||t&&t.namespaceURI===w;var u,f=null;function c(){var n;o=h?document.createElementNS(w,e):C?(n="function"==typeof n?n(e):n,document[b](n+e)):document[b](e)}if(E)if(f=B(t))if(e===f.nodeName.toLowerCase()){for(var l=f.attributes,a=l.length;a--;){var d=l[a].name,s=n[d];if(d===x&&null==n[_]&&null==s||d===y&&(null==s||0===Object.keys(s).length)||d!==x&&d!==y&&null==s)f[g](d);else if(d===y)for(var v=f.style.length;0<v;v--){var m=P(f.style[v-1]);null==s[m]&&(f.style[m]=T)}}o=f}else c(),O(o,f,t);else c(),o[A]=!0;else c();for(u in n){var p=n[u];"children"!==u&&null!=p&&(u===y?D(o,p,r,i):z(u)?S(o,u.slice(2).toLowerCase(),p):$(o,u,p,h))}return o},appendChild:H,removeChild:function(n,e){(e=e||n.parentNode)&&e.removeChild(n)},replaceChild:O,insertAfter:function(n,e,t){t=t||e.parentNode,(e=e.nextSibling)?e!==n&&R(n,e,t):H(n,t)},insertBefore:R,addEventListener:S,removeEventListener:function(n,e,t){return n.removeEventListener(e,t)},removeAttribute:function(n,e){if(e===i)return n[u]=null;if(e===_&&(e=x),e in n)try{n[e]=null}catch(n){}n[g](e)},setAttribute:$,setStyle:D,beforeRender:function(n){if(n=n.hydrate,E&&!n)throw Error("Nested render found.");E=n},afterRender:function(n){E&&(!function n(e){if(!e[m]){var t=e.childNodes.length,r=e[v]||0;if(0<t-r)for(var i=t-1;r<=i;i--)e.removeChild(e.childNodes[i]);for(var o=e.childNodes.length-1;0<=o;o--)n(e.childNodes[o])}}(n.container),E=!1)},removeChildren:function(n){n.textContent=T}};"undefined"!=typeof module?module.exports=F:self.DriverDOM=F}();
 //# sourceMappingURL=driver-dom.min.js.map

dist/driver-dom.umd.js

@@ -519,2 +519,10 @@ (function (global, factory) {
     var hydrate = _ref.hydrate;
+
+    // Nested render may reset `isHydrating`, `recolectHydrationChild` will not work correctly after render.
+    if (isHydrating && !hydrate) {
+      {
+        throw new Error('Nested render is not allowed when hydrating. ' + 'If necessary, trigger render in useEffect.');
+      }
+    }
+
     isHydrating = hydrate;
@@ -521,0 +529,0 @@ }

es/index.js

@@ -435,2 +435,12 @@ /**
   var hydrate = _ref.hydrate;
+
+  // Nested render may reset `isHydrating`, `recolectHydrationChild` will not work correctly after render.
+  if (isHydrating && !hydrate) {
+    if (__DEV__) {
+      throw new Error('Nested render is not allowed when hydrating. ' + 'If necessary, trigger render in useEffect.');
+    } else {
+      throw new Error('Nested render found.');
+    }
+  }
+
   isHydrating = hydrate;
@@ -437,0 +447,0 @@ }

lib/index.js

@@ -480,2 +480,12 @@ "use strict";
   var hydrate = _ref.hydrate;
+
+  // Nested render may reset `isHydrating`, `recolectHydrationChild` will not work correctly after render.
+  if (isHydrating && !hydrate) {
+    if (__DEV__) {
+      throw new Error('Nested render is not allowed when hydrating. ' + 'If necessary, trigger render in useEffect.');
+    } else {
+      throw new Error('Nested render found.');
+    }
+  }
+
   isHydrating = hydrate;
@@ -482,0 +492,0 @@ }

package.json

 {
   "name": "driver-dom",
-  "version": "2.1.3",
+  "version": "2.2.0",
   "description": "DOM driver for Rax",
@@ -5,0 +5,0 @@ "license": "BSD-3-Clause",

src/__tests__/hydrate.js

@@ -1,2 +0,2 @@
-import { createElement, render } from 'rax';
+import { createElement, render, useEffect } from 'rax';
 
@@ -36,2 +36,61 @@ describe('Hydrate', () => {
 
+  it('should not be affected by render in useEffect', () => {
+    const childContainer = document.createElement('div');
+    (document.body || document.documentElement).appendChild(childContainer);
+
+    const Child = () => {
+      useEffect(() => {
+        render(<span>child content</span>, childContainer);
+      });
+
+      return null;
+    };
+
+    const Component = () => {
+      return (
+        <div class="container">
+          <div>About Rax</div>
+          <Child />
+        </div>
+      );
+    };
+
+    jest.useFakeTimers();
+
+    render(<Component />, container, { driver: DriverDOM, hydrate: true });
+
+    jest.runAllTimers();
+
+    expect(container.childNodes[0].childNodes[1].nodeType).toBe(8); // comment;
+  });
+
+  it('should throw error for nested render when hydrating', () => {
+    const childContainer = document.createElement('div');
+    (document.body || document.documentElement).appendChild(childContainer);
+
+    const Child = () => {
+      render(<span>child content</span>, childContainer);
+      return null;
+    };
+
+    const Component = () => {
+      return (
+        <div class="container">
+          <div>About Rax</div>
+          <Child />
+        </div>
+      );
+    };
+
+    expect(() => {
+      jest.useFakeTimers();
+
+      render(<Component />, container, { driver: DriverDOM, hydrate: true });
+
+      jest.runAllTimers();
+    }).toThrowError('Nested render is not allowed when hydrating. If necessary, trigger render in useEffect.', {
+      withoutStack: true,
+    });
+  });
+
   it('should warn for replaced hydratable element', () => {
@@ -38,0 +97,0 @@ const Component = () => {

src/index.js

@@ -434,2 +434,14 @@ /**
 export function beforeRender({ hydrate }) {
+  // Nested render may reset `isHydrating`, `recolectHydrationChild` will not work correctly after render.
+  if (isHydrating && !hydrate) {
+    if (__DEV__) {
+      throw new Error(
+        'Nested render is not allowed when hydrating. ' +
+        'If necessary, trigger render in useEffect.'
+      );
+    } else {
+      throw new Error('Nested render found.');
+    }
+  }
+
   isHydrating = hydrate;
@@ -436,0 +448,0 @@ }

New alerts

License Policy Violation

License

This 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

License

This 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

250335

increased by2.41%

Lines of code

3546

increased by2.6%

No dependency changes