Extending nested arrays suddenly stopped working

[RareSecond]

Bug Report

🔎 Search Terms

nested array

🕗 Version & Regression Information

• This changed between versions 4.3.5 and 4.4.2

⏯ Playground Link

Failing playground
Correct playground

💻 Code

interface ChartState {
    labels: string[];
    datasets: [
        {
            label: string;
            backgroundColor: string[] | string;
            hoverBackgroundColor: string[] | string;
            data:  (string|number)[];
        }
    ];
}

type _dataSetType = ChartState['datasets'][0];

type _barChartDataSetType = _dataSetType & {
   barThickness: number;
}

export type BarCharState = ChartState & {
  datasets: Array<_barChartDataSetType>
}

const test: BarCharState = {
   labels: ['foo', 'bar'],
   datasets: [
      {
         label: 'foo',
         backgroundColor: '#fefefe',
         hoverBackgroundColor: '#ffffff',
         data: ['a', 'b'],
         barThickness: 3,
      },
   ]
}

🙁 Actual behavior

It does not correctly merge the two types

🙂 Expected behavior

The resulting type displays incorrect behavior

[geoffreytools]

It could be a bug related to this issue but ChartState/datasets should be defined as an array. This intersection between a tuple and an array does not make much sense and is best avoided.

[RyanCavanaugh]

It really seems like you wrote [T] thinking it meant T[]. This works as expected:

interface ChartState {
    labels: string[];
    datasets: 
        {
            label: string;
            backgroundColor: string[] | string;
            hoverBackgroundColor: string[] | string;
            data:  (string|number)[];
        }[]
    ;
}

[typescript-bot]

This issue has been marked as "Working as Intended" and has seen no recent activity. It has been automatically closed for house-keeping purposes.