Skip to content

Commit

Permalink
Add tests and improve fixture data
Browse files Browse the repository at this point in the history
  • Loading branch information
getdave committed Aug 30, 2019
1 parent f0cda57 commit 7d84106
Show file tree
Hide file tree
Showing 9 changed files with 301 additions and 244 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ const BlockTemplatePreview = ( { blocks = [], viewportWidth } ) => {
<div className="edit-post-visual-editor">
<div className="editor-styles-wrapper">
<div className="editor-writing-flow">
{ blocks && <BlockPreview blocks={ blocks } viewportWidth={ viewportWidth } /> }
<BlockPreview blocks={ blocks } viewportWidth={ viewportWidth } />
</div>
</div>
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
* External dependencies
*/
import classnames from 'classnames';
import { isEmpty } from 'lodash';
import { isEmpty, isArray } from 'lodash';

/**
* WordPress dependencies
Expand All @@ -17,7 +17,7 @@ import BlockPreview from './block-template-preview';
const TemplateSelectorPreview = ( { blocks, viewportWidth } ) => {
const previewElClasses = classnames( 'template-selector-preview', 'editor-styles-wrapper' );

if ( isEmpty( blocks ) ) {
if ( isEmpty( blocks ) || ! isArray( blocks ) ) {
return (
<div className={ previewElClasses }>
<div className="template-selector-preview__placeholder">
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,232 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`BlockTemplatePreview Basic rendering renders preview when blocks are provided 1`] = `
<div
className="edit-post-visual-editor"
>
<div
className="editor-styles-wrapper"
>
<div
className="editor-writing-flow"
>
<Component
blocks={
Array [
Array [
Object {
"attributes": Object {
"align": "left",
"coblocks": Array [],
"content": "Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.",
"dropCap": false,
"fontWeight": "",
"noBottomSpacing": false,
"noTopSpacing": false,
"textTransform": "",
},
"clientId": "1",
"innerBlocks": Array [],
"isValid": true,
"name": "core/paragraph",
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
Object {
"attributes": Object {
"align": "left",
"coblocks": Array [],
"content": "Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.",
"dropCap": false,
"fontWeight": "",
"noBottomSpacing": false,
"noTopSpacing": false,
"textTransform": "",
},
"clientId": "2",
"innerBlocks": Array [],
"isValid": true,
"name": "core/paragraph",
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
Object {
"attributes": Object {
"align": "left",
"coblocks": Array [],
"content": "Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.",
"dropCap": false,
"fontWeight": "",
"noBottomSpacing": false,
"noTopSpacing": false,
"textTransform": "",
},
"clientId": "3",
"innerBlocks": Array [],
"isValid": true,
"name": "core/paragraph",
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
Object {
"attributes": Object {
"align": "left",
"coblocks": Array [],
"content": "Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.",
"dropCap": false,
"fontWeight": "",
"noBottomSpacing": false,
"noTopSpacing": false,
"textTransform": "",
},
"clientId": "4",
"innerBlocks": Array [],
"isValid": true,
"name": "core/paragraph",
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
],
Array [
Object {
"attributes": Object {
"align": "left",
"coblocks": Array [],
"content": "Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.",
"dropCap": false,
"fontWeight": "",
"noBottomSpacing": false,
"noTopSpacing": false,
"textTransform": "",
},
"clientId": "5",
"innerBlocks": Array [],
"isValid": true,
"name": "core/paragraph",
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
Object {
"attributes": Object {
"align": "left",
"coblocks": Array [],
"content": "Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.",
"dropCap": false,
"fontWeight": "",
"noBottomSpacing": false,
"noTopSpacing": false,
"textTransform": "",
},
"clientId": "6",
"innerBlocks": Array [],
"isValid": true,
"name": "core/paragraph",
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
Object {
"attributes": Object {
"align": "left",
"coblocks": Array [],
"content": "Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.",
"dropCap": false,
"fontWeight": "",
"noBottomSpacing": false,
"noTopSpacing": false,
"textTransform": "",
},
"clientId": "7",
"innerBlocks": Array [],
"isValid": true,
"name": "core/paragraph",
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
Object {
"attributes": Object {
"align": "left",
"coblocks": Array [],
"content": "Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.",
"dropCap": false,
"fontWeight": "",
"noBottomSpacing": false,
"noTopSpacing": false,
"textTransform": "",
},
"clientId": "8",
"innerBlocks": Array [],
"isValid": true,
"name": "core/paragraph",
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
],
Array [
Object {
"attributes": Object {
"align": "left",
"coblocks": Array [],
"content": "Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.",
"dropCap": false,
"fontWeight": "",
"noBottomSpacing": false,
"noTopSpacing": false,
"textTransform": "",
},
"clientId": "9",
"innerBlocks": Array [],
"isValid": true,
"name": "core/paragraph",
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
Object {
"attributes": Object {
"align": "left",
"coblocks": Array [],
"content": "Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.",
"dropCap": false,
"fontWeight": "",
"noBottomSpacing": false,
"noTopSpacing": false,
"textTransform": "",
},
"clientId": "10",
"innerBlocks": Array [],
"isValid": true,
"name": "core/paragraph",
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
Object {
"attributes": Object {
"align": "left",
"coblocks": Array [],
"content": "Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.",
"dropCap": false,
"fontWeight": "",
"noBottomSpacing": false,
"noTopSpacing": false,
"textTransform": "",
},
"clientId": "11",
"innerBlocks": Array [],
"isValid": true,
"name": "core/paragraph",
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
Object {
"attributes": Object {
"align": "left",
"coblocks": Array [],
"content": "Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.",
"dropCap": false,
"fontWeight": "",
"noBottomSpacing": false,
"noTopSpacing": false,
"textTransform": "",
},
"clientId": "12",
"innerBlocks": Array [],
"isValid": true,
"name": "core/paragraph",
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
],
]
}
/>
</div>
</div>
</div>
`;
Original file line number Diff line number Diff line change
Expand Up @@ -41,8 +41,8 @@ exports[`TemplateSelectorItem Dynamic previews renders in dynamic preview mode 1
<Disabled>
<BlockTemplatePreview
blocks={
Object {
"template-1": Array [
Array [
Array [
Object {
"attributes": Object {
"align": "left",
Expand Down Expand Up @@ -112,7 +112,7 @@ exports[`TemplateSelectorItem Dynamic previews renders in dynamic preview mode 1
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
],
"template-2": Array [
Array [
Object {
"attributes": Object {
"align": "left",
Expand Down Expand Up @@ -182,7 +182,7 @@ exports[`TemplateSelectorItem Dynamic previews renders in dynamic preview mode 1
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
],
"template-3": Array [
Array [
Object {
"attributes": Object {
"align": "left",
Expand Down Expand Up @@ -252,7 +252,7 @@ exports[`TemplateSelectorItem Dynamic previews renders in dynamic preview mode 1
"originalContent": "<p style=\\"text-align:left;\\">Visitors will want to know who is on the other side of the page. Use this space to write about yourself, your site, your business, or anything you want. Use the testimonials below to quote others, talking about the same thing – in their own words.</p>",
},
],
}
]
}
viewportWidth={960}
/>
Expand Down
Loading

0 comments on commit 7d84106

Please sign in to comment.