Repository: facebook/react
File: packages/react-devtools-shared/src/__tests__/store-test.js (JavaScript)

Code before:

    expect(store).toMatchInlineSnapshot(`
      [root]
        ▾ <Suspense>
            <Component key="not-A">
      [suspense-root]  rects={[{x:1,y:2,width:5,height:1}]}
        <Suspense name="Unknown" rects={[{x:1,y:2,width:5,height:1}]}>
    `);

    await actAsync(() => render(null));
    expect(store).toMatchInlineSnapshot(``);
  });

  // @reactVersion >= 19
  it('should keep suspended boundaries in the Suspense tree but not hidden Activity', async () => {
    const Activity = React.Activity || React.unstable_Activity;

    const never = new Promise(() => {});
    function Component({children}) {
      return <div>{children}</div>;
    }

    function App({hidden}) {
      return (
        <>
          <Activity mode={hidden ? 'hidden' : 'visiible'}>
            <React.Suspense name="inside-activity">
              <Component key="inside-activity">inside Activity</Component>
            </React.Suspense>
          </Activity>
          <React.Suspense name="outer-suspense">
            {hidden ? never : null}
            <React.Suspense name="inner-suspense">
              <Component key="inside-suspense">inside Suspense</Component>
            </React.Suspense>
          </React.Suspense>
        </>
      );
    }

    await actAsync(() => {
      render(<App hidden={false} />);
    });

    expect(store).toMatchInlineSnapshot(`
      [root]
        ▾ <App>
          ▾ <Activity>
            ▾ <Suspense name="inside-activity">
                <Component key="inside-activity">
          ▾ <Suspense name="outer-suspense">

Review comment (suggestion):
```suggestion
          <Activity mode={hidden ? 'hidden' : 'visible'}>
```

Code after:

    expect(store).toMatchInlineSnapshot(`
      [root]
        ▾ <Suspense>
            <Component key="not-A">
      [suspense-root]  rects={[{x:1,y:2,width:5,height:1}]}
        <Suspense name="Unknown" rects={[{x:1,y:2,width:5,height:1}]}>
    `);

    await actAsync(() => render(null));
    expect(store).toMatchInlineSnapshot(``);
  });

  // @reactVersion >= 19
  it('should keep suspended boundaries in the Suspense tree but not hidden Activity', async () => {
    const Activity = React.Activity || React.unstable_Activity;

    const never = new Promise(() => {});
    function Never() {
      readValue(never);
      return null;
    }
    function Component({children}) {
      return <div>{children}</div>;
    }

    function App({hidden}) {
      return (
        <>
          <Activity mode={hidden ? 'hidden' : 'visible'}>
            <React.Suspense name="inside-activity">
              <Component key="inside-activity">inside Activity</Component>
            </React.Suspense>
          </Activity>
          <React.Suspense name="outer-suspense">
            <React.Suspense name="inner-suspense">
              <Component key="inside-suspense">inside Suspense</Component>
            </React.Suspense>
            {hidden ? <Never /> : null}
          </React.Suspense>
        </>
      );
    }

    await actAsync(() => {
      render(<App hidden={true} />);
    });

    expect(store).toMatchInlineSnapshot(`
      [root]
        ▾ <App>