From 444b73f7ecc84af8efe478fe1db06c325fefddb9 Mon Sep 17 00:00:00 2001
From: haiqin <chenhaiqin5@huawei.com>
Date: Tue, 2 Jan 2024 15:02:11 +0800
Subject: [PATCH] fix: update got error in <Suspense /> fallback

---
 .../ComponentTest/SuspenseComponent.test.js   | 48 ++++++++++++-------
 .../src/renderer/render/SuspenseComponent.ts  |  2 +-
 2 files changed, 32 insertions(+), 18 deletions(-)

diff --git a/packages/inula/scripts/__tests__/ComponentTest/SuspenseComponent.test.js b/packages/inula/scripts/__tests__/ComponentTest/SuspenseComponent.test.js
index 6c1469d3..f722a877 100644
--- a/packages/inula/scripts/__tests__/ComponentTest/SuspenseComponent.test.js
+++ b/packages/inula/scripts/__tests__/ComponentTest/SuspenseComponent.test.js
@@ -23,23 +23,6 @@ describe('SuspenseComponent Test', () => {
     return { default: component };
   });
 
-  // var EMPTY_OBJECT = {};
-  // const mockCreateResource = jest.fn((component) => {
-  //   let result = EMPTY_OBJECT;
-  //   return () =>{
-  //     component().then(res => {
-  //       LogUtils.log(res);
-  //       result = res;
-  //     }, reason => {
-  //       LogUtils.log(reason);
-  //     });
-  //     if(result === EMPTY_OBJECT){
-  //       throw component();
-  //     }
-  //     return result;
-  //   };
-  // });
-
   it('挂载lazy组件', async () => {
     // 用同步的代码来实现异步操作
     class LazyComponent extends Inula.Component {
@@ -70,4 +53,35 @@ describe('SuspenseComponent Test', () => {
     expect(LogUtils.getAndClear()).toEqual([5]);
     expect(container.querySelector('p').innerHTML).toBe('5');
   });
+
+  it('suspense fallback can be updated', async () => {
+    // 用同步的代码来实现异步操作
+    class LazyComponent extends Inula.Component {
+      render() {
+        return <Text text={this.props.num} />;
+      }
+    }
+
+    const Lazy = Inula.lazy(() => {
+      // wait for 3s
+      return new Promise(resolve => setTimeout(resolve({ default: LazyComponent }), 3000));
+    });
+
+    let updateFallback;
+    function Fallback() {
+      const [show, setShow] = Inula.useState(true);
+      updateFallback = () => setShow(!show);
+      return <h1>fallback:{show ? 'show' : 'hide'}</h1>;
+    }
+    const container = document.createElement('div');
+    Inula.render(
+      <Inula.Suspense fallback={<Fallback />}>
+        <Lazy num={5} />
+      </Inula.Suspense>,
+      container
+    );
+    expect(container.querySelector('h1').innerHTML).toBe('fallback:show');
+    updateFallback();
+    expect(container.querySelector('h1').innerHTML).toBe('fallback:hide');
+  });
 });
diff --git a/packages/inula/src/renderer/render/SuspenseComponent.ts b/packages/inula/src/renderer/render/SuspenseComponent.ts
index 8bb49a2e..bd99ae56 100644
--- a/packages/inula/src/renderer/render/SuspenseComponent.ts
+++ b/packages/inula/src/renderer/render/SuspenseComponent.ts
@@ -128,7 +128,7 @@ function updateFallback(processing: VNode): Array<VNode> | VNode | null {
 
     if (children !== null) {
       // child不需要更新，跳过child处理fallback
-      return children[1];
+      return children.next;
     } else {
       return null;
     }