TypeScript Version: 2.3.2 (also repros in 2.3.1, but not 2.2.1)

Code

We're seeing problems with spreading objects that aren't typed correctly.

This works, notice that styles has a type of empty object:

import * as React from 'react';
import { animationClassNames } from '@uifabric/styling';

let styles: {} = {};

export function testMe() {
  return <div { ...styles }>{ animationClassNames } />;
}

The output generated successfully requires the styling package stored in the styling_1 variable:

var React = require("react");
var styling_1 = require("@uifabric/styling");
var styles = {};
function testMe() {
    return React.createElement("div", tslib_1.__assign({}, styles),
        styling_1.animationClassNames,
        " />; }");
}

However, if the styles object is of type any, the styling_1 variable disappears, and causes nastiness downstream.

Typescript:

import * as React from 'react';
import { animationClassNames } from '@uifabric/styling';

let styles: any = {};

export function testMe() {
  return <div { ...styles }>{ animationClassNames } />;
}

Generated JavaScript, where did styling_1 go?

var tslib_1 = require("tslib");
var React = require("react");
var styles = {};
function testMe() {
    return React.createElement("div", tslib_1.__assign({}, styles),
        styling_1.animationClassNames,
        " />; }");
}
exports.testMe = testMe;

Expected behavior:

Spreading objects without typings doesn't break things.

Actual behavior:

Unexpected breakage.

Note that I'm using any here as an example; we've seen this happening in places where the object is of type React.HTMLProps<HTMLDivElement> and we don't understand. We've seen a number of errors from 2.3.2 where the compiler is complaining about spreading objects in JSX that are definitely objects of some interface shape but TypeScript isn't recognizing them.