Skip to content
This repository has been archived by the owner on Jun 26, 2020. It is now read-only.

Commit

Permalink
Merge pull request #44 from ckeditor/t/35
Browse files Browse the repository at this point in the history 
Other: Updated view attribute elements priorities to ensure proper order in which attribute elements are applied. Closes #35.
  • Loading branch information
@Reinmar
Reinmar authored Jun 26, 2019
2 parents 02aa855 + 056d67f commit 54467b4
Show file tree
Hide file tree
Showing 8 changed files with 196 additions and 69 deletions.
2 changes: 1 addition & 1 deletion src/fontfamily/utils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ function generateFontPreset( fontDefinition ) {
styles: {
'font-family': cssFontNames
},
priority: 5
priority: 7
}
};
}
Expand Down
10 changes: 5 additions & 5 deletions src/fontsize/utils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ const namedPresets = {
view: {
name: 'span',
classes: 'text-tiny',
priority: 5
priority: 7
}
},
small: {
Expand All @@ -39,7 +39,7 @@ const namedPresets = {
view: {
name: 'span',
classes: 'text-small',
priority: 5
priority: 7
}
},
big: {
Expand All @@ -48,7 +48,7 @@ const namedPresets = {
view: {
name: 'span',
classes: 'text-big',
priority: 5
priority: 7
}
},
huge: {
Expand All @@ -57,7 +57,7 @@ const namedPresets = {
view: {
name: 'span',
classes: 'text-huge',
priority: 5
priority: 7
}
}
};
Expand Down Expand Up @@ -113,7 +113,7 @@ function generatePixelPreset( size ) {
styles: {
'font-size': `${ size }px`
},
priority: 5
priority: 7
}
};
}
8 changes: 3 additions & 5 deletions src/utils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,7 @@ export function renderUpcastAttribute( styleAttr ) {
export function renderDowncastElement( styleAttr ) {
return ( modelAttributeValue, viewWriter ) => viewWriter.createAttributeElement( 'span', {
style: `${ styleAttr }:${ modelAttributeValue }`
} );
}, { priority: 7 } );
}

/**
Expand Down Expand Up @@ -190,8 +190,7 @@ function normalizeSingleColorDefinition( color ) {
name: 'span',
styles: {
color
},
priority: 5
}
}
};
} else {
Expand All @@ -203,8 +202,7 @@ function normalizeSingleColorDefinition( color ) {
name: 'span',
styles: {
color: `${ color.color }`
},
priority: 5
}
}
};
}
Expand Down
6 changes: 3 additions & 3 deletions tests/fontfamily/utils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ describe( 'FontFamily utils', () => {
styles: {
'font-family': 'Arial'
},
priority: 5
priority: 7
}
},
{
Expand All @@ -68,7 +68,7 @@ describe( 'FontFamily utils', () => {
styles: {
'font-family': '\'Comic Sans MS\', sans-serif'
},
priority: 5
priority: 7
}
},
{
Expand All @@ -79,7 +79,7 @@ describe( 'FontFamily utils', () => {
styles: {
'font-family': '\'Lucida Console\', \'Courier New\', Courier, monospace'
},
priority: 5
priority: 7
}
}
] );
Expand Down
8 changes: 4 additions & 4 deletions tests/fontsize/fontsizeui.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -203,11 +203,11 @@ describe( 'FontSizeUI', () => {
it( 'does not alter normalizeOptions() internals', () => {
const options = normalizeOptions( [ 'tiny', 'small', 'default', 'big', 'huge' ] );
expect( options ).to.deep.equal( [
{ title: 'Tiny', model: 'tiny', view: { name: 'span', classes: 'text-tiny', priority: 5 } },
{ title: 'Small', model: 'small', view: { name: 'span', classes: 'text-small', priority: 5 } },
{ title: 'Tiny', model: 'tiny', view: { name: 'span', classes: 'text-tiny', priority: 7 } },
{ title: 'Small', model: 'small', view: { name: 'span', classes: 'text-small', priority: 7 } },
{ title: 'Default', model: undefined },
{ title: 'Big', model: 'big', view: { name: 'span', classes: 'text-big', priority: 5 } },
{ title: 'Huge', model: 'huge', view: { name: 'span', classes: 'text-huge', priority: 5 } }
{ title: 'Big', model: 'big', view: { name: 'span', classes: 'text-big', priority: 7 } },
{ title: 'Huge', model: 'huge', view: { name: 'span', classes: 'text-huge', priority: 7 } }
] );
} );

Expand Down
16 changes: 8 additions & 8 deletions tests/fontsize/utils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,23 +28,23 @@ describe( 'FontSizeEditing Utils', () => {
describe( 'named presets', () => {
it( 'should return defined presets', () => {
expect( normalizeOptions( [ 'tiny', 'small', 'default', 'big', 'huge' ] ) ).to.deep.equal( [
{ title: 'Tiny', model: 'tiny', view: { name: 'span', classes: 'text-tiny', priority: 5 } },
{ title: 'Small', model: 'small', view: { name: 'span', classes: 'text-small', priority: 5 } },
{ title: 'Tiny', model: 'tiny', view: { name: 'span', classes: 'text-tiny', priority: 7 } },
{ title: 'Small', model: 'small', view: { name: 'span', classes: 'text-small', priority: 7 } },
{ title: 'Default', model: undefined },
{ title: 'Big', model: 'big', view: { name: 'span', classes: 'text-big', priority: 5 } },
{ title: 'Huge', model: 'huge', view: { name: 'span', classes: 'text-huge', priority: 5 } }
{ title: 'Big', model: 'big', view: { name: 'span', classes: 'text-big', priority: 7 } },
{ title: 'Huge', model: 'huge', view: { name: 'span', classes: 'text-huge', priority: 7 } }
] );
} );
} );

describe( 'numerical presets', () => {
it( 'should return generated presets', () => {
expect( normalizeOptions( [ '10', 12, 'default', '14.1', 18.3 ] ) ).to.deep.equal( [
{ title: '10', model: 10, view: { name: 'span', styles: { 'font-size': '10px' }, priority: 5 } },
{ title: '12', model: 12, view: { name: 'span', styles: { 'font-size': '12px' }, priority: 5 } },
{ title: '10', model: 10, view: { name: 'span', styles: { 'font-size': '10px' }, priority: 7 } },
{ title: '12', model: 12, view: { name: 'span', styles: { 'font-size': '12px' }, priority: 7 } },
{ title: 'Default', model: undefined },
{ title: '14.1', model: 14.1, view: { name: 'span', styles: { 'font-size': '14.1px' }, priority: 5 } },
{ title: '18.3', model: 18.3, view: { name: 'span', styles: { 'font-size': '18.3px' }, priority: 5 } }
{ title: '14.1', model: 14.1, view: { name: 'span', styles: { 'font-size': '14.1px' }, priority: 7 } },
{ title: '18.3', model: 18.3, view: { name: 'span', styles: { 'font-size': '18.3px' }, priority: 7 } }
] );
} );
} );
Expand Down
89 changes: 89 additions & 0 deletions tests/integration.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
/**
* @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
*/

/* global document */

import Font from '../src/font';
import ArticlePluginSet from '@ckeditor/ckeditor5-core/tests/_utils/articlepluginset';
import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictesteditor';
import { setData as setModelData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
import env from '@ckeditor/ckeditor5-utils/src/env';

describe( 'Integration test Font', () => {
let element, editor, model;

beforeEach( () => {
element = document.createElement( 'div' );
document.body.appendChild( element );

return ClassicTestEditor
.create( element, {
plugins: [ Font, ArticlePluginSet ]
} )
.then( newEditor => {
editor = newEditor;
model = editor.model;
} );
} );

afterEach( () => {
element.remove();

return editor.destroy();
} );

describe( 'in-between font plugin features', () => {
it( 'should render one span element for all types of font features', () => {
setModelData( model,
'<paragraph>' +
'<$text fontColor="#123456" fontBackgroundColor="rgb(10,20,30)" fontSize="big" fontFamily="Arial">foo</$text>' +
'</paragraph>'
);

if ( !env.isEdge ) {
expect( editor.getData() ).to.equal(
'<p>' +
'<span ' +
'class="text-big" ' +
'style="font-family:Arial, Helvetica, sans-serif;background-color:rgb(10,20,30);color:#123456;"' +
'>foo' +
'</span>' +
'</p>'
);
} else {
// Edge sorts attributes of an element.
expect( editor.getData() ).to.equal(
'<p>' +
'<span ' +
'class="text-big" ' +
'style="font-family:Arial, Helvetica, sans-serif;color:#123456;background-color:rgb(10,20,30);"' +
'>foo' +
'</span>' +
'</p>'
);
}
} );
} );

describe( 'between font plugin and other', () => {
it( 'should render elements wrapped in proper order', () => {
setModelData( model,
'<paragraph>' +
'<$text bold="true" linkHref="foo" fontColor="red" fontSize="big">foo</$text>' +
'</paragraph>'
);

expect( editor.getData() ).to.equal(
'<p>' +
'<a href="foo">' +
'<span class="text-big" style="color:red;">' +
'<strong>foo</strong>' +
'</span>' +
'</a>' +
'</p>'
);
} );
} );
} );
Loading

0 comments on commit 54467b4

Please sign in to comment.