110 lines
2.8 KiB
JavaScript
110 lines
2.8 KiB
JavaScript
/**
|
|
* External dependencies
|
|
*/
|
|
import TestRenderer from 'react-test-renderer';
|
|
|
|
/**
|
|
* Internal dependencies
|
|
*/
|
|
import { Chip, RemovableChip } from '..';
|
|
|
|
describe( 'Chip', () => {
|
|
test( 'should render text', () => {
|
|
const component = TestRenderer.create( <Chip text="Test" /> );
|
|
|
|
expect( component.toJSON() ).toMatchSnapshot();
|
|
} );
|
|
|
|
test( 'should render nodes as the text', () => {
|
|
const component = TestRenderer.create(
|
|
<Chip text={ <h1>Test</h1> } />
|
|
);
|
|
|
|
expect( component.toJSON() ).toMatchSnapshot();
|
|
} );
|
|
|
|
test( 'should render defined radius', () => {
|
|
const component = TestRenderer.create(
|
|
<Chip text="Test" radius="large" />
|
|
);
|
|
|
|
expect( component.toJSON() ).toMatchSnapshot();
|
|
} );
|
|
|
|
test( 'should render screen reader text', () => {
|
|
const component = TestRenderer.create(
|
|
<Chip text="Test" screenReaderText="Test 2" />
|
|
);
|
|
|
|
expect( component.toJSON() ).toMatchSnapshot();
|
|
} );
|
|
|
|
test( 'should render children nodes', () => {
|
|
const component = TestRenderer.create(
|
|
<Chip text="Test">Lorem Ipsum</Chip>
|
|
);
|
|
|
|
expect( component.toJSON() ).toMatchSnapshot();
|
|
} );
|
|
|
|
describe( 'with custom wrapper', () => {
|
|
test( 'should render a chip made up of a div instead of a li', () => {
|
|
const component = TestRenderer.create(
|
|
<Chip text="Test" element="div" />
|
|
);
|
|
|
|
expect( component.toJSON() ).toMatchSnapshot();
|
|
} );
|
|
} );
|
|
} );
|
|
|
|
describe( 'RemovableChip', () => {
|
|
test( 'should render text and the remove button', () => {
|
|
const component = TestRenderer.create( <RemovableChip text="Test" /> );
|
|
|
|
expect( component.toJSON() ).toMatchSnapshot();
|
|
} );
|
|
|
|
test( 'should render with disabled remove button', () => {
|
|
const component = TestRenderer.create(
|
|
<RemovableChip text="Test" disabled={ true } />
|
|
);
|
|
|
|
expect( component.toJSON() ).toMatchSnapshot();
|
|
} );
|
|
|
|
test( 'should render custom aria label', () => {
|
|
const component = TestRenderer.create(
|
|
<RemovableChip text={ <h1>Test</h1> } ariaLabel="Aria test" />
|
|
);
|
|
|
|
expect( component.toJSON() ).toMatchSnapshot();
|
|
} );
|
|
|
|
test( 'should render default aria label if text is a node', () => {
|
|
const component = TestRenderer.create(
|
|
<RemovableChip text={ <h1>Test</h1> } screenReaderText="Test 2" />
|
|
);
|
|
|
|
expect( component.toJSON() ).toMatchSnapshot();
|
|
} );
|
|
|
|
test( 'should render screen reader text aria label', () => {
|
|
const component = TestRenderer.create(
|
|
<RemovableChip text="Test" screenReaderText="Test 2" />
|
|
);
|
|
|
|
expect( component.toJSON() ).toMatchSnapshot();
|
|
} );
|
|
|
|
describe( 'with removeOnAnyClick', () => {
|
|
test( 'should be a button when removeOnAnyClick is set to true', () => {
|
|
const component = TestRenderer.create(
|
|
<RemovableChip text="Test" removeOnAnyClick={ true } />
|
|
);
|
|
|
|
expect( component.toJSON() ).toMatchSnapshot();
|
|
} );
|
|
} );
|
|
} );
|