Skip to content

Support Portal components #252

@leoselig

Description

@leoselig

We are currently trying to test a component that uses Material UI's SelectField (a dropdown menu). They use their own Popover component (https://github.com/callemall/material-ui/tree/master/src/DropDownMenu) to bypass the typical overflow: hidden; issue where parts of the overlay is clipped off. Essentially, they are mounting the children (the menu items of the dropdown) into the body.
Unfortunately, enzyme cannot find them this way. E.g.

selectField = mount(
  <SelectField value={this.state.value} onChange={this.handleChange}>
    <MenuItem value={1} primaryText="Never"/>
    <MenuItem value={2} primaryText="Every Night"/>
    <MenuItem value={3} primaryText="Weeknights"/>
    <MenuItem value={4} primaryText="Weekends"/>
    <MenuItem value={5} primaryText="Weekly"/>
  </SelectField>
);
selectField.find(MenuItem).length === 0;

Are we missing any way to deal with this?

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions