Select component encountering 'TypeError: Cannot read property 'toString' of undefined'

[mhuth]

Describe the issue. What is the expected and unexpected behavior?

Getting this error when using the <Select> component:

TypeError: Cannot read property 'toString' of undefined
    at f.checkForValue (SelectMenu.js:40)
    at SelectMenu.js:79
    ...
    at L (react.production.min.js:19)
    at Object.map (react.production.min.js:20)
    at f.extendCheckboxChildren (SelectMenu.js:78)
    at SelectMenu.js:99

Please provide the steps to reproduce. Feel free to link CodeSandbox or another tool.

Can't really reproduce outside our application, but its basically the <Select> component with a few child components in it, eg:

<Select>
  <InputGroup>...</InputGroup>
  <SelectGroup>
    <SelectOption>
   ...
    </SelectOption>
   </SelectGroup>
  <Button>...</Button>
</Select>

In our case, the <InputGroup>, <SelectGroup> and <Button> components all produce the above error if they don't have a value attribute defined in them.

Is this a bug or enhancement? If this issue is a bug, is this issue blocking you or is there a work-around?
It is a bug and our workaround was to add value='' attributes to the child components triggering the error.

This patch to packages/react-core/src/components/Select/SelectMenu.tsx also fixes the issue for us:

@@ -95,6 +95,7 @@ class SelectMenuWithRef extends React.Component<SelectMenuProps> {
    }

    const isSelectOptionObject =
+     valueToCheck !== undefined &&
      typeof valueToCheck !== 'string' &&
      (valueToCheck as SelectOptionObject).toString &&
      (valueToCheck as SelectOptionObject).compareTo;

We are using "@patternfly/react-core": "4.32.1",

[AllenBW]

the pain is real 😭

[tlabaj]

closed by #4603