Fix (core): makeTheme should perform deep merges of objects

[jeffwcx]

When setting the icon for a checkbox:

const { answer, events, getScreen } = await render(checkbox, {
  message: 'Select a number',
  choices: numberedChoices,
  theme: {
    icon: {
      checked: '√',
      unchecked: 'x',
    },
  },
});

If only partial values are passed in, it will result in the cursor becoming undefined.

? Select a number
undefined√ 1
 x 2
 x 3
 x 4
 x 5
 x 6
 x 7

This is primarily because makeTheme only performs a deep merge on the style.

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

❗ No coverage uploaded for pull request base (main@f20020b). Click here to learn what that means.

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #1403   +/-   ##
=======================================
  Coverage        ?   96.89%           
=======================================
  Files           ?       54           
  Lines           ?     4990           
  Branches        ?      825           
=======================================
  Hits            ?     4835           
  Misses          ?      147           
  Partials        ?        8           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[SBoudrias]

Hey 👋🏻 Thanks for sending this in!

I went with a deeper fix to perform deep merges on the theme objects instead. I think that'll prevent more potential issues like this to occur in the future or in community prompts.

I reverted the changes to the checkbox file, but the tests you sent are very useful to make sure we won't introduce future regression.

Feel free to review the code (I believe the types in particular could be improved, right now I'm kinda forcing it), I'll merge later! Cheers

[jeffwcx]

Hey 👋🏻 Thanks for sending this in!

I went with a deeper fix to perform deep merges on the theme objects instead. I think that'll prevent more potential issues like this to occur in the future or in community prompts.

I reverted the changes to the checkbox file, but the tests you sent are very useful to make sure we won't introduce future regression.

Feel free to review the code (I believe the types in particular could be improved, right now I'm kinda forcing it), I'll merge later! Cheers

Are you referring to the type issue with @inquirer/testing?

If you're not working on improving this, I can submit a PR.

[SBoudrias]

Ah no, I personally don't get this type error. Could you paste the error message?

(I'll point out the area in the code)

[SBoudrias]

Those as uses aren't safe since they force a type. Ideally we could have TS type check without forcing the types.

[jeffwcx]

ok

[jeffwcx]

Ah no, I personally don't get this type error. Could you paste the error message?

(I'll point out the area in the code)

That’s weird, on my computer (macOS), @inquirer/testing render seems to have this issue whether it’s used in the inquirer.js project or in my own custom prompts.

[SBoudrias]

I wonder if either:

1. TS version related? (inquirer is currently using latest)
2. Mismatch version between @inquirer/testing and @inquirer/core (I assumed this wouldn't be a problem, but never tested it.)

[jeffwcx]

I wonder if either:

1. TS version related? (inquirer is currently using latest)

2. Mismatch version between @inquirer/testing and @inquirer/core (I assumed this wouldn't be a problem, but never tested it.)

Personally, I'm inclined towards option 2. I will try to figure it out and then report back to you, please hold on.