开玩笑+酶:如何测试图像src? [英] Jest + Enzyme: How to test an image src?

问题描述

我有一个徽标组件:

import React from "react";
import logo from "assets/images/logo.png";

const Logo = () => {
  return <img style={{ width: 50 }} src={logo} alt="logo" />;
};

export default Logo;

测试文件:

import React from "react";
import Logo from "components/shared/Logo";

describe("<Logo />", () => {
  it("renders an image", () => {
    const logo = shallow(<Logo />);

    expect(logo.find("img").prop("src")).toEqual("blahh");
  });
});

但是当我运行测试时，会出现一些奇怪的错误:

But when I run the test, there is some weird error:

$ NODE_PATH=src jest
 FAIL  src/tests/Logo.test.js
  ● <Logo /> › renders an image

    TypeError: val.entries is not a function

      at printImmutableEntries (node_modules/expect/node_modules/pretty-format/build/plugins/immutable.js:44:5)
      at Object.<anonymous>.exports.serialize (node_modules/expect/node_modules/pretty-format/build/plugins/immutable.js:178:12)

我应该如何测试图像src ==="assets/images/logo.png"?

How am I supposed to test that the image src === "assets/images/logo.png"?

推荐答案

我假设您将测试写在徽标组件附近的__test__目录中.

I suppose that you write your tests inside a __test__ directory near Logo components .

无论如何，请相对于测试文件导入"assets/images/logo.png".

Anyway, import your "assets/images/logo.png" relatively to your test file.

如果您的项目结构是这样

if your project structure is like this

Project ├── assets │ └── images ├ | │ └── logo.png ├── src │ └── components ├ |── Logo.js │ └── __tests__ ├ |── logo.test.js └

Project ├── assets │ └── images ├ | │ └── logo.png ├── src │ └── components ├ |── Logo.js │ └── __tests__ ├ |── logo.test.js └

首先，就像我说的那样，通过键入以下内容将图像导入到您的logo.test.js中:

First, Like I said import image into your logo.test.js by typing:

import React from 'react'; 
import {shallow} from 'enzyme';

import Logo from "./../Logo"; 
import logoImage from "./../../../assets/images/logo.png;

describe("<Logo />", () => {
    it("renders an image", () => {
        const logo = shallow(<Logo />);

        expect(logo.find("img").prop("src")).toEqual(logoImage);

     });
 });

这篇关于开玩笑+酶:如何测试图像src?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！