как выбрать текст элемента с реакцией + фермент

Question

Просто, что он говорит. Некоторые примеры кода:

let wrapper = shallow(<div><button class='btn btn-primary'>OK</button></div>); 

const b = wrapper.find('.btn'); 

expect(b.text()).to.be.eql('OK'); // fails, 

Кроме того, метод html возвращает содержимое элемента, но и сам элемент, а также все атрибуты, например, он дает <button class='btn btn-primary'>OK</button>. Поэтому я думаю, что в худшем случае я могу назвать html и повторно использовать его, но ...

Есть ли способ получить содержимое элемента, чтобы я мог утверждать его.

Answer 1

Не забывайте, что вы передаете узел (ReactElement) в функцию shallow, и в React нет атрибута HTML class. Вы должны использовать className.

От Реагировать ДОКУМЕНТАЦИЯ

Все атрибуты верблюд-обсаженных и атрибуты class и for являются className и htmlFor, соответственно, он должен соответствовать DOM API спецификации.

Этот тест должен работает

const wrapper = shallow(<div><button className='btn btn-primary'>OK</button></div>); 
const button = wrapper.find('.btn'); 
expect(button.text()).to.be.eql('OK'); 

Answer 2

Я думаю, @ Луи barranqueiro, вероятно, ответил на ваш основной вопрос. То есть, вам нужен селектор CSS, и поэтому вы должны были использовать className не class.

Однако, чтобы попытаться ответить на вопрос о том, как выбрать текст элемента, используя фактический пример вы дали:

let wrapper = shallow(<div><button class='btn btn-primary'>OK</button></div>);

вы должны использовать что-то вроде object property selector, например:

expect(wrapper.find({ class: "btn btn-primary" }).text()).to.equal('OK');

или проп синтаксис:

expect(wrapper.find('[class="btn btn-primary"]').text()).to.equal('OK');

(или даже более явно):

expect(wrapper.find('button[class="btn btn-primary"]').text()).to.equal('OK');