Skip to content

JSX Not validating when index signature is present #10265

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
bezreyhan opened this issue Aug 10, 2016 · 4 comments
Closed

JSX Not validating when index signature is present #10265

bezreyhan opened this issue Aug 10, 2016 · 4 comments
Labels
Bug A bug in TypeScript Domain: JSX/TSX Relates to the JSX parser and emitter Fixed A PR has been merged for this issue

Comments

@bezreyhan
Copy link

TypeScript Version: 2.0

Code

interface IProps {
  primaryText: string,
  [propName: string]: any
}

function VerticalNavMenuItem(props: IProps) {
  return <div>props.primaryText</div>
}

function VerticalNav() {
  return (
    <div>
      <SOME_JSX />
      <VerticalNavMenuItem primaryText={2} />
    </div>
  )
} 

Expected behavior:
In VerticalNav I have the child component: <VerticalNavMenuItem primaryText={2} />
This should throw a type error because primary text must be a string.

However, if I remove [propName: string]: any from IProps then the type error will be thrown.

Actual behavior:
No error is thrown.

@RyanCavanaugh RyanCavanaugh added the Working as Intended The behavior described is the intended behavior; this is not a bug label Aug 10, 2016
@RyanCavanaugh
Copy link
Member

RyanCavanaugh commented Aug 10, 2016

The interpreted intent of the index signature is to allow arbitrary extra properties. Otherwise there would be no way to represent a component that accepted any property names.

@bezreyhan
Copy link
Author

bezreyhan commented Aug 10, 2016

@RyanCavanaugh thanks for the quick response. I guess I'm confused - shouldn't the index signature allow any additional properties with any type, but nevertheless check that the primaryText property has the type string?

Maybe I am misunderstanding the docs but for the following example:

interface SquareConfig {
    color?: string;
    width?: number;
    [propName: string]: any;
}

the docs say that: SquareConfig can have any number of properties, and as long as they aren’t color or width, their types don’t matter.

Doesn't that mean that the types for color and width do matter?

Also, when I tested this in the TS playground using normal functions the primaryText was checked to be a string.

@RyanCavanaugh
Copy link
Member

Sorry, I totally misread your original post. Rereading/investigating

@RyanCavanaugh RyanCavanaugh added Bug A bug in TypeScript Domain: JSX/TSX Relates to the JSX parser and emitter and removed Working as Intended The behavior described is the intended behavior; this is not a bug labels Aug 10, 2016
@RyanCavanaugh RyanCavanaugh added this to the TypeScript 2.0.1 milestone Aug 10, 2016
@RyanCavanaugh
Copy link
Member

RyanCavanaugh commented Aug 10, 2016

Yeah this is very much supposed to be an error. Thanks for following up!

@yuit yuit added the Fixed A PR has been merged for this issue label Aug 16, 2016
@microsoft microsoft locked and limited conversation to collaborators Jun 19, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Bug A bug in TypeScript Domain: JSX/TSX Relates to the JSX parser and emitter Fixed A PR has been merged for this issue
Projects
None yet
Development

No branches or pull requests

3 participants