Skip to content

Indentation works against contains test #43

@tomascasas

Description

@tomascasas

I found myself testing a component with nested components which I decided to mock. The component also returns a "lot" of html. That is why I decided to test the component contains certain pieces instead of for equality.

This is a valid example of the issue:

class MyComponent extends Component {
  render({imgUrl}) {
    return (
      <div>
        <img src={imgUrl}/>
      </div>
    )
  }
}

expect(<MyComponent imgUrl="http://url" />).to.contain(
  <img src="http://url"/>
)

The test will fail due to rendering of MyComponent vs. the contained render indents differ. See:
MyComponent output:

<div>
  <img src="http://url"/>
  </img>
</div>

Test JSX output:

<img src="http://url"/>
</img>

I think the easiest fix is to prevent indentation when using contains test. Output will not look nice but would still allow to have the test passing.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions