CODEWITHSUNDEEP
reactjstypescriptmaterial-uijestjs
austinrulezd00d
austinrulezd00d

Reputation: 215

TypeScript material-ui allow props not defined in @types

I had a setup using React, material-ui, Flow, Jest doing snapshots in my tests.

In order to create consistent snapshots, i needed to define the ids in my material-ui components, otherwise they were autogenerated and different each time.

so i did this: <Card style = { style } id = { id ?${ id }-card: null }>

this worked fine. now i am switching to TypeScript, and have @types/material-ui. Typescript is complaining about the id prop:

[ts] Property 'id' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Card> ...

Am i doing something wrong? Is there a way to suppress this? I know the component supports passing an id.

Upvotes: 1

Views: 586

Answers (2)

austinrulezd00d
austinrulezd00d

Reputation: 215

I ended up creating typings/material-ui/index.d.ts:

declare namespace __MaterialUI
{
   interface SelectFieldProps
   {
      multiple?: boolean;
      selectionRenderer?: (values: any[]) => string;
   }

   namespace Card
   {
      interface CardProps
      {
         id?: string;
      }

      interface CardHeaderProps
      {
         id?: string;
      }

      interface CardTitleProps
      {
         id?: string;
      }

      interface CardActionsProps
      {
         id?: string;
      }

      interface CardTextProps
      {
         id?: string;
      }
   } 
}

and tsconfig:

"include": [ "./components/**/*", "./typings/**/*" ],

this fixed my problems

Upvotes: 0

bcherny
bcherny

Reputation: 3172

Looking at the source code for that definition, it indeed does not support an id attribute.

If you believe this is an error, I would submit a pull request to DefinitelyTyped!

Upvotes: 1

Related Questions