Skip to content

Commit

Permalink
Snapshot tests for BlockSwitcher component
Browse files Browse the repository at this point in the history
Adds snapshot tests for the BlockSwitcher component. Covers a couple of
different test cases. This is not at 100% coverage yet, which will
definitely be tackled soon.
  • Loading branch information
BE-Webdesign committed Dec 3, 2017
1 parent 57c0a8b commit 7e191a4
Show file tree
Hide file tree
Showing 3 changed files with 162 additions and 4 deletions.
2 changes: 1 addition & 1 deletion editor/components/block-switcher/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ import { getBlock } from '../../selectors';
*/
const { DOWN } = keycodes;

function BlockSwitcher( { blocks, onTransform } ) {
export function BlockSwitcher( { blocks, onTransform } ) {
if ( ! blocks || ! blocks[ 0 ] ) {
return null;
}
Expand Down
57 changes: 57 additions & 0 deletions editor/components/block-switcher/test/__snapshots__/index.js.snap
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`BlockSwitcher Test block switcher with blocks 1`] = `
<div
className="editor-block-switcher"
>
<div
className="components-toolbar"
>
<button
aria-expanded={false}
aria-haspopup="true"
aria-label="Change block type"
className="components-button components-icon-button editor-block-switcher__toggle"
disabled={undefined}
onClick={[Function]}
onKeyDown={[Function]}
type="button"
>
<svg
aria-hidden={true}
className="dashicon dashicons-heading"
focusable="false"
height={20}
role="img"
viewBox="0 0 20 20"
width={20}
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12.5 4v5.2h-5V4H5v13h2.5v-5.2h5V17H15V4"
/>
</svg>
<svg
aria-hidden={true}
className="dashicon dashicons-arrow-down"
focusable="false"
height={20}
role="img"
viewBox="0 0 20 20"
width={20}
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M15 8l-4.03 6L7 8h8z"
/>
</svg>
</button>
</div>
</div>
`;

exports[`BlockSwitcher Test block switcher with multi block of different types. 1`] = `null`;

exports[`BlockSwitcher Test block switcher with multi block of same types. 1`] = `null`;

exports[`BlockSwitcher Test block switcher without blocks 1`] = `null`;
107 changes: 104 additions & 3 deletions editor/components/block-switcher/test/index.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,112 @@
/**
* External dependencies
*/
//import React from 'react';
import renderer from 'react-test-renderer';

/**
* Internal dependencies
*/
import { BlockSwitcher } from '../';

describe( 'BlockSwitcher', () => {
test( 'sample test', () => {
// Just a placeholder.
expect( true ).toBe( true );
test( 'Test block switcher without blocks', () => {
const tree = renderer
.create( <BlockSwitcher /> )
.toJSON();

expect( tree ).toMatchSnapshot();
} );
test( 'Test block switcher with blocks', () => {
const block = {
attributes: {
content: [ 'How are you?' ],
nodeName: 'H2',
},
isValid: true,
name: 'core/heading',
originalContent: '<h2>How are you?</h2>',
uid: 'a1303fd6-3e60-4fff-a770-0e0ea656c5b9',
};

const blocks = [
block,
];

const tree = renderer
.create( <BlockSwitcher blocks={ blocks } /> )
.toJSON();

expect( tree ).toMatchSnapshot();
} );

test( 'Test block switcher with multi block of different types.', () => {
const block1 = {
attributes: {
content: [ 'How are you?' ],
nodeName: 'H2',
},
isValid: true,
name: 'core/heading',
originalContent: '<h2>How are you?</h2>',
uid: 'a1303fd6-3e60-4fff-a770-0e0ea656c5b9',
};

const block2 = {
attributes: {
content: [ 'I am great!' ],
nodeName: 'P',
},
isValid: true,
name: 'core/text',
originalContent: '<p>I am great!</p>',
uid: 'b1303fd6-3e60-4fff-a770-0e0ea656c5b9',
};

const blocks = [
block1,
block2,
];

const tree = renderer
.create( <BlockSwitcher blocks={ blocks } /> )
.toJSON();

expect( tree ).toMatchSnapshot();
} );

test( 'Test block switcher with multi block of same types.', () => {
const block1 = {
attributes: {
content: [ 'How are you?' ],
nodeName: 'H2',
},
isValid: true,
name: 'core/heading',
originalContent: '<h2>How are you?</h2>',
uid: 'a1303fd6-3e60-4fff-a770-0e0ea656c5b9',
};

const block2 = {
attributes: {
content: [ 'I am great!' ],
nodeName: 'H3',
},
isValid: true,
name: 'core/heading',
originalContent: '<h3>I am great!</h3>',
uid: 'b1303fd6-3e60-4fff-a770-0e0ea656c5b9',
};

const blocks = [
block1,
block2,
];

const tree = renderer
.create( <BlockSwitcher blocks={ blocks } /> )
.toJSON();

expect( tree ).toMatchSnapshot();
} );
} );

0 comments on commit 7e191a4

Please sign in to comment.