ant-design/tests/form/__snapshots__/demo.test.js.snap

exports[`test renders ./components/form/demo/advanced-search.md correctly 1`] = `
<div>
  <form
    class="ant-form ant-form-horizontal ant-advanced-search-form">
    <div
      class="ant-row"
      style="margin-left:-20px;margin-right:-20px;">
      <div
        class="ant-col-8"
        style="padding-left:20px;padding-right:20px;">
        <div
          class="ant-row ant-form-item">
          <div
            class="ant-col-5 ant-form-item-label">
            <label
              class=""
              for="field-0">
              Field 0
            </label>
          </div>
          <div
            class="ant-col-19">
            <div
              class="ant-form-item-control ">
              <span
                class="ant-input-wrapper">
                <input
                  class="ant-input ant-input-lg"
                  data-__meta="[object Object]"
                  id="field-0"
                  placeholder="placeholder"
                  type="text"
                  value="" />
              </span>
            </div>
          </div>
        </div>
      </div>
      <div
        class="ant-col-8"
        style="padding-left:20px;padding-right:20px;">
        <div
          class="ant-row ant-form-item">
          <div
            class="ant-col-5 ant-form-item-label">
            <label
              class=""
              for="field-1">
              Field 1
            </label>
          </div>
          <div
            class="ant-col-19">
            <div
              class="ant-form-item-control ">
              <span
                class="ant-input-wrapper">
                <input
                  class="ant-input ant-input-lg"
                  data-__meta="[object Object]"
                  id="field-1"
                  placeholder="placeholder"
                  type="text"
                  value="" />
              </span>
            </div>
          </div>
        </div>
      </div>
      <div
        class="ant-col-8"
        style="padding-left:20px;padding-right:20px;">
        <div
          class="ant-row ant-form-item">
          <div
            class="ant-col-5 ant-form-item-label">
            <label
              class=""
              for="field-2">
              Field 2
            </label>
          </div>
          <div
            class="ant-col-19">
            <div
              class="ant-form-item-control ">
              <span
                class="ant-input-wrapper">
                <input
                  class="ant-input ant-input-lg"
                  data-__meta="[object Object]"
                  id="field-2"
                  placeholder="placeholder"
                  type="text"
                  value="" />
              </span>
            </div>
          </div>
        </div>
      </div>
      <div
        class="ant-col-8"
        style="padding-left:20px;padding-right:20px;">
        <div
          class="ant-row ant-form-item">
          <div
            class="ant-col-5 ant-form-item-label">
            <label
              class=""
              for="field-3">
              Field 3
            </label>
          </div>
          <div
            class="ant-col-19">
            <div
              class="ant-form-item-control ">
              <span
                class="ant-input-wrapper">
                <input
                  class="ant-input ant-input-lg"
                  data-__meta="[object Object]"
                  id="field-3"
                  placeholder="placeholder"
                  type="text"
                  value="" />
              </span>
            </div>
          </div>
        </div>
      </div>
      <div
        class="ant-col-8"
        style="padding-left:20px;padding-right:20px;">
        <div
          class="ant-row ant-form-item">
          <div
            class="ant-col-5 ant-form-item-label">
            <label
              class=""
              for="field-4">
              Field 4
            </label>
          </div>
          <div
            class="ant-col-19">
            <div
              class="ant-form-item-control ">
              <span
                class="ant-input-wrapper">
                <input
                  class="ant-input ant-input-lg"
                  data-__meta="[object Object]"
                  id="field-4"
                  placeholder="placeholder"
                  type="text"
                  value="" />
              </span>
            </div>
          </div>
        </div>
      </div>
      <div
        class="ant-col-8"
        style="padding-left:20px;padding-right:20px;">
        <div
          class="ant-row ant-form-item">
          <div
            class="ant-col-5 ant-form-item-label">
            <label
              class=""
              for="field-5">
              Field 5
            </label>
          </div>
          <div
            class="ant-col-19">
            <div
              class="ant-form-item-control ">
              <span
                class="ant-input-wrapper">
                <input
                  class="ant-input ant-input-lg"
                  data-__meta="[object Object]"
                  id="field-5"
                  placeholder="placeholder"
                  type="text"
                  value="" />
              </span>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div
      class="ant-row">
      <div
        class="ant-col-24"
        style="text-align:right;">
        <button
          class="ant-btn ant-btn-primary"
          type="submit">
          <span>
            Search
          </span>
        </button>
        <button
          class="ant-btn"
          style="margin-left:8px;"
          type="button">
          <span>
            Clear
          </span>
        </button>
        <a
          style="margin-left:8px;font-size:12px;">
          Collapse 
          <i
            class="anticon anticon-down " />
        </a>
      </div>
    </div>
  </form>
  <div
    class="search-result-list">
    Search Result List
  </div>
</div>
`;

exports[`test renders ./components/form/demo/customized-form-controls.md correctly 1`] = `
<form
  class="ant-form ant-form-inline">
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-form-item-label">
      <label
        class=""
        for="price">
        Price
      </label>
    </div>
    <div
      class="">
      <div
        class="ant-form-item-control has-success">
        <span>
          <span
            class="ant-input-wrapper">
            <input
              class="ant-input ant-input-lg"
              style="width:65%;margin-right:3%;"
              type="text"
              value="0" />
          </span>
          <div
            class="ant-select-lg ant-select ant-select-enabled"
            style="width:32%;">
            <div
              aria-autocomplete="list"
              aria-expanded="false"
              aria-haspopup="true"
              class="ant-select-selection
                        ant-select-selection--single"
              role="combobox"
              tabindex="0">
              <div
                class="ant-select-selection__rendered">
                <div
                  class="ant-select-selection-selected-value"
                  style="display:block;opacity:1;"
                  title="RMB">
                  RMB
                </div>
              </div>
              <span
                class="ant-select-arrow"
                style="user-select:none;-webkit-user-select:none;"
                unselectable="unselectable">
                <b />
              </span>
            </div>
          </div>
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="">
      <div
        class="ant-form-item-control ">
        <button
          class="ant-btn ant-btn-primary ant-btn-lg"
          type="submit">
          <span>
            Submit
          </span>
        </button>
      </div>
    </div>
  </div>
</form>
`;

exports[`test renders ./components/form/demo/dynamic-form-item.md correctly 1`] = `
<form
  class="ant-form ant-form-horizontal">
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-4 ant-form-item-label">
      <label
        class=""
        for="names-0">
        Passengers
      </label>
    </div>
    <div
      class="ant-col-20">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-input-wrapper">
          <input
            class="ant-input ant-input-lg"
            data-__meta="[object Object]"
            id="names-0"
            placeholder="passenger name"
            style="width:60%;margin-right:8px;"
            type="text"
            value="" />
        </span>
        <i
          class="anticon anticon-minus-circle-o dynamic-delete-button"
          disabled="" />
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-20 ant-col-offset-4">
      <div
        class="ant-form-item-control ">
        <button
          class="ant-btn ant-btn-dashed ant-btn-lg"
          style="width:60%;"
          type="button">
          <i
            class="anticon anticon-plus " />
          <span>
             Add
          </span>
        </button>
      </div>
    </div>
  </div>
</form>
`;

exports[`test renders ./components/form/demo/form-in-modal.md correctly 1`] = `
<div>
  <button
    class="ant-btn ant-btn-primary"
    type="button">
    <span>
      New Collection
    </span>
  </button>
</div>
`;

exports[`test renders ./components/form/demo/global-state.md correctly 1`] = `
<div>
  <form
    class="ant-form ant-form-inline">
    <div
      class="ant-row ant-form-item">
      <div
        class="ant-form-item-label">
        <label
          class="ant-form-item-required"
          for="username">
          Username
        </label>
      </div>
      <div
        class="">
        <div
          class="ant-form-item-control has-success">
          <span
            class="ant-input-wrapper">
            <input
              class="ant-input ant-input-lg"
              data-__meta="[object Object]"
              id="username"
              type="text"
              value="BENJYCUI" />
          </span>
        </div>
      </div>
    </div>
  </form>
  <pre
    class="language-bash">
    {
      \"username\": {
        \"value\": \"benjycui\"
      }
    }
  </pre>
</div>
`;

exports[`test renders ./components/form/demo/horizontal-login.md correctly 1`] = `
<form
  class="ant-form ant-form-inline">
  <div
    class="ant-row ant-form-item">
    <div
      class="">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-input-wrapper ant-input-group">
          <span
            class="ant-input-group-addon">
            <i
              class="anticon anticon-user " />
          </span>
          <input
            class="ant-input ant-input-lg"
            data-__meta="[object Object]"
            id="userName"
            placeholder="Username"
            type="text"
            value="" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-input-wrapper ant-input-group">
          <span
            class="ant-input-group-addon">
            <i
              class="anticon anticon-lock " />
          </span>
          <input
            class="ant-input ant-input-lg"
            data-__meta="[object Object]"
            id="password"
            placeholder="Password"
            type="password"
            value="" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="">
      <div
        class="ant-form-item-control ">
        <button
          class="ant-btn ant-btn-primary ant-btn-lg"
          type="submit">
          <span>
            Log in
          </span>
        </button>
      </div>
    </div>
  </div>
</form>
`;

exports[`test renders ./components/form/demo/normal-login.md correctly 1`] = `
<form
  class="ant-form login-form">
  <div
    class="ant-row ant-form-item">
    <div
      class="">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-input-wrapper ant-input-group">
          <span
            class="ant-input-group-addon">
            <i
              class="anticon anticon-user " />
          </span>
          <input
            class="ant-input ant-input-lg"
            data-__meta="[object Object]"
            id="userName"
            placeholder="Username"
            type="text"
            value="" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-input-wrapper ant-input-group">
          <span
            class="ant-input-group-addon">
            <i
              class="anticon anticon-lock " />
          </span>
          <input
            class="ant-input ant-input-lg"
            data-__meta="[object Object]"
            id="password"
            placeholder="Password"
            type="password"
            value="" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="">
      <div
        class="ant-form-item-control has-success">
        <label
          class="ant-checkbox-wrapper">
          <span
            class="ant-checkbox ant-checkbox-checked ant-checkbox-checked-1">
            <span
              class="ant-checkbox-inner" />
            <input
              checked=""
              class="ant-checkbox-input"
              type="checkbox" />
          </span>
          <span>
            Remember me
          </span>
        </label>
        <a
          class="login-form-forgot">
          Forgot password
        </a>
        <button
          class="ant-btn ant-btn-primary ant-btn-lg login-form-button"
          type="submit">
          <span>
            Log in
          </span>
        </button>
        Or 
        <a>
          register now!
        </a>
      </div>
    </div>
  </div>
</form>
`;

exports[`test renders ./components/form/demo/register.md correctly 1`] = `
<form
  class="ant-form ant-form-horizontal">
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="email">
        E-mail
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-input-wrapper">
          <input
            class="ant-input ant-input-lg"
            data-__meta="[object Object]"
            id="email"
            type="text"
            value="" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="password">
        Password
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-input-wrapper">
          <input
            class="ant-input ant-input-lg"
            data-__meta="[object Object]"
            id="password"
            type="password"
            value="" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="confirm">
        Confirm Password
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-input-wrapper">
          <input
            class="ant-input ant-input-lg"
            data-__meta="[object Object]"
            id="confirm"
            type="password"
            value="" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="nickname">
        <span>
          Nickname 
          <i
            class="anticon anticon-question-circle-o " />
        </span>
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-input-wrapper">
          <input
            class="ant-input ant-input-lg"
            data-__meta="[object Object]"
            id="nickname"
            type="text"
            value="" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="residence">
        Habitual Residence
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control has-success">
        <span
          class="ant-cascader-picker">
          <span
            class="ant-input-wrapper">
            <input
              autocomplete="off"
              class="ant-input ant-cascader-input ant-input-lg"
              data-__meta="[object Object]"
              id="residence"
              readonly=""
              type="text"
              value="" />
          </span>
          <span
            class="ant-cascader-picker-label">
            Zhejiang / Hangzhou / West Lake
          </span>
          <i
            class="anticon anticon-cross-circle ant-cascader-picker-clear" />
          <i
            class="anticon anticon-down ant-cascader-picker-arrow" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="phone">
        Phone Number
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-input-wrapper ant-input-group">
          <span
            class="ant-input-group-addon">
            <div
              class="icp-selector ant-select ant-select-enabled">
              <div
                aria-autocomplete="list"
                aria-expanded="false"
                aria-haspopup="true"
                class="ant-select-selection
                          ant-select-selection--single"
                role="combobox"
                tabindex="0">
                <div
                  class="ant-select-selection__rendered">
                  <div
                    class="ant-select-selection-selected-value"
                    style="display:block;opacity:1;"
                    title="+86">
                    +86
                  </div>
                </div>
                <span
                  class="ant-select-arrow"
                  style="user-select:none;-webkit-user-select:none;"
                  unselectable="unselectable">
                  <b />
                </span>
              </div>
            </div>
          </span>
          <input
            class="ant-input ant-input-lg"
            data-__meta="[object Object]"
            id="phone"
            type="text"
            value="" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="captcha">
        Captcha
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control ">
        <div
          class="ant-row"
          style="margin-left:-4px;margin-right:-4px;">
          <div
            class="ant-col-12"
            style="padding-left:4px;padding-right:4px;">
            <span
              class="ant-input-wrapper">
              <input
                class="ant-input ant-input-lg"
                data-__meta="[object Object]"
                id="captcha"
                type="text"
                value="" />
            </span>
          </div>
          <div
            class="ant-col-12"
            style="padding-left:4px;padding-right:4px;">
            <button
              class="ant-btn ant-btn-lg"
              type="button">
              <span>
                Get captcha
              </span>
            </button>
          </div>
        </div>
        <span
          class="ant-form-extra">
          We must make sure that your are a human.
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item"
    style="margin-bottom:8px;">
    <div
      class="ant-col-14 ant-col-offset-6">
      <div
        class="ant-form-item-control ">
        <label
          class="ant-checkbox-wrapper">
          <span
            class="ant-checkbox">
            <span
              class="ant-checkbox-inner" />
            <input
              class="ant-checkbox-input"
              type="checkbox" />
          </span>
          <span>
            I had read the 
            <a>
              agreement
            </a>
          </span>
        </label>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-14 ant-col-offset-6">
      <div
        class="ant-form-item-control ">
        <button
          class="ant-btn ant-btn-primary ant-btn-lg"
          type="submit">
          <span>
            Register
          </span>
        </button>
      </div>
    </div>
  </div>
</form>
`;

exports[`test renders ./components/form/demo/time-related-controls.md correctly 1`] = `
<form
  class="ant-form ant-form-horizontal">
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-8 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="date-picker">
        DatePicker
      </label>
    </div>
    <div
      class="ant-col-16">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-calendar-picker">
          <span>
            <input
              class="ant-calendar-range-picker ant-input ant-input-lg"
              placeholder="请选择日期"
              readonly=""
              value="" />
            <span
              class="ant-calendar-picker-icon" />
          </span>
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-8 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="date-time-picker">
        DatePicker[showTime]
      </label>
    </div>
    <div
      class="ant-col-16">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-calendar-picker">
          <span>
            <input
              class="ant-calendar-range-picker ant-input ant-input-lg"
              placeholder="请选择日期"
              readonly=""
              value="" />
            <span
              class="ant-calendar-picker-icon" />
          </span>
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-8 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="month-picker">
        MonthPicker
      </label>
    </div>
    <div
      class="ant-col-16">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-calendar-picker">
          <span>
            <input
              class="ant-calendar-range-picker ant-input ant-input-lg"
              placeholder="请选择日期"
              readonly=""
              value="" />
            <span
              class="ant-calendar-picker-icon" />
          </span>
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-8 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="range-picker">
        RangePicker
      </label>
    </div>
    <div
      class="ant-col-16">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-calendar-picker">
          <span
            class="ant-calendar-range-picker ant-input ant-input-lg">
            <input
              class="ant-calendar-range-picker-input"
              placeholder="开始日期"
              readonly=""
              value="" />
            <span
              class="ant-calendar-range-picker-separator">
               ~ 
            </span>
            <input
              class="ant-calendar-range-picker-input"
              placeholder="结束日期"
              readonly=""
              value="" />
            <span
              class="ant-calendar-picker-icon" />
          </span>
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-8 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="range-time-picker">
        RangePicker[showTime]
      </label>
    </div>
    <div
      class="ant-col-16">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-calendar-picker">
          <span
            class="ant-calendar-range-picker ant-input ant-input-lg">
            <input
              class="ant-calendar-range-picker-input"
              placeholder="开始日期"
              readonly=""
              value="" />
            <span
              class="ant-calendar-range-picker-separator">
               ~ 
            </span>
            <input
              class="ant-calendar-range-picker-input"
              placeholder="结束日期"
              readonly=""
              value="" />
            <span
              class="ant-calendar-picker-icon" />
          </span>
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-8 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="time-picker">
        TimePicker
      </label>
    </div>
    <div
      class="ant-col-16">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-time-picker ant-time-picker-large">
          <input
            class="ant-time-picker-input"
            placeholder="请选择时间"
            readonly=""
            type="text"
            value="" />
          <span
            class="ant-time-picker-icon" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-16 ant-col-offset-8">
      <div
        class="ant-form-item-control ">
        <button
          class="ant-btn ant-btn-primary ant-btn-lg"
          type="submit">
          <span>
            Submit
          </span>
        </button>
      </div>
    </div>
  </div>
</form>
`;

exports[`test renders ./components/form/demo/validate-other.md correctly 1`] = `
<form
  class="ant-form ant-form-horizontal">
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="select">
        Select
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control ">
        <div
          class="ant-select-lg ant-select ant-select-enabled">
          <div
            aria-autocomplete="list"
            aria-expanded="false"
            aria-haspopup="true"
            class="ant-select-selection
                      ant-select-selection--single"
            role="combobox"
            tabindex="0">
            <div
              class="ant-select-selection__rendered">
              <div
                class="ant-select-selection__placeholder"
                style="display:block;user-select:none;-webkit-user-select:none;"
                unselectable="unselectable">
                Please select a country
              </div>
            </div>
            <span
              class="ant-select-arrow"
              style="user-select:none;-webkit-user-select:none;"
              unselectable="unselectable">
              <b />
            </span>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class="ant-form-item-required"
        for="select-multiple">
        Select[multiple]
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control ">
        <div
          class="ant-select-lg ant-select ant-select-enabled">
          <div
            aria-autocomplete="list"
            aria-expanded="false"
            aria-haspopup="true"
            class="ant-select-selection
                      ant-select-selection--multiple"
            role="combobox">
            <div
              class="ant-select-selection__rendered">
              <div
                class="ant-select-selection__placeholder"
                style="display:block;user-select:none;-webkit-user-select:none;"
                unselectable="unselectable">
                Please select favourite colors
              </div>
              <ul>
                <li
                  class="ant-select-search ant-select-search--inline">
                  <div
                    class="ant-select-search__field__wrap">
                    <input
                      class="ant-select-search__field"
                      value="" />
                    <span
                      class="ant-select-search__field__mirror" />
                  </div>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class=""
        for="input-number">
        InputNumber
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control has-success">
        <div
          class="ant-input-number ant-input-number-lg">
          <div
            class="ant-input-number-handler-wrap">
            <span
              class="ant-input-number-handler ant-input-number-handler-up "
              unselectable="unselectable">
              <span
                class="ant-input-number-handler-up-inner"
                unselectable="unselectable" />
            </span>
            <span
              class="ant-input-number-handler ant-input-number-handler-down "
              unselectable="unselectable">
              <span
                class="ant-input-number-handler-down-inner"
                unselectable="unselectable" />
            </span>
          </div>
          <div
            class="ant-input-number-input-wrap">
            <input
              autocomplete="off"
              class="ant-input-number-input"
              max="10"
              min="1"
              value="3" />
          </div>
        </div>
        <span
          class="ant-form-text">
           machines
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class=""
        for="switch">
        Switch
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control ">
        <span
          class="ant-switch"
          data-__meta="[object Object]"
          id="switch"
          tabindex="0">
          <span
            class="ant-switch-inner" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class=""
        for="slider">
        Slider
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control ">
        <div
          class="ant-slider ant-slider-with-marks">
          <div
            class="ant-slider-rail" />
          <div
            class="ant-slider-track ant-slider-track-1"
            style="visibility:visible;left:0%;width:0%;" />
          <div
            class="ant-slider-step">
            <span
              class="ant-slider-dot ant-slider-dot-active"
              style="left:0%;" />
            <span
              class="ant-slider-dot"
              style="left:20%;" />
            <span
              class="ant-slider-dot"
              style="left:40%;" />
            <span
              class="ant-slider-dot"
              style="left:60%;" />
            <span
              class="ant-slider-dot"
              style="left:80%;" />
            <span
              class="ant-slider-dot"
              style="left:100%;" />
          </div>
          <div
            class="ant-slider-handle ant-slider-handle-2 ant-slider-handle-upper"
            style="left:0%;" />
          <div
            class="ant-slider-mark">
            <span
              class="ant-slider-mark-text ant-slider-mark-text-active"
              style="width:18%;margin-left:-9%;left:0%;">
              A
            </span>
            <span
              class="ant-slider-mark-text"
              style="width:18%;margin-left:-9%;left:20%;">
              B
            </span>
            <span
              class="ant-slider-mark-text"
              style="width:18%;margin-left:-9%;left:40%;">
              C
            </span>
            <span
              class="ant-slider-mark-text"
              style="width:18%;margin-left:-9%;left:60%;">
              D
            </span>
            <span
              class="ant-slider-mark-text"
              style="width:18%;margin-left:-9%;left:80%;">
              E
            </span>
            <span
              class="ant-slider-mark-text"
              style="width:18%;margin-left:-9%;left:100%;">
              F
            </span>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class=""
        for="radio-group">
        Radio.Group
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control ">
        <div
          class="ant-radio-group ant-radio-group-large">
          <label
            class="ant-radio-button-wrapper">
            <span
              class="ant-radio-button">
              <span
                class="ant-radio-button-inner" />
              <input
                class="ant-radio-button-input"
                type="radio" />
            </span>
            <span>
              item 1
            </span>
          </label>
          <label
            class="ant-radio-button-wrapper">
            <span
              class="ant-radio-button">
              <span
                class="ant-radio-button-inner" />
              <input
                class="ant-radio-button-input"
                type="radio" />
            </span>
            <span>
              item 2
            </span>
          </label>
          <label
            class="ant-radio-button-wrapper">
            <span
              class="ant-radio-button">
              <span
                class="ant-radio-button-inner" />
              <input
                class="ant-radio-button-input"
                type="radio" />
            </span>
            <span>
              item 3
            </span>
          </label>
        </div>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-6 ant-form-item-label">
      <label
        class=""
        for="upload">
        Upload
      </label>
    </div>
    <div
      class="ant-col-14">
      <div
        class="ant-form-item-control ">
        <span
          class="">
          <div
            class="ant-upload ant-upload-select ant-upload-select-picture" />
          <div
            class="ant-upload-list ant-upload-list-picture" />
        </span>
        <span
          class="ant-form-extra">
          longgggggggggggggggggggggggggggggggggg
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-12 ant-col-offset-6">
      <div
        class="ant-form-item-control ">
        <button
          class="ant-btn ant-btn-primary ant-btn-lg"
          type="submit">
          <span>
            Submit
          </span>
        </button>
      </div>
    </div>
  </div>
</form>
`;

exports[`test renders ./components/form/demo/validate-static.md correctly 1`] = `
<form
  class="ant-form ant-form-horizontal">
  <div
    class="ant-row ant-form-item ant-form-item-with-help">
    <div
      class="ant-col-5 ant-form-item-label">
      <label
        class="">
        Fail
      </label>
    </div>
    <div
      class="ant-col-12">
      <div
        class="ant-form-item-control has-error">
        <span
          class="ant-input-wrapper">
          <input
            class="ant-input ant-input-lg"
            id="error"
            placeholder="unavailable choice"
            type="text" />
        </span>
        <div
          class="ant-form-explain">
          Should be combination of numbers & alphabets
        </div>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-5 ant-form-item-label">
      <label
        class="">
        Warning
      </label>
    </div>
    <div
      class="ant-col-12">
      <div
        class="ant-form-item-control has-warning">
        <span
          class="ant-input-wrapper">
          <input
            class="ant-input ant-input-lg"
            id="warning"
            placeholder="Warning"
            type="text" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item ant-form-item-with-help">
    <div
      class="ant-col-5 ant-form-item-label">
      <label
        class="">
        Validating
      </label>
    </div>
    <div
      class="ant-col-12">
      <div
        class="ant-form-item-control has-feedback is-validating">
        <span
          class="ant-input-wrapper">
          <input
            class="ant-input ant-input-lg"
            id="validating"
            placeholder="I\'m the content is being validated"
            type="text" />
        </span>
        <div
          class="ant-form-explain">
          The information is being validated...
        </div>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-5 ant-form-item-label">
      <label
        class="">
        Success
      </label>
    </div>
    <div
      class="ant-col-12">
      <div
        class="ant-form-item-control has-feedback has-success">
        <span
          class="ant-input-wrapper">
          <input
            class="ant-input ant-input-lg"
            id="success"
            placeholder="I\'m the content"
            type="text" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item">
    <div
      class="ant-col-5 ant-form-item-label">
      <label
        class="">
        Warning
      </label>
    </div>
    <div
      class="ant-col-12">
      <div
        class="ant-form-item-control has-feedback has-warning">
        <span
          class="ant-input-wrapper">
          <input
            class="ant-input ant-input-lg"
            id="warning"
            placeholder="Warning"
            type="text" />
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item ant-form-item-with-help">
    <div
      class="ant-col-5 ant-form-item-label">
      <label
        class="">
        Fail
      </label>
    </div>
    <div
      class="ant-col-12">
      <div
        class="ant-form-item-control has-feedback has-error">
        <span
          class="ant-input-wrapper">
          <input
            class="ant-input ant-input-lg"
            id="error"
            placeholder="unavailable choice"
            type="text" />
        </span>
        <div
          class="ant-form-explain">
          Should be combination of numbers & alphabets
        </div>
      </div>
    </div>
  </div>
  <div
    class="ant-row ant-form-item ant-form-item-with-help">
    <div
      class="ant-col-5 ant-form-item-label">
      <label
        class="">
        inline
      </label>
    </div>
    <div
      class="">
      <div
        class="ant-form-item-control ">
        <div
          class="ant-col-6">
          <div
            class="ant-row ant-form-item ant-form-item-with-help">
            <div
              class="">
              <div
                class="ant-form-item-control has-error">
                <span
                  class="ant-calendar-picker">
                  <span>
                    <input
                      class="ant-calendar-range-picker ant-input ant-input-lg"
                      placeholder="请选择日期"
                      readonly=""
                      value="" />
                    <span
                      class="ant-calendar-picker-icon" />
                  </span>
                </span>
                <div
                  class="ant-form-explain">
                  Please select the correct date
                </div>
              </div>
            </div>
          </div>
        </div>
        <div
          class="ant-col-1">
          <p
            class="ant-form-split">
            -
          </p>
        </div>
        <div
          class="ant-col-6">
          <div
            class="ant-row ant-form-item">
            <div
              class="">
              <div
                class="ant-form-item-control ">
                <span
                  class="ant-calendar-picker">
                  <span>
                    <input
                      class="ant-calendar-range-picker ant-input ant-input-lg"
                      placeholder="请选择日期"
                      readonly=""
                      value="" />
                    <span
                      class="ant-calendar-picker-icon" />
                  </span>
                </span>
              </div>
            </div>
          </div>
        </div>
        <div
          class="ant-form-explain" />
      </div>
    </div>
  </div>
</form>
`;

exports[`test renders ./components/form/demo/without-form-create.md correctly 1`] = `
<form
  class="ant-form ant-form-horizontal">
  <div
    class="ant-row ant-form-item ant-form-item-with-help">
    <div
      class="ant-col-7 ant-form-item-label">
      <label
        class="">
        Prime between 8 & 12
      </label>
    </div>
    <div
      class="ant-col-12">
      <div
        class="ant-form-item-control ">
        <div
          class="ant-input-number ant-input-number-lg">
          <div
            class="ant-input-number-handler-wrap">
            <span
              class="ant-input-number-handler ant-input-number-handler-up "
              unselectable="unselectable">
              <span
                class="ant-input-number-handler-up-inner"
                unselectable="unselectable" />
            </span>
            <span
              class="ant-input-number-handler ant-input-number-handler-down "
              unselectable="unselectable">
              <span
                class="ant-input-number-handler-down-inner"
                unselectable="unselectable" />
            </span>
          </div>
          <div
            class="ant-input-number-input-wrap">
            <input
              autocomplete="off"
              class="ant-input-number-input"
              max="12"
              min="8"
              value="11" />
          </div>
        </div>
        <div
          class="ant-form-explain">
          A prime is a natural number greater than 1 that has no positive divisors other than 1 and itself.
        </div>
      </div>
    </div>
  </div>
</form>
`;