Утверждая, что элемент HTML существует с мелким ферментом

У меня есть react-redux-form форма, в которой я хотел бы проверить, есть ли соответствующие ярлыки, связанные с моими элементами управления формы.

Тестируемая форма:

const MyApp = ({ dropdownData }) => {
    return (
        <Form model="myForm">
            <fieldset>
                <legend>Contact Details</legend>

                <label htmlFor="reference">Ref:</label>
                <Control.text model=".Reference" id="reference" />
                <br />

                <label htmlFor="id">ID:</label>
                <Control.text model=".id" id="id" />
                <br />

                <label htmlFor="customer-name">Cust Name:</label>
                <Control.text model=".customerName" id="customer-name" />
                <br />
            </fieldset>
        </Form>
    );
});

Я написал пару тестов:

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

import Form from './Form.js';
import scenarios from './form.testdata.js';
import dropdowns from './dropdowns.json';

describe.only('Form component', () => {
    let component;
    const formName = 'myForm';

    before(() => {
        component = shallow(<Form dropdownData={dropdowns} />);
    });

    // it('should...', () => {
    //     console.log( component.find(`label[forHtml="case-reference"]`) );
    // });

    scenarios.forEach(scenario => {
        context(`field with id "${scenario.id}"`, () => {
            it(`should have name ${scenario.name}`, () => {
                // console.log(component.find(`[id="${scenario.id}"]`).props());
                const modelName = component.find(`[id="${scenario.id}"]`).props().model;
                expect(`${formName}${modelName}`).to.equal(scenario.name);
            });

            it('should have an associated label', () => {
                // console.info(component.find(`label[forHtml="${scenario.id}"]`).length);  // returns 0
                expect(component.find(`label[forHtml="${scenario.id}"]`)).to.havelengthOf(1);
            });
        });
    });
});

Тест называется "should have name ${scenario.name}"работает, но я не могу утверждать, что ярлыки существуют.

Пример ошибки, возвращенной из этого:

1) Form component field with id "reference" should have an associated label:
   AssertionError: expected { Object (root, unrendered, ...) } to equal 1
    at Context.<anonymous> (src/components/Form/Form.spec.js:30:78)

Это можно обойти? Или лучшее решение?

0 ответов

Другие вопросы по тегам