Как получить атрибут элемента, вложенного в компонент React, используя Jest и/или Enzyme?

Question

Я хочу проверить, правильно ли загружено изображение в приложении React. Я решил проверить атрибут src элемента img, вложенного в компонент React. Я хочу использовать платформу тестирования Jest и, при необходимости, утилиту Enzyme для тестирования.

Выкапывая через Object.keys неглубокий компонент тестирования реактивов, я смог придумать следующее решение. Строка, о которой я не знаю, обозначается звездочками.

import React  from 'react'; 
import {shallow} from 'enzyme'; 
import App  from './App'; 

it('should have the logo image',() => { 
    const app = shallow(<App />); 
    const img = app.find('img'); 
    const src = img.node.props.src; // ****** 
    expect(src).toBe('logo.svg'); 
}); 

Это решение делает работы, но это кажется немного запутанным (это требует свойства собственности свойства обертки) и, кажется, несколько неясных (я не могу легко найти четкие инструкции для этого в Интернете). Итак, это правильный/самый простой способ сделать это?

• Если да, то где документация?
• Если нет, то как иначе я должен/должен был это делать? например Есть ли готовый метод getAttribute или retrieveProp и т. Д. В ферменте? Есть ли лучший способ сделать это, используя что-то другое вместо Enzyme, например. react-addons-test-utils?

This question о Реагировать атрибуты элемента, кажется, не вполне отвечают его для меня, даже если плакат там также указывает на то трудное время найти документацию о заявляющая вынесенное значение атрибута. Ряд других вопросов (например, here, here и here) касаются React/Jest/Enzyme, но не занимаются извлечением значений атрибутов.

Answer 1

После некоторого рытья я нашел следующее. Указанная линия в вопросе:

const src = img.node.props.src; 

можно упростить следующим образом:

const src = img.prop('src'); 

документацию можно найти here.

Если кто-то знает о неферментном способе этого, мне все равно будет интересно узнать об этом.

Answer 2

С Реагировать Test Utilities:

it('should have the logo image',() => 
    const app = TestUtils.renderIntoDocument(<App/>); 
    var image = TestUtils.findRenderedDOMComponentWithTag(app, 'img'); 
    expect(image.getDOMNode().getAttribute('src')).toEqual('logo.svg'); 
}); 

ферментные тесты выглядит намного чище.