I have a line chart that was working fine, but after upgrading chartjs from 3.6.0 to 3.7.1 and react-chartjs-2 from 3.3.0 to 4.0.1, the fill color under each line disappeared and even after going through all the breaking changes and fixing everything else, I couldn't find anything about the fill problem.

This is how each of my datasets element look like:

datasets.push({
    label: intl.formatMessage({
        id: scores[scoreIndex].name,
        defaultMessage: scores[scoreIndex].name,
    }),
    data: values,
    fill: true,
    backgroundColor: gradient,
    borderColor: colors[currentColorIndex],
    pointRadius,
    pointBackgroundColor: colors[currentColorIndex],
});

As you can see, I am settings the fill property to true and supplying a gradient backgroundColor. This worked perfectly fine before the upgrade, but now that fill is missing, even though it is set to true. I went through the documentation again and it seems like that is still how you do the fill, so I can't wrap my head around why is this not working.