Fluentui: (TSC 3.5.1) TS2590: Expression produces a union type that is too complex to represent.

Created on 30 May 2019 · 6Comments · Source: microsoft/fluentui

Environment Information

__Package version(s)__: 6.182.1
__Browser and OS versions__: Edge Dev 76.0.167.1

Please provide a reproduction of the bug in a codepen:

Test Repo: https://github.com/chenxinyanc/fabric-test

In the root folder, run

npm install
npm run build

Actual behavior:

When building with typescript 3.5.1, I see the following error

ERROR in [at-loader] ./node_modules/@uifabric/merge-styles/lib/IStyleSet.d.ts:49:75 
    TS2590: Expression produces a union type that is too complex to represent.

ERROR in [at-loader] ./node_modules/office-ui-fabric-react/lib/components/DetailsList/ShimmeredDetailsList.types.d.ts:10:18 
    TS2430: Interface 'IShimmeredDetailsListProps' incorrectly extends interface 'IDetailsListProps'.
  Types of property 'styles' are incompatible.
    Type 'IStyleFunctionOrObject<IShimmeredDetailsListStyleProps, IShimmeredDetailsListStyles>' is not assignable to type 'IStyleFunctionOrObject<IDetailsListStyleProps, IDetailsListStyles>'.    
      Type 'IStyleFunction<IShimmeredDetailsListStyleProps, IShimmeredDetailsListStyles>' is not assignable to type 'IStyleFunctionOrObject<IDetailsListStyleProps, IDetailsListStyles>'.
        Type 'IStyleFunction<IShimmeredDetailsListStyleProps, IShimmeredDetailsListStyles>' is not assignable to type 'IStyleFunction<IDetailsListStyleProps, IDetailsListStyles>'.
          Type 'IShimmeredDetailsListStyles' is missing the following properties from type 'IDetailsListStyles': focusZone, headerWrapper, contentWrapper

The file context with error is TStyleSet['subComponentStyles'][P] as in:
https://github.com/OfficeDev/office-ui-fabric-react/blob/ad9193054e3542ca04f265821fca34c51e68b9ff/packages/merge-styles/src/IStyleSet.ts#L35-L41
And the suffx [P] is the direct (but not root) cause of TS2590 error.

Expected behavior:

There shouldn't be any error, just like it when I'm building with typescript 3.4.5.

Priorities and help requested:

Are you willing to submit a PR to fix? Yes, but I'm currently not sure how to refactor IStyleSet safely.

Requested priority: Normal

Products/sites affected: N/A

Typescript Type

Source

chenxinyanc

Most helpful comment

I already have a fix for this for our fabric-7 branch. I'll port to master.

JasonGore on 30 May 2019

❤2

All 6 comments

I already have a fix for this for our fabric-7 branch. I'll port to master.

JasonGore on 30 May 2019

❤2

I was seeing the same issue with TSC v3.3.3333, FYI, but the issue is new.

ezrasavard on 4 Jun 2019

Here is the exact error I'm seeing, but I'm suspicious that it is coming from including a different dependency, since this isn't the first flaky "styles" related issue I've seen show up today.

../../node_modules/office-ui-fabric-react/lib/components/DetailsList/ShimmeredDetailsList.types.d.ts(10,18): error TS2430: Interface 'IShimmeredDetailsListProps' incorrectly extends interface 'IDetailsListProps'.
  Types of property 'styles' are incompatible.
    Type 'IStyleFunction<IShimmeredDetailsListStyleProps, IShimmeredDetailsListStyles> | Partial<IShimmeredDetailsListStyles> | undefined' is not assignable to type 'IStyleFunction<IDetailsListStyleProps, IDetailsListStyles> | Partial<IDetailsListStyles> | undefined'.
      Type 'IStyleFunction<IShimmeredDetailsListStyleProps, IShimmeredDetailsListStyles>' is not assignable to type 'IStyleFunction<IDetailsListStyleProps, IDetailsListStyles> | Partial<IDetailsListStyles> | undefined'.
        Type 'IStyleFunction<IShimmeredDetailsListStyleProps, IShimmeredDetailsListStyles>' is not assignable to type 'IStyleFunction<IDetailsListStyleProps, IDetailsListStyles>'.
          Type 'IShimmeredDetailsListStyles' is missing the following properties from type 'IDetailsListStyles': focusZone, headerWrapper, contentWrapper
npm ERR! code ELIFECYCLE
npm ERR! errno 2

ezrasavard on 4 Jun 2019

I fixed that error too. I'll have a PR up here shortly. Thanks for the reference project @chenxinyanc !

JasonGore on 4 Jun 2019

:tada:This issue was addressed in #9336, which has now been successfully released as @uifabric/[email protected].:tada:

Handy links: