Missing React/JSX props not working in strict mode

[davidroeca]

First off, thanks for the library! This is a very simple/clean way to test typescript definition files. I've come across a strange bug with React/JSX, and tried my best to replicate the issue. It mostly has to do with testing for missing (but required) react props.

Here's the type definition, for example:

import * as React from 'react'

export interface MyProps {
  prop1: string
  prop2: number
}

export const MyComponent: React.ComponentType<MyProps>

The following tests fail but should work (they produce an error output, but it's different from what I guess tsd expects):

// This one's broken
expectError(<MyComponent prop1="hello" />)

// This one too
expectError(<MyComponent prop2={2} />)

Full reproduction, with tsconfig.json can be found here

Please let me know if I'm missing something/if there's a clear work-around. Thanks!

[davidroeca]

A work-around would be to declare MyComponent as a React.FC<MyProps> and not use tsx. This obviously only works in the case that MyComponent is actually a functional component:

import * as React from 'react'

export interface MyProps {
  prop1: string
  prop2: number
}

export const MyComponent: React.FC<MyProps>

// This one's fine
expectError(MyComponent({ foo: "bar" }))

// This one's also fine
expectError(MyComponent({ prop1: 1, prop2: 2 }))

// This one's also fine
expectError(MyComponent({ prop1: "hey", prop2: 1234, iShouldNotBe: "here" }))

// fixed
expectError(MyComponent({ prop1: "hello" }))

// also fixed
expectError(MyComponent({ prop2: 2}))

[davidroeca]

It seems the errors I care about are explicitly suppressed here:

https://github.com/SamVerschueren/tsd/blob/3bb25ef8942ba661329d0ef878484c911d53a35a/source/lib/compiler.ts#L18-L20

Particularly, line 20

[SamVerschueren]

Sorry for the late reply. I looked into this and it turns out we had a test for this use case

import {Component} from 'react';

interface UnicornProps {
	unicorn: number;
	rainbow: string;
}

export class Unicorn extends Component<UnicornProps> {}

But not when working with ComponentType which produces different errors then when you use extends.

The code block you referenced, namely diagnosticCodesToIgnore is only used in the expectError assertion. It's a list of errors that expectError supports. I added the diagnostic produced with ComponentType to the list and it works as expected now.

Will release in the coming days.

[SamVerschueren]

Released as 0.13.1