Spread attribute syntax makes compilation and type checking ignore errors and module imports

[phurytw]

TypeScript Version: 2.3.2 (VSCode / Windows)

Code

import * as React from "react";
import { style } from "./classNames";

export class Component extends React.Component<React.HTMLProps<HTMLDivElement>, {}> {
    constructor(props?: React.HTMLProps<HTMLDivElement>) {
        super(props);
    }
    render(): JSX.Element {
        const props: any = this.props;
        return <div
            {...props}
            className={style}
        >
            <p>Content</p>
        </div>;
    }
}

Expected behavior:
Compiled code should have require("./classNames");.
Actual behavior:
require("./classNames"); is not present.

I'm in a weird situation where TypeScript stops caring about whatever that is after a spread attributes syntax.

In the sample code I can't put {...this.props} because I would get this error: 'children' are specified twice. The attribute named 'children' will be overwritten. So I worked around it with the any variable.

But now the crazy thing is that everything after the spread syntax is "ignored" by TypeScript.

The compiler doesn't notify any further syntax errors and doesn't include the imported module that I use after the spread syntax. But it will successfully compile.

This is the compiled file of the above code. I believe I should get a require("./classNames") somewhere which I do get if I don't use the spread syntax.

Other examples

Using an undeclared variable before the spread syntax

VSCode shows the error and I also get the following error when compiling: index.tsx(12,24): error TS2304: Cannot find name 'notDeclared'.

Using an undeclared variable after the spread syntax

VSCode ignores the error and I get no errors when compiling.

[mhegazy]

Duplicate of #15469. should be fixed in typescript@next, and will be part of the upcoming [email protected].

[yuit]

Close for now @lith-light-g let us know if you still run into issue after update to typescript@next