diff --git a/demo/lazyBarrier.jsx b/demo/lazyBarrier.jsx
new file mode 100644
index 0000000000..8e2294e389
--- /dev/null
+++ b/demo/lazyBarrier.jsx
@@ -0,0 +1,4 @@
+import { lazy } from 'react';
+
+export const TestComp = lazy(() => import('./testComp'));
+export const TestWrapper = lazy(() => import('./testWrapper'));
diff --git a/demo/testComp.jsx b/demo/testComp.jsx
new file mode 100644
index 0000000000..f7cb52463c
--- /dev/null
+++ b/demo/testComp.jsx
@@ -0,0 +1,5 @@
+const TestComp = () => {
+ return
Bar
;
+};
+
+export default TestComp;
diff --git a/demo/testWrapper.jsx b/demo/testWrapper.jsx
new file mode 100644
index 0000000000..fabda5a143
--- /dev/null
+++ b/demo/testWrapper.jsx
@@ -0,0 +1,7 @@
+import React from 'react';
+
+const TestWrapper = ({ children }) => {
+ return {children}
;
+};
+
+export default TestWrapper;
diff --git a/src/diff/children.js b/src/diff/children.js
index eb86799efc..c692d66e71 100644
--- a/src/diff/children.js
+++ b/src/diff/children.js
@@ -320,16 +320,7 @@ function constructNewChildrenArray(newParentVNode, renderResult, oldChildren) {
skew--;
}
} else if (matchingIndex < skewedIndex) {
- // Our matched DOM-node is further in the negative way in the list of children
- // than where it's at now.
-
- // When the remaining old chiildren is less than the new children
- // plus our skewed index we know we are dealing with a growing list
- if (remainingOldChildren < newChildrenLength + skewedIndex) {
- skew += matchingIndex + skewedIndex;
- } else {
- skew = 0;
- }
+ skew--;
}
// Move this VNode's DOM if the original index (matchingIndex) doesn't
diff --git a/test/browser/render.test.js b/test/browser/render.test.js
index e6caf3adb9..5d7ca22fc8 100644
--- a/test/browser/render.test.js
+++ b/test/browser/render.test.js
@@ -1636,6 +1636,7 @@ describe('render()', () => {
);
const a = ['0', '1', '2', '3', '4', '5', '6'];
const b = ['1', '3', '5', '2', '6', '4', '0'];
+ const c = ['11', '3', '1', '4', '6', '2', '5', '0', '9', '10'];
render(, scratch);
expect(scratch.innerHTML).to.equal(
`${a.map(n => `
${n}
`).join('')}
`
@@ -1646,6 +1647,11 @@ describe('render()', () => {
`${b.map(n => `
${n}
`).join('')}
`
);
+ render(, scratch);
+ expect(scratch.innerHTML).to.equal(
+ `${c.map(n => `
${n}
`).join('')}
`
+ );
+
render(, scratch);
expect(scratch.innerHTML).to.equal(
`${a.map(n => `
${n}
`).join('')}
`