michael/astro
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Added undefined check for spread props (#832)

Browse source 
* husky setup added

* pre-commit script updated

* Revert "Feat/pre commit"

* spread issue fixed #522

* testcase added

* spread issue fixed #522

* testcase added
This commit is contained in:
Rahul Sharma 2021-07-27 18:26:46 +05:30 committed by GitHub
parent e89a99f342
commit 80d7415807
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 20 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
examples/framework-react/src/components/Counter.jsx
View file

@ -1,7 +1,7 @@
import React, { useState } from 'react';
export default function Counter({ children }) {
const [count, setCount] = useState(0);
export default function Counter({ children, count: initialCount }) {
const [count, setCount] = useState(initialCount);
const add = () => setCount((i) => i + 1);
const subtract = () => setCount((i) => i - 1);

6
examples/framework-react/src/pages/index.astro
View file

@ -1,7 +1,9 @@
---
// Component Imports
import Counter from '../components/Counter.jsx'
const someProps = {
count: 0,
}
// Full Astro Component Syntax:
// https://docs.astro.build/core-concepts/astro-components/
@ -34,7 +36,7 @@ import Counter from '../components/Counter.jsx'
</head>
<body>
<main>
<Counter client:visible>
<Counter {...someProps} client:visible>
<h1>Hello React!</h1>
</Counter>
</main>

2
packages/astro/src/compiler/transform/head.ts
View file

@ -26,7 +26,7 @@ export default function (opts: TransformOptions): Transformer {
}
// Initialize eoh if there are no elements
eoh.enter(node);
if (node.attributes && node.attributes.some(({ name }: any) => name.startsWith('client:'))) {
if (node.attributes && node.attributes.some(({ name }: any) => name?.startsWith('client:'))) {
hasComponents = true;
return;
}

5
packages/astro/test/fixtures/react-component/src/components/PropsSpread.jsx vendored Normal file
View file

@ -0,0 +1,5 @@
import React from 'react';
export default (props) => {
return <div id="component-spread-props">{props.text}</div>;
}

7
packages/astro/test/fixtures/react-component/src/pages/index.astro vendored
View file

@ -2,7 +2,12 @@
import Hello from '../components/Hello.jsx';
import Later from '../components/Goodbye.vue'; // use different specifier
import ArrowFunction from '../components/ArrowFunction.jsx';
import PropsSpread from '../components/PropsSpread.jsx';
import {Research2} from '../components/Research.jsx';
const someProps = {
text: 'Hello world!',
};
---
<html>
@ -13,7 +18,7 @@ import {Research2} from '../components/Research.jsx';
<Hello name="world" />
<Later name="baby" />
<ArrowFunction />
<PropsSpread {...someProps}/>
<Research2 client:idle />
</body>
</html>

2
packages/astro/test/react-component.test.js
View file

@ -41,6 +41,8 @@ React('Can load React', async () => {
assert.equal($('#react-h2').text(), 'Hello world!');
assert.equal($('#react-h2').attr('data-reactroot'), undefined, 'no reactroot');
assert.equal($('#arrow-fn-component').length, 1, 'Can use function components');
assert.equal($('#component-spread-props').length, 1, 'Can use spread for components');
assert.equal($('#component-spread-props').text(), 'Hello world!');
});
React('Includes reactroot on hydrating components', async () => {