[EuiTreeView] [EuiTreeViewNode] changed label PropType in tree_view to ReactNode

[Dishebh]

Summary

Fixes #4323
Changed label PropType in tree_view to ReactNode

Checklist

• Check against all themes for compatibility in both light and dark modes
• Checked in mobile
• Checked in Chrome, Safari, Edge, and Firefox
• Props have proper autodocs
• Added documentation
• Checked Code Sandbox works for the any docs examples
• Added or updated jest tests
• Checked for breaking changes and labeled appropriately
• Checked for accessibility including keyboard-only and screenreader modes
• A changelog entry exists and is marked appropriately

[kibanamachine]

Since this is a community submitted pull request, a Jenkins build has not been kicked off automatically. Can an Elastic organization member please verify the contents of this patch and then kick off a build manually?

[cla-checker-service]

💚 CLA has been signed

[snide]

Thanks @Dishebh. Outside of signing the contributor agreement, you'll need to add a changelog to this fix. Here's a suggested one. Will merge on changes.

- Changed `label` type from `string` to `ReactNode` in `EuiTreeViewNode` ([#4352](https://github.com/elastic/eui/pull/4352))

[snide]

jenkins test this

[kibanamachine]

Preview documentation changes for this PR: https://eui.elastic.co/pr_4352/

[chandlerprall]

@myasonik I believe the title here is not needed, as it is the snapshot of the text content in this element anyway?

[myasonik]

We don't need it for any a11y reasons

[myasonik]

jenkins test this

[Dishebh]

jenkins test this

[cchaos]

Sorry, only team members can kick off a jenkins build. I'll get one started for you.

Jenkins, test this

[chandlerprall]

The yarn.lock changes look like they are tripping up Typescript (it appears multiple @types/react are present). Reverting those changes so it matches the version on master should resolve.

[Dishebh]

The EuiTreeView component's first unit test EuiTreeView › is rendered somehow fails, stating -

Warning: Failed prop type: Invalid prop `aria-label` of type `object` supplied to `EuiTreeView`, expected `string`.
        in EuiTreeView
        in Context.Consumer
        in EuiI18n
        in EuiInnerText
        in ul
        in div
        in EuiText
        in Context.Provider
        in EuiTreeView

[chandlerprall]

@Dishebh I've pushed some changes directly to your branch to resolve that test.

nodeLabel: innerText, was undefined during the first render, which caused the resulting ariaLabel value to be an array of strings instead of a single string. This caused the value to be an object instead of string, triggering the proptype warning.

I added a fallback value fallback={typeof node.label === 'string' ? node.label : ''} so:

1. the test, which uses a string, would not need any snapshot changes
2. ensure innerText is never undefined, instead falling back to an empty string

I also modified a utility method in EuiI18n so future occurrences of undefined sneaking in would be treated appropriately. This change by itself would have resolved the test error, but wouldn't have maintained the same test snapshot.

[chandlerprall]

jenkins test this

[kibanamachine]

Preview documentation changes for this PR: https://eui.elastic.co/pr_4352/

[chandlerprall]

Changes LGTM, pulled & tested locally by passing a JSX element as the label.

[Dishebh]

Thanks a lot, @chandlerprall, will surely look at the changes you made.

[prcdpr]

Thank you guys for this change 👏