Browse Source

Other: Increased the specificity of CSS rules. Introduced the .ck class for editor UI components (see: ckeditor/ckeditor5#494).

Aleksander Nowodzinski 7 years ago
parent
commit
e91e57b5cb

+ 4 - 1
packages/ckeditor5-link/src/linkediting.js

@@ -80,7 +80,10 @@ export default class LinkEditing extends Plugin {
 		const doc = model.document;
 		const doc = model.document;
 		const highlightDescriptor = {
 		const highlightDescriptor = {
 			id: 'linkBoundaries',
 			id: 'linkBoundaries',
-			class: 'ck-link_selected',
+			class: [
+				'ck',
+				'ck-link_selected'
+			],
 			priority: 1
 			priority: 1
 		};
 		};
 
 

+ 2 - 0
packages/ckeditor5-link/src/ui/linkactionsview.js

@@ -114,6 +114,7 @@ export default class LinkActionsView extends View {
 
 
 			attributes: {
 			attributes: {
 				class: [
 				class: [
+					'ck',
 					'ck-link-actions',
 					'ck-link-actions',
 				],
 				],
 
 
@@ -202,6 +203,7 @@ export default class LinkActionsView extends View {
 		button.extendTemplate( {
 		button.extendTemplate( {
 			attributes: {
 			attributes: {
 				class: [
 				class: [
+					'ck',
 					'ck-link-actions__preview'
 					'ck-link-actions__preview'
 				],
 				],
 				href: bind.to( 'href' ),
 				href: bind.to( 'href' ),

+ 1 - 0
packages/ckeditor5-link/src/ui/linkformview.js

@@ -111,6 +111,7 @@ export default class LinkFormView extends View {
 
 
 			attributes: {
 			attributes: {
 				class: [
 				class: [
+					'ck',
 					'ck-link-form',
 					'ck-link-form',
 				],
 				],
 
 

+ 6 - 6
packages/ckeditor5-link/tests/linkediting.js

@@ -166,7 +166,7 @@ describe( 'LinkEditing', () => {
 			);
 			);
 
 
 			expect( getViewData( view ) ).to.equal(
 			expect( getViewData( view ) ).to.equal(
-				'<p>foo <span class="ck-link_selected"><a href="url">b{}ar</a></span> baz</p>'
+				'<p>foo <span class="ck ck-link_selected"><a href="url">b{}ar</a></span> baz</p>'
 			);
 			);
 		} );
 		} );
 
 
@@ -188,7 +188,7 @@ describe( 'LinkEditing', () => {
 			expect( marker.getEnd().path ).to.deep.equal( [ 0, 7 ] );
 			expect( marker.getEnd().path ).to.deep.equal( [ 0, 7 ] );
 
 
 			expect( getViewData( view ) ).to.equal(
 			expect( getViewData( view ) ).to.equal(
-				'<p>foo <span class="ck-link_selected"><a href="url">{}bar</a></span> baz</p>'
+				'<p>foo <span class="ck ck-link_selected"><a href="url">{}bar</a></span> baz</p>'
 			);
 			);
 		} );
 		} );
 
 
@@ -204,7 +204,7 @@ describe( 'LinkEditing', () => {
 			expect( marker.getEnd().path ).to.deep.equal( [ 0, 7 ] );
 			expect( marker.getEnd().path ).to.deep.equal( [ 0, 7 ] );
 
 
 			expect( getViewData( view ) ).to.equal(
 			expect( getViewData( view ) ).to.equal(
-				'<p>foo <span class="ck-link_selected"><a href="url">bar{}</a></span> baz</p>'
+				'<p>foo <span class="ck ck-link_selected"><a href="url">bar{}</a></span> baz</p>'
 			);
 			);
 		} );
 		} );
 
 
@@ -233,7 +233,7 @@ describe( 'LinkEditing', () => {
 			);
 			);
 
 
 			expect( getViewData( view ) ).to.equal(
 			expect( getViewData( view ) ).to.equal(
-				'<p>foo <span class="ck-link_selected"><a href="url">li{}nk</a></span> baz</p>'
+				'<p>foo <span class="ck ck-link_selected"><a href="url">li{}nk</a></span> baz</p>'
 			);
 			);
 
 
 			expect( model.markers.has( 'linkBoundaries' ) ).to.be.true;
 			expect( model.markers.has( 'linkBoundaries' ) ).to.be.true;
@@ -251,7 +251,7 @@ describe( 'LinkEditing', () => {
 			);
 			);
 
 
 			expect( getViewData( view ) ).to.equal(
 			expect( getViewData( view ) ).to.equal(
-				'<p>foo <span class="ck-link_selected"><a href="url">li{}nk</a></span> baz</p>'
+				'<p>foo <span class="ck ck-link_selected"><a href="url">li{}nk</a></span> baz</p>'
 			);
 			);
 
 
 			expect( model.markers.has( 'linkBoundaries' ) ).to.be.true;
 			expect( model.markers.has( 'linkBoundaries' ) ).to.be.true;
@@ -259,7 +259,7 @@ describe( 'LinkEditing', () => {
 
 
 			expect( model.markers.has( 'linkBoundaries' ) ).to.be.true;
 			expect( model.markers.has( 'linkBoundaries' ) ).to.be.true;
 			expect( getViewData( view ) ).to.equal(
 			expect( getViewData( view ) ).to.equal(
-				'<p>foo <span class="ck-link_selected"><a href="url">l{}ink</a></span> baz</p>'
+				'<p>foo <span class="ck ck-link_selected"><a href="url">l{}ink</a></span> baz</p>'
 			);
 			);
 		} );
 		} );
 	} );
 	} );

+ 2 - 2
packages/ckeditor5-link/tests/linkui.js

@@ -250,7 +250,7 @@ describe( 'LinkUI', () => {
 				const spy = testUtils.sinon.stub( balloon, 'updatePosition' ).returns( {} );
 				const spy = testUtils.sinon.stub( balloon, 'updatePosition' ).returns( {} );
 
 
 				expect( getViewData( view ) ).to.equal(
 				expect( getViewData( view ) ).to.equal(
-					'<p><span class="ck-link_selected"><a href="url">f{}oo</a></span></p>'
+					'<p><span class="ck ck-link_selected"><a href="url">f{}oo</a></span></p>'
 				);
 				);
 
 
 				const root = viewDocument.getRoot();
 				const root = viewDocument.getRoot();
@@ -319,7 +319,7 @@ describe( 'LinkUI', () => {
 				const spyUpdate = testUtils.sinon.stub( balloon, 'updatePosition' ).returns( {} );
 				const spyUpdate = testUtils.sinon.stub( balloon, 'updatePosition' ).returns( {} );
 				const spyHide = testUtils.sinon.spy( linkUIFeature, '_hideUI' );
 				const spyHide = testUtils.sinon.spy( linkUIFeature, '_hideUI' );
 
 
-				expect( getViewData( view ) ).to.equal( '<p><span class="ck-link_selected"><a href="url">f{}oo</a></span></p>' );
+				expect( getViewData( view ) ).to.equal( '<p><span class="ck ck-link_selected"><a href="url">f{}oo</a></span></p>' );
 
 
 				const root = viewDocument.getRoot();
 				const root = viewDocument.getRoot();
 				const text = root.getChild( 0 ).getChild( 0 ).getChild( 0 ).getChild( 0 );
 				const text = root.getChild( 0 ).getChild( 0 ).getChild( 0 ).getChild( 0 );

+ 1 - 0
packages/ckeditor5-link/tests/ui/linkactionsview.js

@@ -24,6 +24,7 @@ describe( 'LinkActionsView', () => {
 
 
 	describe( 'constructor()', () => {
 	describe( 'constructor()', () => {
 		it( 'should create element from template', () => {
 		it( 'should create element from template', () => {
+			expect( view.element.classList.contains( 'ck' ) ).to.true;
 			expect( view.element.classList.contains( 'ck-link-actions' ) ).to.true;
 			expect( view.element.classList.contains( 'ck-link-actions' ) ).to.true;
 			expect( view.element.getAttribute( 'tabindex' ) ).to.equal( '-1' );
 			expect( view.element.getAttribute( 'tabindex' ) ).to.equal( '-1' );
 		} );
 		} );

+ 1 - 0
packages/ckeditor5-link/tests/ui/linkformview.js

@@ -26,6 +26,7 @@ describe( 'LinkFormView', () => {
 
 
 	describe( 'constructor()', () => {
 	describe( 'constructor()', () => {
 		it( 'should create element from template', () => {
 		it( 'should create element from template', () => {
+			expect( view.element.classList.contains( 'ck' ) ).to.true;
 			expect( view.element.classList.contains( 'ck-link-form' ) ).to.true;
 			expect( view.element.classList.contains( 'ck-link-form' ) ).to.true;
 			expect( view.element.getAttribute( 'tabindex' ) ).to.equal( '-1' );
 			expect( view.element.getAttribute( 'tabindex' ) ).to.equal( '-1' );
 		} );
 		} );

+ 1 - 1
packages/ckeditor5-link/theme/linkactions.css

@@ -3,7 +3,7 @@
  * For licensing, see LICENSE.md.
  * For licensing, see LICENSE.md.
  */
  */
 
 
-.ck-link-actions {
+.ck.ck-link-actions {
 	& .ck-link-actions__preview {
 	& .ck-link-actions__preview {
 		display: inline-block;
 		display: inline-block;
 
 

+ 1 - 1
packages/ckeditor5-link/theme/linkform.css

@@ -3,7 +3,7 @@
  * For licensing, see LICENSE.md.
  * For licensing, see LICENSE.md.
  */
  */
 
 
-.ck-link-form {
+.ck.ck-link-form {
 	& .ck-labeled-input {
 	& .ck-labeled-input {
 		display: inline-block;
 		display: inline-block;
 	}
 	}