mirror of
https://github.com/lowdefy/lowdefy.git
synced 2025-02-23 14:39:32 +08:00
feat(blocksAntd): PageSHCF and tests
This commit is contained in:
parent
7828c66539
commit
4ef27ade03
@ -1,14 +1,23 @@
|
||||
- id: default
|
||||
type: PageSHCF
|
||||
- id: properties.content
|
||||
- id: areas.content
|
||||
type: PageSHCF
|
||||
areas:
|
||||
content:
|
||||
blocks: []
|
||||
- id: areas.footer
|
||||
type: PageSHCF
|
||||
areas:
|
||||
footer:
|
||||
blocks: []
|
||||
- id: areas.header
|
||||
type: PageSHCF
|
||||
areas:
|
||||
header:
|
||||
blocks: []
|
||||
- id: areas.sider
|
||||
type: PageSHCF
|
||||
areas:
|
||||
sider:
|
||||
blocks: []
|
||||
- id: "properties.header.theme: light - dark is default"
|
||||
@ -54,3 +63,92 @@
|
||||
blocks: []
|
||||
sider:
|
||||
blocks: []
|
||||
- id: "properties.style: border: 5px solid blue"
|
||||
type: PageHCSF
|
||||
properties:
|
||||
style:
|
||||
border: 5px solid blue
|
||||
areas:
|
||||
content:
|
||||
blocks: []
|
||||
footer:
|
||||
blocks: []
|
||||
header:
|
||||
blocks: []
|
||||
sider:
|
||||
blocks: []
|
||||
- id: "properties.content.style: border: 5px solid blue"
|
||||
type: PageHCSF
|
||||
properties:
|
||||
content:
|
||||
style:
|
||||
border: 5px solid blue
|
||||
areas:
|
||||
content:
|
||||
blocks: []
|
||||
footer:
|
||||
blocks: []
|
||||
header:
|
||||
blocks: []
|
||||
sider:
|
||||
blocks: []
|
||||
- id: "properties.header.style: border: 5px solid blue"
|
||||
type: PageHCSF
|
||||
properties:
|
||||
header:
|
||||
style:
|
||||
border: 5px solid blue
|
||||
areas:
|
||||
content:
|
||||
blocks: []
|
||||
footer:
|
||||
blocks: []
|
||||
header:
|
||||
blocks: []
|
||||
sider:
|
||||
blocks: []
|
||||
- id: "properties.footer.style: border: 5px solid blue"
|
||||
type: PageHCSF
|
||||
properties:
|
||||
footer:
|
||||
style:
|
||||
border: 5px solid blue
|
||||
areas:
|
||||
content:
|
||||
blocks: []
|
||||
footer:
|
||||
blocks: []
|
||||
header:
|
||||
blocks: []
|
||||
sider:
|
||||
blocks: []
|
||||
- id: "properties.sider.style: border: 5px solid blue"
|
||||
type: PageHCSF
|
||||
properties:
|
||||
sider:
|
||||
style:
|
||||
border: 5px solid blue
|
||||
areas:
|
||||
content:
|
||||
blocks: []
|
||||
footer:
|
||||
blocks: []
|
||||
header:
|
||||
blocks: []
|
||||
sider:
|
||||
blocks: []
|
||||
- id: "properties.main.style: border: 5px solid blue"
|
||||
type: PageHCSF
|
||||
properties:
|
||||
main:
|
||||
style:
|
||||
border: 5px solid blue
|
||||
areas:
|
||||
content:
|
||||
blocks: []
|
||||
footer:
|
||||
blocks: []
|
||||
header:
|
||||
blocks: []
|
||||
sider:
|
||||
blocks: []
|
||||
|
@ -1,6 +1,20 @@
|
||||
{
|
||||
"category": "context",
|
||||
"loading": false,
|
||||
"test": {
|
||||
"methods": [
|
||||
{
|
||||
"name": "toggleSiderOpen",
|
||||
"args": {}
|
||||
},
|
||||
{
|
||||
"name": "setSiderOpen",
|
||||
"args": {
|
||||
"open": true
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
"schema": {
|
||||
"properties": {
|
||||
"type": "object",
|
||||
@ -26,13 +40,83 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"main": {
|
||||
"type": "object",
|
||||
"description": "Main layout properties.",
|
||||
"additionalProperties": false,
|
||||
"properties": {
|
||||
"style": {
|
||||
"type": "object",
|
||||
"description": "Main css style object."
|
||||
}
|
||||
}
|
||||
},
|
||||
"content": {
|
||||
"type": "object",
|
||||
"description": "Content properties."
|
||||
"description": "Content properties.",
|
||||
"additionalProperties": false,
|
||||
"properties": {
|
||||
"style": {
|
||||
"type": "object",
|
||||
"description": "Content css style object."
|
||||
}
|
||||
}
|
||||
},
|
||||
"Footer": {
|
||||
"sider": {
|
||||
"type": "object",
|
||||
"description": "Footer properties."
|
||||
"description": "Sider properties.",
|
||||
"additionalProperties": false,
|
||||
"properties": {
|
||||
"breakpoint": {
|
||||
"type": "string",
|
||||
"enum": ["xs", "sm", "md", "lg", "xl", "xxl"],
|
||||
"description": "Breakpoints of the responsive layout"
|
||||
},
|
||||
"collapsedWidth": {
|
||||
"type": "integer",
|
||||
"description": "Width of the collapsed sidebar, by setting to 0 a special trigger will appear"
|
||||
},
|
||||
"collapsible": {
|
||||
"type": "boolean",
|
||||
"description": "Whether can be collapsed"
|
||||
},
|
||||
"color": {
|
||||
"type": "string",
|
||||
"description": "Sider color"
|
||||
},
|
||||
"defaultCollapsed": {
|
||||
"type": "boolean",
|
||||
"description": "Set the initial collapsed state"
|
||||
},
|
||||
"reverseArrow": {
|
||||
"type": "boolean",
|
||||
"description": "Direction of arrow, for a sider that expands from the right"
|
||||
},
|
||||
"theme": {
|
||||
"type": "string",
|
||||
"enum": ["light", "dark"],
|
||||
"description": "Color theme of the sidebar"
|
||||
},
|
||||
"style": {
|
||||
"type": "object",
|
||||
"description": "Css style object to apply to sider."
|
||||
},
|
||||
"width": {
|
||||
"type": ["string", "number"],
|
||||
"description": "width of the sidebar"
|
||||
}
|
||||
}
|
||||
},
|
||||
"footer": {
|
||||
"type": "object",
|
||||
"description": "Footer properties.",
|
||||
"additionalProperties": false,
|
||||
"properties": {
|
||||
"style": {
|
||||
"type": "object",
|
||||
"description": "Footer css style object."
|
||||
}
|
||||
}
|
||||
},
|
||||
"style": {
|
||||
"type": "object",
|
||||
@ -44,8 +128,13 @@
|
||||
"type": "object",
|
||||
"additionalProperties": false,
|
||||
"properties": {
|
||||
"onCollapse": {
|
||||
"type": "array"
|
||||
"onSiderClose": {
|
||||
"type": "array",
|
||||
"description": "Triggers actions when sider is closed."
|
||||
},
|
||||
"onSiderOpen": {
|
||||
"type": "array",
|
||||
"description": "Triggers actions when sider is opened."
|
||||
},
|
||||
"onBreakpoint": {
|
||||
"type": "array"
|
||||
|
38
packages/blocksAntd/tests/PageSHCF.mock.test.js
Normal file
38
packages/blocksAntd/tests/PageSHCF.mock.test.js
Normal file
@ -0,0 +1,38 @@
|
||||
/*
|
||||
Copyright 2020 Lowdefy, Inc
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
|
||||
import { runMockRenderTests } from '@lowdefy/block-tools';
|
||||
import Enzyme, { mount } from 'enzyme';
|
||||
import Adapter from '@wojtekmaj/enzyme-adapter-react-17';
|
||||
import { Layout } from 'antd';
|
||||
|
||||
Enzyme.configure({ adapter: new Adapter() });
|
||||
import PageSHCF from '../src/blocks/PageSHCF/PageSHCF';
|
||||
import examples from '../demo/examples/PageSHCF.yaml';
|
||||
import meta from '../src/blocks/PageSHCF/PageSHCF.json';
|
||||
|
||||
jest.mock('antd/lib/layout', () => {
|
||||
return jest.fn(() => 'mocked');
|
||||
});
|
||||
|
||||
const mocks = [
|
||||
{
|
||||
name: 'default',
|
||||
fn: Layout,
|
||||
},
|
||||
];
|
||||
|
||||
runMockRenderTests({ examples, Block: PageSHCF, meta, mocks, enzyme: { mount } });
|
1029
packages/blocksAntd/tests/__snapshots__/PageSHCF.mock.test.js.snap
Normal file
1029
packages/blocksAntd/tests/__snapshots__/PageSHCF.mock.test.js.snap
Normal file
File diff suppressed because it is too large
Load Diff
@ -1,5 +1,174 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Render areas.content - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
id="areas.content"
|
||||
>
|
||||
<section
|
||||
className="ant-layout {}"
|
||||
id="areas.content_layout"
|
||||
>
|
||||
<main
|
||||
className="ant-layout-content {}"
|
||||
id="areas.content_content"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
content
|
||||
</div>
|
||||
</main>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Render areas.footer - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
id="areas.footer"
|
||||
>
|
||||
<section
|
||||
className="ant-layout {}"
|
||||
id="areas.footer_layout"
|
||||
>
|
||||
<main
|
||||
className="ant-layout-content {}"
|
||||
id="areas.footer_content"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
content
|
||||
</div>
|
||||
</main>
|
||||
<footer
|
||||
className="ant-layout-footer {\\"style\\":[{\\"margin\\":\\"auto\\"},null]} hide-on-print"
|
||||
id="areas.footer_footer"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
footer
|
||||
</div>
|
||||
</footer>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Render areas.header - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
id="areas.header"
|
||||
>
|
||||
<section
|
||||
className="ant-layout {}"
|
||||
id="areas.header_layout"
|
||||
>
|
||||
<header
|
||||
className="ant-layout-header {\\"style\\":[{\\"backgroundColor\\":false},null,null]} hide-on-print"
|
||||
id="areas.header_header"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
header
|
||||
</div>
|
||||
</header>
|
||||
<main
|
||||
className="ant-layout-content {}"
|
||||
id="areas.header_content"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
content
|
||||
</div>
|
||||
</main>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Render areas.sider - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout ant-layout-has-sider {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
id="areas.sider"
|
||||
>
|
||||
<aside
|
||||
className="{\\"style\\":[{\\"overflow\\":\\"auto\\"},null]} hide-on-print ant-layout-sider ant-layout-sider-dark ant-layout-sider-collapsed"
|
||||
id="areas.sider_sider"
|
||||
style={
|
||||
Object {
|
||||
"flex": "0 0 80px",
|
||||
"maxWidth": "80px",
|
||||
"minWidth": "80px",
|
||||
"width": "80px",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="ant-layout-sider-children"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
sider
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<section
|
||||
className="ant-layout {}"
|
||||
id="areas.sider_layout"
|
||||
>
|
||||
<main
|
||||
className="ant-layout-content {}"
|
||||
id="areas.sider_content"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
content
|
||||
</div>
|
||||
</main>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Render default - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
@ -28,18 +197,60 @@ exports[`Render default - value[0] 1`] = `
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Render properties.content - value[0] 1`] = `
|
||||
exports[`Render properties.content.style: border: 5px solid blue - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
id="properties.content"
|
||||
className="ant-layout ant-layout-has-sider {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
id="properties.content.style: border: 5px solid blue"
|
||||
>
|
||||
<aside
|
||||
className="{\\"style\\":[{\\"overflow\\":\\"auto\\"},null]} hide-on-print ant-layout-sider ant-layout-sider-dark ant-layout-sider-collapsed"
|
||||
id="properties.content.style: border: 5px solid blue_sider"
|
||||
style={
|
||||
Object {
|
||||
"flex": "0 0 80px",
|
||||
"maxWidth": "80px",
|
||||
"minWidth": "80px",
|
||||
"width": "80px",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="ant-layout-sider-children"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
sider
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<section
|
||||
className="ant-layout {}"
|
||||
id="properties.content_layout"
|
||||
id="properties.content.style: border: 5px solid blue_layout"
|
||||
>
|
||||
<header
|
||||
className="ant-layout-header {\\"style\\":[{\\"backgroundColor\\":false},null,null]} hide-on-print"
|
||||
id="properties.content.style: border: 5px solid blue_header"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
header
|
||||
</div>
|
||||
</header>
|
||||
<main
|
||||
className="ant-layout-content {}"
|
||||
id="properties.content_content"
|
||||
className="ant-layout-content {\\"style\\":{\\"border\\":\\"5px solid blue\\"}}"
|
||||
id="properties.content.style: border: 5px solid blue_content"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
@ -52,14 +263,757 @@ exports[`Render properties.content - value[0] 1`] = `
|
||||
content
|
||||
</div>
|
||||
</main>
|
||||
<footer
|
||||
className="ant-layout-footer {\\"style\\":[{\\"margin\\":\\"auto\\"},null]} hide-on-print"
|
||||
id="properties.content.style: border: 5px solid blue_footer"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
footer
|
||||
</div>
|
||||
</footer>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Render properties.footer.style: border: 5px solid blue - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout ant-layout-has-sider {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
id="properties.footer.style: border: 5px solid blue"
|
||||
>
|
||||
<aside
|
||||
className="{\\"style\\":[{\\"overflow\\":\\"auto\\"},null]} hide-on-print ant-layout-sider ant-layout-sider-dark ant-layout-sider-collapsed"
|
||||
id="properties.footer.style: border: 5px solid blue_sider"
|
||||
style={
|
||||
Object {
|
||||
"flex": "0 0 80px",
|
||||
"maxWidth": "80px",
|
||||
"minWidth": "80px",
|
||||
"width": "80px",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="ant-layout-sider-children"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
sider
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<section
|
||||
className="ant-layout {}"
|
||||
id="properties.footer.style: border: 5px solid blue_layout"
|
||||
>
|
||||
<header
|
||||
className="ant-layout-header {\\"style\\":[{\\"backgroundColor\\":false},null,null]} hide-on-print"
|
||||
id="properties.footer.style: border: 5px solid blue_header"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
header
|
||||
</div>
|
||||
</header>
|
||||
<main
|
||||
className="ant-layout-content {}"
|
||||
id="properties.footer.style: border: 5px solid blue_content"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
content
|
||||
</div>
|
||||
</main>
|
||||
<footer
|
||||
className="ant-layout-footer {\\"style\\":[{\\"margin\\":\\"auto\\"},{\\"border\\":\\"5px solid blue\\"}]} hide-on-print"
|
||||
id="properties.footer.style: border: 5px solid blue_footer"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
footer
|
||||
</div>
|
||||
</footer>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Render properties.header.color: #4432a8 - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout ant-layout-has-sider {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
id="properties.header.color: #4432a8 "
|
||||
>
|
||||
<aside
|
||||
className="{\\"style\\":[{\\"overflow\\":\\"auto\\"},null]} hide-on-print ant-layout-sider ant-layout-sider-dark ant-layout-sider-collapsed"
|
||||
id="properties.header.color: #4432a8 _sider"
|
||||
style={
|
||||
Object {
|
||||
"flex": "0 0 80px",
|
||||
"maxWidth": "80px",
|
||||
"minWidth": "80px",
|
||||
"width": "80px",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="ant-layout-sider-children"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
sider
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<section
|
||||
className="ant-layout {}"
|
||||
id="properties.header.color: #4432a8 _layout"
|
||||
>
|
||||
<header
|
||||
className="ant-layout-header {\\"style\\":[{\\"backgroundColor\\":false},{\\"backgroundColor\\":\\"#4432a8\\"},null]} hide-on-print"
|
||||
id="properties.header.color: #4432a8 _header"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
header
|
||||
</div>
|
||||
</header>
|
||||
<main
|
||||
className="ant-layout-content {}"
|
||||
id="properties.header.color: #4432a8 _content"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
content
|
||||
</div>
|
||||
</main>
|
||||
<footer
|
||||
className="ant-layout-footer {\\"style\\":[{\\"margin\\":\\"auto\\"},null]} hide-on-print"
|
||||
id="properties.header.color: #4432a8 _footer"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
footer
|
||||
</div>
|
||||
</footer>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Render properties.header.style: border: 5px solid blue - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout ant-layout-has-sider {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
id="properties.header.style: border: 5px solid blue"
|
||||
>
|
||||
<aside
|
||||
className="{\\"style\\":[{\\"overflow\\":\\"auto\\"},null]} hide-on-print ant-layout-sider ant-layout-sider-dark ant-layout-sider-collapsed"
|
||||
id="properties.header.style: border: 5px solid blue_sider"
|
||||
style={
|
||||
Object {
|
||||
"flex": "0 0 80px",
|
||||
"maxWidth": "80px",
|
||||
"minWidth": "80px",
|
||||
"width": "80px",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="ant-layout-sider-children"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
sider
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<section
|
||||
className="ant-layout {}"
|
||||
id="properties.header.style: border: 5px solid blue_layout"
|
||||
>
|
||||
<header
|
||||
className="ant-layout-header {\\"style\\":[{\\"backgroundColor\\":false},null,{\\"border\\":\\"5px solid blue\\"}]} hide-on-print"
|
||||
id="properties.header.style: border: 5px solid blue_header"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
header
|
||||
</div>
|
||||
</header>
|
||||
<main
|
||||
className="ant-layout-content {}"
|
||||
id="properties.header.style: border: 5px solid blue_content"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
content
|
||||
</div>
|
||||
</main>
|
||||
<footer
|
||||
className="ant-layout-footer {\\"style\\":[{\\"margin\\":\\"auto\\"},null]} hide-on-print"
|
||||
id="properties.header.style: border: 5px solid blue_footer"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
footer
|
||||
</div>
|
||||
</footer>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Render properties.header.theme: light - dark is default - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout ant-layout-has-sider {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
id="properties.header.theme: light - dark is default"
|
||||
>
|
||||
<aside
|
||||
className="{\\"style\\":[{\\"overflow\\":\\"auto\\"},null]} hide-on-print ant-layout-sider ant-layout-sider-dark ant-layout-sider-collapsed"
|
||||
id="properties.header.theme: light - dark is default_sider"
|
||||
style={
|
||||
Object {
|
||||
"flex": "0 0 80px",
|
||||
"maxWidth": "80px",
|
||||
"minWidth": "80px",
|
||||
"width": "80px",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="ant-layout-sider-children"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
sider
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<section
|
||||
className="ant-layout {}"
|
||||
id="properties.header.theme: light - dark is default_layout"
|
||||
>
|
||||
<header
|
||||
className="ant-layout-header {\\"style\\":[{\\"backgroundColor\\":\\"#fff\\"},null,null]} hide-on-print"
|
||||
id="properties.header.theme: light - dark is default_header"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
header
|
||||
</div>
|
||||
</header>
|
||||
<main
|
||||
className="ant-layout-content {}"
|
||||
id="properties.header.theme: light - dark is default_content"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
content
|
||||
</div>
|
||||
</main>
|
||||
<footer
|
||||
className="ant-layout-footer {\\"style\\":[{\\"margin\\":\\"auto\\"},null]} hide-on-print"
|
||||
id="properties.header.theme: light - dark is default_footer"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
footer
|
||||
</div>
|
||||
</footer>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Render properties.main.style: border: 5px solid blue - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout ant-layout-has-sider {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
id="properties.main.style: border: 5px solid blue"
|
||||
>
|
||||
<aside
|
||||
className="{\\"style\\":[{\\"overflow\\":\\"auto\\"},null]} hide-on-print ant-layout-sider ant-layout-sider-dark ant-layout-sider-collapsed"
|
||||
id="properties.main.style: border: 5px solid blue_sider"
|
||||
style={
|
||||
Object {
|
||||
"flex": "0 0 80px",
|
||||
"maxWidth": "80px",
|
||||
"minWidth": "80px",
|
||||
"width": "80px",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="ant-layout-sider-children"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
sider
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<section
|
||||
className="ant-layout {\\"style\\":{\\"border\\":\\"5px solid blue\\"}}"
|
||||
id="properties.main.style: border: 5px solid blue_layout"
|
||||
>
|
||||
<header
|
||||
className="ant-layout-header {\\"style\\":[{\\"backgroundColor\\":false},null,null]} hide-on-print"
|
||||
id="properties.main.style: border: 5px solid blue_header"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
header
|
||||
</div>
|
||||
</header>
|
||||
<main
|
||||
className="ant-layout-content {}"
|
||||
id="properties.main.style: border: 5px solid blue_content"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
content
|
||||
</div>
|
||||
</main>
|
||||
<footer
|
||||
className="ant-layout-footer {\\"style\\":[{\\"margin\\":\\"auto\\"},null]} hide-on-print"
|
||||
id="properties.main.style: border: 5px solid blue_footer"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
footer
|
||||
</div>
|
||||
</footer>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Render properties.sider.style: border: 5px solid blue - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout ant-layout-has-sider {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
id="properties.sider.style: border: 5px solid blue"
|
||||
>
|
||||
<aside
|
||||
className="{\\"style\\":[{\\"overflow\\":\\"auto\\"},{\\"border\\":\\"5px solid blue\\"}]} hide-on-print ant-layout-sider ant-layout-sider-dark ant-layout-sider-collapsed"
|
||||
id="properties.sider.style: border: 5px solid blue_sider"
|
||||
style={
|
||||
Object {
|
||||
"flex": "0 0 80px",
|
||||
"maxWidth": "80px",
|
||||
"minWidth": "80px",
|
||||
"width": "80px",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="ant-layout-sider-children"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
sider
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<section
|
||||
className="ant-layout {}"
|
||||
id="properties.sider.style: border: 5px solid blue_layout"
|
||||
>
|
||||
<header
|
||||
className="ant-layout-header {\\"style\\":[{\\"backgroundColor\\":false},null,null]} hide-on-print"
|
||||
id="properties.sider.style: border: 5px solid blue_header"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
header
|
||||
</div>
|
||||
</header>
|
||||
<main
|
||||
className="ant-layout-content {}"
|
||||
id="properties.sider.style: border: 5px solid blue_content"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
content
|
||||
</div>
|
||||
</main>
|
||||
<footer
|
||||
className="ant-layout-footer {\\"style\\":[{\\"margin\\":\\"auto\\"},null]} hide-on-print"
|
||||
id="properties.sider.style: border: 5px solid blue_footer"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
footer
|
||||
</div>
|
||||
</footer>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Render properties.sider.theme: light - dark is default - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout ant-layout-has-sider {\\"style\\":{\\"minHeight\\":\\"100vh\\"}}"
|
||||
id="properties.sider.theme: light - dark is default"
|
||||
>
|
||||
<aside
|
||||
className="{\\"style\\":[{\\"overflow\\":\\"auto\\"},null]} hide-on-print ant-layout-sider ant-layout-sider-light ant-layout-sider-collapsed"
|
||||
id="properties.sider.theme: light - dark is default_sider"
|
||||
style={
|
||||
Object {
|
||||
"flex": "0 0 80px",
|
||||
"maxWidth": "80px",
|
||||
"minWidth": "80px",
|
||||
"width": "80px",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="ant-layout-sider-children"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
sider
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<section
|
||||
className="ant-layout {}"
|
||||
id="properties.sider.theme: light - dark is default_layout"
|
||||
>
|
||||
<header
|
||||
className="ant-layout-header {\\"style\\":[{\\"backgroundColor\\":false},null,null]} hide-on-print"
|
||||
id="properties.sider.theme: light - dark is default_header"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
header
|
||||
</div>
|
||||
</header>
|
||||
<main
|
||||
className="ant-layout-content {}"
|
||||
id="properties.sider.theme: light - dark is default_content"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
content
|
||||
</div>
|
||||
</main>
|
||||
<footer
|
||||
className="ant-layout-footer {\\"style\\":[{\\"margin\\":\\"auto\\"},null]} hide-on-print"
|
||||
id="properties.sider.theme: light - dark is default_footer"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
footer
|
||||
</div>
|
||||
</footer>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Render properties.style: border: 5px solid blue - value[0] 1`] = `
|
||||
<section
|
||||
className="ant-layout ant-layout-has-sider {\\"style\\":{\\"minHeight\\":\\"100vh\\",\\"border\\":\\"5px solid blue\\"}}"
|
||||
id="properties.style: border: 5px solid blue"
|
||||
>
|
||||
<aside
|
||||
className="{\\"style\\":[{\\"overflow\\":\\"auto\\"},null]} hide-on-print ant-layout-sider ant-layout-sider-dark ant-layout-sider-collapsed"
|
||||
id="properties.style: border: 5px solid blue_sider"
|
||||
style={
|
||||
Object {
|
||||
"flex": "0 0 80px",
|
||||
"maxWidth": "80px",
|
||||
"minWidth": "80px",
|
||||
"width": "80px",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="ant-layout-sider-children"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
sider
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<section
|
||||
className="ant-layout {}"
|
||||
id="properties.style: border: 5px solid blue_layout"
|
||||
>
|
||||
<header
|
||||
className="ant-layout-header {\\"style\\":[{\\"backgroundColor\\":false},null,null]} hide-on-print"
|
||||
id="properties.style: border: 5px solid blue_header"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
header
|
||||
</div>
|
||||
</header>
|
||||
<main
|
||||
className="ant-layout-content {}"
|
||||
id="properties.style: border: 5px solid blue_content"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
content
|
||||
</div>
|
||||
</main>
|
||||
<footer
|
||||
className="ant-layout-footer {\\"style\\":[{\\"margin\\":\\"auto\\"},null]} hide-on-print"
|
||||
id="properties.style: border: 5px solid blue_footer"
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"border": "1px solid red",
|
||||
"padding": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
footer
|
||||
</div>
|
||||
</footer>
|
||||
</section>
|
||||
</section>
|
||||
`;
|
||||
|
||||
exports[`Test Schema areas.content 1`] = `true`;
|
||||
|
||||
exports[`Test Schema areas.content 2`] = `null`;
|
||||
|
||||
exports[`Test Schema areas.footer 1`] = `true`;
|
||||
|
||||
exports[`Test Schema areas.footer 2`] = `null`;
|
||||
|
||||
exports[`Test Schema areas.header 1`] = `true`;
|
||||
|
||||
exports[`Test Schema areas.header 2`] = `null`;
|
||||
|
||||
exports[`Test Schema areas.sider 1`] = `true`;
|
||||
|
||||
exports[`Test Schema areas.sider 2`] = `null`;
|
||||
|
||||
exports[`Test Schema default 1`] = `true`;
|
||||
|
||||
exports[`Test Schema default 2`] = `null`;
|
||||
|
||||
exports[`Test Schema properties.content 1`] = `true`;
|
||||
exports[`Test Schema properties.content.style: border: 5px solid blue 1`] = `true`;
|
||||
|
||||
exports[`Test Schema properties.content 2`] = `null`;
|
||||
exports[`Test Schema properties.content.style: border: 5px solid blue 2`] = `null`;
|
||||
|
||||
exports[`Test Schema properties.footer.style: border: 5px solid blue 1`] = `true`;
|
||||
|
||||
exports[`Test Schema properties.footer.style: border: 5px solid blue 2`] = `null`;
|
||||
|
||||
exports[`Test Schema properties.header.color: #4432a8 1`] = `true`;
|
||||
|
||||
exports[`Test Schema properties.header.color: #4432a8 2`] = `null`;
|
||||
|
||||
exports[`Test Schema properties.header.style: border: 5px solid blue 1`] = `true`;
|
||||
|
||||
exports[`Test Schema properties.header.style: border: 5px solid blue 2`] = `null`;
|
||||
|
||||
exports[`Test Schema properties.header.theme: light - dark is default 1`] = `true`;
|
||||
|
||||
exports[`Test Schema properties.header.theme: light - dark is default 2`] = `null`;
|
||||
|
||||
exports[`Test Schema properties.main.style: border: 5px solid blue 1`] = `true`;
|
||||
|
||||
exports[`Test Schema properties.main.style: border: 5px solid blue 2`] = `null`;
|
||||
|
||||
exports[`Test Schema properties.sider.style: border: 5px solid blue 1`] = `true`;
|
||||
|
||||
exports[`Test Schema properties.sider.style: border: 5px solid blue 2`] = `null`;
|
||||
|
||||
exports[`Test Schema properties.sider.theme: light - dark is default 1`] = `true`;
|
||||
|
||||
exports[`Test Schema properties.sider.theme: light - dark is default 2`] = `null`;
|
||||
|
||||
exports[`Test Schema properties.style: border: 5px solid blue 1`] = `true`;
|
||||
|
||||
exports[`Test Schema properties.style: border: 5px solid blue 2`] = `null`;
|
||||
|
Loading…
Reference in New Issue
Block a user