CODEWITHSUNDEEP
javascriptreactjsjestjsreact-testing-libraryimagesource
MaheenUnzeelah
MaheenUnzeelah

Reputation: 71

How to test the source of image using just jest not enzyme in react if image source is imported?

I have an image tag in react whose source is from my assets folder which is imported. I want to test it and match the source attribute having exactly same value. I have tried using toHaveAtrribute('src',value) but in this case test case is passing even if I pass a different image. In a react component file the tag is following where "img1" is an image being imported from assets folder.

component.js file:

 <img src={img1}/>

In test.js file:

   const MockComp=(props)=>{
        const {image}=props;
        return <Router><Comp image={image}/></Router> 
    }


   test("Image testing", () => {
      render(
            <MockComp
             image={img1}
            />
        );
   })
        const image=screen.getByRole('img');
        expect(image).toHaveAttribute('src',`${img2}`);

If I pass "img2" being a different image than img1 in toHaveAttribute(), test case still passes. The requirement is to just use jest not enzyme. Is it possible to match both sources using just jest and react testing library.

P.S: I have just started to write unit cases so I am still a Beginner in this jest testing.

Upvotes: 2

Views: 1169

Answers (0)

Related Questions