ant-design/components/skeleton/__tests__/__snapshots__/demo.test.js.snap

594 lines
14 KiB
Plaintext

// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders ./components/skeleton/demo/active.md correctly 1`] = `
<div
class="ant-skeleton ant-skeleton-active"
>
<div
class="ant-skeleton-content"
>
<h3
class="ant-skeleton-title"
style="width:38%"
/>
<ul
class="ant-skeleton-paragraph"
>
<li />
<li />
<li
style="width:61%"
/>
</ul>
</div>
</div>
`;
exports[`renders ./components/skeleton/demo/basic.md correctly 1`] = `
<div
class="ant-skeleton"
>
<div
class="ant-skeleton-content"
>
<h3
class="ant-skeleton-title"
style="width:38%"
/>
<ul
class="ant-skeleton-paragraph"
>
<li />
<li />
<li
style="width:61%"
/>
</ul>
</div>
</div>
`;
exports[`renders ./components/skeleton/demo/children.md correctly 1`] = `
<div
class="article"
>
<div>
<h4>
Ant Design, a design language
</h4>
<p>
We supply a series of design principles, practical patterns and high quality design resources (Sketch and Axure), to help people create their product prototypes beautifully and efficiently.
</p>
</div>
<button
class="ant-btn"
type="button"
>
<span>
Show Skeleton
</span>
</button>
</div>
`;
exports[`renders ./components/skeleton/demo/complex.md correctly 1`] = `
<div
class="ant-skeleton ant-skeleton-with-avatar"
>
<div
class="ant-skeleton-header"
>
<span
class="ant-skeleton-avatar ant-skeleton-avatar-lg ant-skeleton-avatar-circle"
/>
</div>
<div
class="ant-skeleton-content"
>
<h3
class="ant-skeleton-title"
style="width:50%"
/>
<ul
class="ant-skeleton-paragraph"
>
<li />
<li />
<li />
<li />
</ul>
</div>
</div>
`;
exports[`renders ./components/skeleton/demo/element.md correctly 1`] = `
Array [
<div
class="ant-space ant-space-horizontal ant-space-align-center"
>
<div
class="ant-space-item"
style="margin-right:8px"
>
<div
class="ant-skeleton ant-skeleton-element"
>
<span
class="ant-skeleton-button"
/>
</div>
</div>
<div
class="ant-space-item"
style="margin-right:8px"
>
<div
class="ant-skeleton ant-skeleton-element"
>
<span
class="ant-skeleton-button"
/>
</div>
</div>
<div
class="ant-space-item"
style="margin-right:8px"
>
<div
class="ant-skeleton ant-skeleton-element"
>
<span
class="ant-skeleton-avatar ant-skeleton-avatar-circle"
/>
</div>
</div>
<div
class="ant-space-item"
>
<div
class="ant-skeleton ant-skeleton-element"
>
<span
class="ant-skeleton-input"
style="width:200px"
/>
</div>
</div>
</div>,
<br />,
<br />,
<div
class="ant-skeleton ant-skeleton-element"
>
<div
class="ant-skeleton-image"
>
<svg
class="ant-skeleton-image-svg"
viewBox="0 0 1098 1024"
xmlns="http://www.w3.org/2000/svg"
>
<path
class="ant-skeleton-image-path"
d="M365.714286 329.142857q0 45.714286-32.036571 77.677714t-77.677714 32.036571-77.677714-32.036571-32.036571-77.677714 32.036571-77.677714 77.677714-32.036571 77.677714 32.036571 32.036571 77.677714zM950.857143 548.571429l0 256-804.571429 0 0-109.714286 182.857143-182.857143 91.428571 91.428571 292.571429-292.571429zM1005.714286 146.285714l-914.285714 0q-7.460571 0-12.873143 5.412571t-5.412571 12.873143l0 694.857143q0 7.460571 5.412571 12.873143t12.873143 5.412571l914.285714 0q7.460571 0 12.873143-5.412571t5.412571-12.873143l0-694.857143q0-7.460571-5.412571-12.873143t-12.873143-5.412571zM1097.142857 164.571429l0 694.857143q0 37.741714-26.843429 64.585143t-64.585143 26.843429l-914.285714 0q-37.741714 0-64.585143-26.843429t-26.843429-64.585143l0-694.857143q0-37.741714 26.843429-64.585143t64.585143-26.843429l914.285714 0q37.741714 0 64.585143 26.843429t26.843429 64.585143z"
/>
</svg>
</div>
</div>,
<div
class="ant-divider ant-divider-horizontal"
role="separator"
/>,
<form
class="ant-form ant-form-inline"
style="margin:16px 0"
>
<div
class="ant-row ant-form-item"
>
<div
class="ant-col ant-form-item-label"
>
<label
class=""
title="Active"
>
Active
</label>
</div>
<div
class="ant-col ant-form-item-control"
>
<div
class="ant-form-item-control-input"
>
<div
class="ant-form-item-control-input-content"
>
<button
aria-checked="false"
class="ant-switch"
role="switch"
type="button"
>
<div
class="ant-switch-handle"
/>
<span
class="ant-switch-inner"
/>
</button>
</div>
</div>
</div>
</div>
<div
class="ant-row ant-form-item"
>
<div
class="ant-col ant-form-item-label"
>
<label
class=""
title="Size"
>
Size
</label>
</div>
<div
class="ant-col ant-form-item-control"
>
<div
class="ant-form-item-control-input"
>
<div
class="ant-form-item-control-input-content"
>
<div
class="ant-radio-group ant-radio-group-outline"
>
<label
class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"
>
<span
class="ant-radio-button ant-radio-button-checked"
>
<input
checked=""
class="ant-radio-button-input"
type="radio"
value="default"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Default
</span>
</label>
<label
class="ant-radio-button-wrapper"
>
<span
class="ant-radio-button"
>
<input
class="ant-radio-button-input"
type="radio"
value="large"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Large
</span>
</label>
<label
class="ant-radio-button-wrapper"
>
<span
class="ant-radio-button"
>
<input
class="ant-radio-button-input"
type="radio"
value="small"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Small
</span>
</label>
</div>
</div>
</div>
</div>
</div>
<div
class="ant-row ant-form-item"
>
<div
class="ant-col ant-form-item-label"
>
<label
class=""
title="Button Shape"
>
Button Shape
</label>
</div>
<div
class="ant-col ant-form-item-control"
>
<div
class="ant-form-item-control-input"
>
<div
class="ant-form-item-control-input-content"
>
<div
class="ant-radio-group ant-radio-group-outline"
>
<label
class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"
>
<span
class="ant-radio-button ant-radio-button-checked"
>
<input
checked=""
class="ant-radio-button-input"
type="radio"
value="default"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Default
</span>
</label>
<label
class="ant-radio-button-wrapper"
>
<span
class="ant-radio-button"
>
<input
class="ant-radio-button-input"
type="radio"
value="round"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Round
</span>
</label>
<label
class="ant-radio-button-wrapper"
>
<span
class="ant-radio-button"
>
<input
class="ant-radio-button-input"
type="radio"
value="circle"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Circle
</span>
</label>
</div>
</div>
</div>
</div>
</div>
<div
class="ant-row ant-form-item"
>
<div
class="ant-col ant-form-item-label"
>
<label
class=""
title="Avatar Shape"
>
Avatar Shape
</label>
</div>
<div
class="ant-col ant-form-item-control"
>
<div
class="ant-form-item-control-input"
>
<div
class="ant-form-item-control-input-content"
>
<div
class="ant-radio-group ant-radio-group-outline"
>
<label
class="ant-radio-button-wrapper"
>
<span
class="ant-radio-button"
>
<input
class="ant-radio-button-input"
type="radio"
value="square"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Square
</span>
</label>
<label
class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"
>
<span
class="ant-radio-button ant-radio-button-checked"
>
<input
checked=""
class="ant-radio-button-input"
type="radio"
value="circle"
/>
<span
class="ant-radio-button-inner"
/>
</span>
<span>
Circle
</span>
</label>
</div>
</div>
</div>
</div>
</div>
</form>,
]
`;
exports[`renders ./components/skeleton/demo/list.md correctly 1`] = `
Array [
<button
aria-checked="false"
class="ant-switch"
role="switch"
type="button"
>
<div
class="ant-switch-handle"
/>
<span
class="ant-switch-inner"
/>
</button>,
<div
class="ant-list ant-list-vertical ant-list-lg ant-list-split"
>
<div
class="ant-spin-nested-loading"
>
<div
class="ant-spin-container"
>
<ul
class="ant-list-items"
>
<li
class="ant-list-item ant-list-item-no-flex"
>
<div
class="ant-skeleton ant-skeleton-with-avatar ant-skeleton-active"
>
<div
class="ant-skeleton-header"
>
<span
class="ant-skeleton-avatar ant-skeleton-avatar-lg ant-skeleton-avatar-circle"
/>
</div>
<div
class="ant-skeleton-content"
>
<h3
class="ant-skeleton-title"
style="width:50%"
/>
<ul
class="ant-skeleton-paragraph"
>
<li />
<li />
</ul>
</div>
</div>
</li>
<li
class="ant-list-item ant-list-item-no-flex"
>
<div
class="ant-skeleton ant-skeleton-with-avatar ant-skeleton-active"
>
<div
class="ant-skeleton-header"
>
<span
class="ant-skeleton-avatar ant-skeleton-avatar-lg ant-skeleton-avatar-circle"
/>
</div>
<div
class="ant-skeleton-content"
>
<h3
class="ant-skeleton-title"
style="width:50%"
/>
<ul
class="ant-skeleton-paragraph"
>
<li />
<li />
</ul>
</div>
</div>
</li>
<li
class="ant-list-item ant-list-item-no-flex"
>
<div
class="ant-skeleton ant-skeleton-with-avatar ant-skeleton-active"
>
<div
class="ant-skeleton-header"
>
<span
class="ant-skeleton-avatar ant-skeleton-avatar-lg ant-skeleton-avatar-circle"
/>
</div>
<div
class="ant-skeleton-content"
>
<h3
class="ant-skeleton-title"
style="width:50%"
/>
<ul
class="ant-skeleton-paragraph"
>
<li />
<li />
</ul>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>,
]
`;