diff --git a/packages/rich-text/src/store/selectors.js b/packages/rich-text/src/store/selectors.js index 518bb7d90800a..c5f970c6a956e 100644 --- a/packages/rich-text/src/store/selectors.js +++ b/packages/rich-text/src/store/selectors.js @@ -40,8 +40,8 @@ export function getFormatType( state, name ) { * @return {?Object} Format type. */ export function getFormatTypeForBareElement( state, bareElementTagName ) { - return find( getFormatTypes( state ), ( { tagName } ) => { - return bareElementTagName === tagName; + return find( getFormatTypes( state ), ( { className, tagName } ) => { + return className === null && bareElementTagName === tagName; } ); } diff --git a/packages/rich-text/src/store/test/selectors.js b/packages/rich-text/src/store/test/selectors.js index ca49185a6e6b1..745f077c5f3f7 100644 --- a/packages/rich-text/src/store/test/selectors.js +++ b/packages/rich-text/src/store/test/selectors.js @@ -6,33 +6,71 @@ import deepFreeze from 'deep-freeze'; /** * Internal dependencies */ -import { getFormatTypes, getFormatType } from '../selectors'; +import { + getFormatTypes, + getFormatType, + getFormatTypeForBareElement, + getFormatTypeForClassName, +} from '../selectors'; describe( 'selectors', () => { + const formatType = { + name: 'core/test-format', + className: null, + tagName: 'format', + }; + const formatTypeClassName = { + name: 'core/test-format-class-name', + className: 'class-name', + tagName: 'strong', + }; + const formatTypeBareTag = { + name: 'core/test-format-bare-tag', + className: null, + tagName: 'strong', + }; const defaultState = deepFreeze( { formatTypes: { - 'core/test-format': { name: 'core/test-format' }, - 'core/test-format-2': { name: 'core/test-format-2' }, + 'core/test-format': formatType, + 'core/test-format-class-name': formatTypeClassName, + // Order matters: we need to ensure that + // `core/test-format-class-name` is not considered bare. + 'core/test-format-bare-tag': formatTypeBareTag, }, } ); describe( 'getFormatTypes', () => { it( 'should get format types', () => { const expected = [ - { name: 'core/test-format' }, - { name: 'core/test-format-2' }, + formatType, + formatTypeClassName, + formatTypeBareTag, ]; - expect( getFormatTypes( defaultState ) ).toEqual( expected ); } ); } ); describe( 'getFormatType', () => { it( 'should get a format type', () => { - const expected = { name: 'core/test-format' }; const result = getFormatType( defaultState, 'core/test-format' ); - expect( result ).toEqual( expected ); + expect( result ).toEqual( formatType ); + } ); + } ); + + describe( 'getFormatTypeForBareElement', () => { + it( 'should get a format type', () => { + const result = getFormatTypeForBareElement( defaultState, 'strong' ); + + expect( result ).toEqual( formatTypeBareTag ); + } ); + } ); + + describe( 'getFormatTypeForClassName', () => { + it( 'should get a format type', () => { + const result = getFormatTypeForClassName( defaultState, 'class-name' ); + + expect( result ).toEqual( formatTypeClassName ); } ); } ); } );