diff options
| author |  Matthew Phillips <matthew@skypack.dev>
| 2023-10-24 08:05:19 -0400 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2023-10-24 08:05:19 -0400 |
| commit | 4dee38711cbf83efb5e12fbfa8e69e2495c49acf (patch) | |
| tree | 05de3ac83e729935ab72cd2ada07e03ddcb0c3d8 /packages/integrations/react/test | |
| parent | 5dd1ed50b2f9428946b0b273e0ce8f13c19aa3b5 (diff) | |
| download | astro-4dee38711cbf83efb5e12fbfa8e69e2495c49acf.tar.gz astro-4dee38711cbf83efb5e12fbfa8e69e2495c49acf.tar.zst astro-4dee38711cbf83efb5e12fbfa8e69e2495c49acf.zip | |
Fix client hydration in experimentalReactChildren (#8898)
* Fix client hydration in experimentalReactChildren
* Add tests
* Add a changeset
* Use recursion instead of walking
* getChildren -> swap order
---------
Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
Diffstat (limited to 'packages/integrations/react/test')
3 files changed, 14 insertions, 4 deletions
diff --git a/packages/integrations/react/test/fixtures/react-component/src/components/WithChildren.jsx b/packages/integrations/react/test/fixtures/react-component/src/components/WithChildren.jsx index 500c0c694..a522bf95e 100644 --- a/packages/integrations/react/test/fixtures/react-component/src/components/WithChildren.jsx +++ b/packages/integrations/react/test/fixtures/react-component/src/components/WithChildren.jsx @@ -1,8 +1,8 @@ import React from 'react'; -export default function ({ children }) { +export default function ({ id, children }) { return ( - <div> + <div id={id}> <div className="with-children">{children}</div> <div className="with-children-count">{children.length}</div> </div> diff --git a/packages/integrations/react/test/fixtures/react-component/src/pages/children.astro b/packages/integrations/react/test/fixtures/react-component/src/pages/children.astro index 59595c266..3f83eafcb 100644 --- a/packages/integrations/react/test/fixtures/react-component/src/pages/children.astro +++ b/packages/integrations/react/test/fixtures/react-component/src/pages/children.astro @@ -7,7 +7,11 @@ import WithChildren from '../components/WithChildren'; <!-- Head Stuff --> </head> <body> - <WithChildren> + <WithChildren id="one"> + <div>child 1</div><div>child 2</div> + </WithChildren> + + <WithChildren id="two" client:load> <div>child 1</div><div>child 2</div> </WithChildren> </body> diff --git a/packages/integrations/react/test/react-component.test.js b/packages/integrations/react/test/react-component.test.js index 43df1d9e4..96d60fd54 100644 --- a/packages/integrations/react/test/react-component.test.js +++ b/packages/integrations/react/test/react-component.test.js @@ -105,7 +105,13 @@ describe('React Components', () => { it('Children are parsed as React components, can be manipulated', async () => { const html = await fixture.readFile('/children/index.html'); const $ = cheerioLoad(html); - expect($('.with-children-count').text()).to.equal('2'); + expect($('#one .with-children-count').text()).to.equal('2'); + }); + + it('Client children passes option to the client', async () => { + const html = await fixture.readFile('/children/index.html'); + const $ = cheerioLoad(html); + expect($('[data-react-children]')).to.have.lengthOf(1); }); }); |