dashersw / dashersw/gea

[BUG] Splatted props is not defined / do not work

Open
#93 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
1.2k
Forks
47
PR merge metrics
No merged PRs in 30d

Description

When trying to splat props, it doesn't appear to be available in the output:

```tsx
import { Component } from "@geajs/core";
import type { JSX } from "@geajs/core/jsx-runtime";

export type FooButtonProps = JSX.IntrinsicElements["button"];

export class FooButton extends Component {
template({ children, class: cls, ...props }: FooButtonProps) {
console.log(props);

return (

{children}

);
}
}

// throws
// Uncaught ReferenceError: props is not defined
```

-----

Furthermore, even if we don't `console.log(props)`, the splatted props seem to have no effect:

```tsx
import { Component } from "@geajs/core";
import type { JSX } from "@geajs/core/jsx-runtime";

export type FooButtonProps = JSX.IntrinsicElements["button"];

export class FooButton extends Component {
template({ children, class: cls, ...props }: FooButtonProps) {
return (

{children}

);
}
}

// usage

console.log("clicked!")} /> // nothing happens when clicked
```

Clicking the button has no effect at all. It only works if we manually pass the `onClick` down to ``:

```tsx
import { Component } from "@geajs/core";
import type { JSX } from "@geajs/core/jsx-runtime";

export type FooButtonProps = JSX.IntrinsicElements["button"];

export class FooButton extends Component {
template({ children, class: cls, onClick }: FooButtonProps) {
return (

{children}

);
}
}

// usage

console.log("clicked!")} /> // logs "clicked!" when clicked
```

Contributor guide

No contributing guide indexed for this repository

Research direction

No source files or tests are named in the issue. Reproduce both TSX examples, then trace the compile-time JSX transform and the generated handling of object-spread props and event handlers; done means splatted props are available without a ReferenceError and forwarded handlers respond to clicks.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, typescript
Domain
frontend, tooling
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Active
Clarity
Mostly clear
Newbie friendliness
52/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.