feat(blocksAntd): PageSHCF and tests

This commit is contained in:
Gervwyk 2020-11-23 16:55:08 +02:00
parent 7828c66539
commit 4ef27ade03
5 changed files with 2222 additions and 14 deletions

View File

@ -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: []

View File

@ -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"

View 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 } });

File diff suppressed because it is too large Load Diff

View File

@ -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`;