Custom Query

Steps to reproduce

Create new dialog without set id attribute for element or open one old dialog and remove id attribute of element:

CKEDITOR.dialog.add( 'bulletedListStyle', function( editor )
	{
		return {
			title : editor.lang.list.numberedTitle,
			minWidth : 300,
			minHeight : 50,
			contents :
			[
				{
					elements :
					[
						{
							type : 'hbox',
							widths : [ '25%', '75%' ],
							children :
							[
								{
									label: editor.lang.list.start,
									type: 'text',
									setup : function( element )
									{
										var value = element.getAttribute( 'start' ) || 1;
										value && this.setValue( value );
									},
									commit : function( element )
									{
										element.setAttribute( 'start', this.getValue() );
									}
								},
								{
									type : 'select',
									label : editor.lang.list.type,
									width: '100%',
									items :
									[
										[ editor.lang.list.style_1 , '1' ],
										[ editor.lang.list.style_a , 'a' ],
										[ editor.lang.list.style_A , 'A' ],
										[ editor.lang.list.style_i , 'i' ],
										[ editor.lang.list.style_I , 'I' ]
									],
									setup : function( element )
									{
										var value = element.getAttribute( 'type' ) || '1';
										this.setValue( value );
									},
									commit : function( element )
									{
										element.setAttribute( 'type', this.getValue() );
									}
								}
							]
						}
					]
				}
			],
			onShow: function() 
			{
				var editor = this.getParentEditor(),
					element = getListElement( editor, 'ol' );

				element && this.setupContent( element );
			},
			onOk: function()
			{
				var editor = this.getParentEditor(),
					element = getListElement( editor, 'ol' );
				
				element && this.commitContent( element );
			}
		}
	});

• Expected: all 'commit' and 'setup' method of element will execute
• Result: only the last element have that behavior

Observable for instance for a single image inside a table cell. The bug seems to be caused by the selected element being set to be the containing table element even though for instance the double-click event does get the correct element passed as its .data.element.

For a document containing something like (only):

<table>
	<tbody>
		<tr>
			<td>
				<img alt="Silva.jpg" src="/images/Silva.jpg" style="width: 100px; height: 133px;" /></td>
		</tr>
	</tbody>
</table>

reproduce the bug by double-clicking on the image. The image dialog opens, but is not initialized with the image data.

In general,

1. right-clicking the image will not show the image context-menu;
2. double-clicking the image will open the image dialog, but will not initialize the dialog correctly;
3. clicking the image toolbar icon with the image selected will open the image dialog but uninitialized.
4. Please also note that when you click on image - the elements path shows only body table. If you will try to click on border you will get body table tbody tr td. It is not possible to get img element there.

When i use dialog and put content as :

<div style="height:200px; width:200px; overflow:hidden"> <img src="..." height="1000" width="1000" /> </div>

Dialog height is put to 1000 instead of stay a current height. I can resolve this issue with this if it can help set "vertical-align" to 'top' instead of verticale-baseline

I would like an event fired when a dialog move has been completed.

Using an iPhone/iPod touch:

1. Open image dialog (also occurs in link dialog)
2. try to select an image

Results: The dialog is sized in such a way that the ok and cancel buttons are off the right of the screen and the user cannot scroll to the right to click it.

It was surprising to see that we actually have some mechanism for access keys. We need end user documentation on this matter, as it's not discoverable at all.

We need to provide some additional information for that. Ideally the solution would be to put it in the dialog itself.

A cructial thing here is that we want to make it perceivable to all users.

aria-describedby would be handy for giving this information to a screen reader, but not sure how to nicely present this information to sighted user.

• Approach similar to Linux/Windows accelerator keys (if you press access key modificator key, then associated character gets underlined) would be the best fit, but it requires major code changes so it would take considerable amount of time.
• Displaying constantly it next to label is not an option too, as:
  • it doesn't fit the design
  • we don't want bloat UI with information that will be useful only for smaller part of users
• Listing dialog access keys in resources like [Accessibility Support and Keyboard Shortcuts](​http://sdk.ckeditor.com/samples/accessibility.html) or in A11y help dialog (alt+0). Still terrible idea, because we'd end up with just too much information in a very inconvienient place.

Additionally we'd only list hotkeys for official plugins, and these wouldn't be updated automatically.

Curious to know other people opinions.

In the Dialog plugin, callling showPage on a page that is already visible increments the pageCount, meaning that when all but one page are removed, the tab bar will still be visible. To reproduce:

1. Create and show a dialog with two pages; both shown by default. Let's call them page1 and page2.
   
2. Call showPage( 'page2' )
   
3. Call hidePage( 'page1' )
   

Now only page2 will be visible - but the tab bar will still be showing, with the single tab "page2". Intended behaviour (presumably) is to have tab bar disappear when only one page is visible.

This can be fixed by adding a check to tab.isVisible() in showPage.

Proposed patch included.

FUP of #5084.
If the dialog size is bigger than the view pane, it should be reduced to fit the view pane. We should cover the resize event as well.

1. Click "New Page".
2. Click the table icon.
3. Without any change, hit ENTER to insert the table.

Two tables are inserted.

Confirmed in IE9, IE10 and Firefox (randomly) on Windows. I was not able to reproduce it on Mac.

If the 'Browse server' button in the image or link dialog is clicked, resulting in the popup window opening, and that popup is then closed, the original dialog no longer has keyboard focus. Accordingly, the escape key does not work.

Reproduce case, using 4.4.3 (revision fd4f17c):

1) Go to ​http://ckeditor.com/demo 2) Click 'Image' button. The image dialog opens. 3) Click 'Browse Server' button. The browse server popup opens. 4) Either choose an image or cancel. The browser server popup closes. 5) There is no keyboard focus any more, and the escape key on the keyboard does not work.

Comparison case:

1) Go to ​http://ckeditor.com/demo 2) Click 'Image' button. The image dialog opens. 3) Press escape, and the image dialog closes.

Cheers,

In addition to what described here: ​https://dev.ckeditor.com/ticket/13193

Steps to reproduce

1. CKEDITOR.dialog.add('dsDialogSIL', function (editor)
           {
               return {
                   title: 'Cargar datos SIL',
                   minWidth: 400,
                   minHeight: 200,
                   contents:
                   [
                       {
                           id: 'Tab1',
                           label: 'Tab1',
                           title: '',
                           expand: true,
                           padding: 0,
                           elements: [
                               {
                                   type: 'html',
                                   html: '<div class="tab_container">Sample <b>text</b>.</div><div id="otherId">Another div.</div>'
                               }
                           ]
                       },
                       {
                           id: 'Tab2',
                           label: 'Tab2',
                           title: '',
                           expand: true,
                           padding: 0,
                           elements: [
                               {
                                   type: 'html',
                                   html:
                                       '<div class="tab_container">' +
                                       '<p>' +
                                           'Sample text' +
                                       '</p>' +
                                       '</div>'
                               }
                           ]
                       },
                       {
                           id: 'tab-sil-sesiones',
                           label: 'Sesiones',
                           elements: [
                               {
                                   type: 'text',
                                   id: 'id',
                                   label: 'Id'
                               }
                           ]
                       }
                   ],
                   onOk: function ()
                   {
                       var dialog = this;
   
                       var abbr = editor.document.createElement('abbr');
                       abbr.setAttribute('title', dialog.getValueOf('tab-basic', 'title'));
                       abbr.setText(dialog.getValueOf('tab-basic', 'abbr'));
   
                       var id = dialog.getValueOf('tab-adv', 'id');
                       if (id)
                       {
                           abbr.setAttribute('id', id);
                       }
   
                       editor.insertElement(abbr);
                   }
               };
           });
   

Expected result

Actual result

Other details (browser, OS, CKEditor version, installed plugins)

CKEditor 4.5.7 - Latest --

You can take the same example that j.swiderski upload and just add id="MyTab1" the main DIV:

​https://dev.ckeditor.com/attachment/ticket/13193/mytest.zip

Best regards.

Steps to reproduce

1. download and use mytest.zip​ by j.swiderski on ticket 13193. ​https://dev.ckeditor.com/ticket/13193
2. add an id to the outermost html element div '<div id="someid" class="tab_container">' on tab 1.
3. open dialog
4. select tab 2 then try to select tab 1.

Expected result

selecting tab 1 will bring you back to tab 1 one

Actual result

once tab 2 is selected tab 1 can't be reselected.

Work Around

html: '<div class="tab_container"><div id="myDiv"></div></div>',

Other details (browser, OS, CKEditor version, installed plugins)

When tab is selected, text inside changes to bold. This sometimes results in changed width and relocation of other tabs.

TC

1. Open Image dialog
2. Select "Link" tab
3. Select "Image Info" tab

1. Resize browser window so it's lower than 300px.
2. Open replacebyclass sample.
3. Scroll down.
4. Open image dialog.
5. Try to move it by dragging header.
6. It will stick to upper viewport border. It's impossible to move it lower.

Extracted from #8888.

The definition of the function returned from dialog.validate.functions suffers from two bugs.

1. When obtaining the "value" from the arguments, the inner function should be referencing its own arguments, not those of the outer function.
2. When calling functions, it should be using "call" and passing "this" so that other validation functions passed as arguments will have the item as "this" as they expect.

It is not easy to get know how to switch tabs in dialogs using keyboard.

A list with active keystrokes is needed.

OS: Mac OS X 10.6.1

Browser: Firefox 3.5.3

Product: CKEditor 3.0

Steps to reproduce:

1) Open "​http://ckeditor.com/" in Firefox on Mac OS X

2) Click on [See the demo] button

3) Place text cursor anywhere in CKeditor enabled textarea and type there a random word

4) Press "Apple + LeftArrow" keyboard button combo:

Expected: Text cursor moves to beginning of line, like in any other textarea.

Actual: Browser recognize this button combo as "Browser back" shortcut, and returns to "​http://ckeditor.com/"

In Safari 4.0.3 - behavior is correct: when text cursor is inside CKeditor textarea, button combo moves cursor to beginning of line, when textarea is not selected - browser recognizes this shortcut as "Go back" button.

There is the direct path ​https://github.com/ckeditor/ckeditor-dev/blob/master/plugins/widget/plugin.js#L3132 to the image file instead of CKEDITOR.getUrl and that causes the issue when custom CKEDITOR_GETURL function is used.

Usking kama skin, if a button is disabled in a dialog via the following:

CKEDITOR.dialog.add('dialog', function () {

return {

... onShow: function () {

this.disableButton('ok');

} ...

}

});

The button disables properly but no related styling for being disabled are applied and it appears identical to an enabled button.

I was able to fix this with a few CSS overrides:

a.cke_dialog_ui_button_ok.cke_disabled:hover, a.cke_dialog_ui_button_ok.cke_disabled:focus, a.cke_dialog_ui_button_ok.cke_disabled:active {

background-position: 0px -1144px;

}

a.cke_dialog_ui_button_cancel.cke_disabled:hover, a.cke_dialog_ui_button_cancel.cke_disabled:focus a.cke_dialog_ui_button_cancel.cke_disabled:active {

background-position: 0px -1105px;

} a.cke_dialog_ui_button.cke_disabled:hover, a.cke_dialog_ui_button.cke_disabled:focus, a.cke_dialog_ui_button.cke_disabled:active {

background-position: 0px -1069px;

}

a.cke_disabled {

opacity: 0.3;

}

According to CKEDITOR.config.readOnly, if not specified, it should check to see if the linked textarea has the disabled attribute. This is not currently happening.

This is my first bug report. I am attempting to se disableObjectResizing=true and it seems to be working fine, except when clicking to full screen mode / maximize. Once you do that, users can click the image and resize, even if disableObjectResizing is true.

You can test here: ​http://www.elementalblend.com/_prodev/ckeditor4/

• using firefox 19.0 and mac osx 10.8.2
• click the image button and put in an absolute image link
• try to resize (which shouldn't work)
• click maximize button
• click image to resize in full screen mode, and now it works (even though disableObjectResizing=true)

Here is a screen shot: ​http://i.imgur.com/kUHHm6e.png

Thanks, Brandon

By selecting a dom range who contains invalid Html tags, IE causes an error in the error function at the line 201 of the element.js:

this.$.appendChild( node.$ );

In the case value contains an invalid tag, fe.: <foo>some content</foo>, the "this.$" is an instance of DispHTMLUnknownElement who doesn't implements the appendChild function.

the error is caused by the range.select(true), this.createBookmark(); line 1636 plugins/selection/plugin.js, clone.insertNode( startNode ); line 528 /core/dom/range.js

We are currently experiencing this issue with IE 8 and 9, we haven't tried with prior version of the software.

<span style="display: inline-block"><a href="/send-now"><img alt="Buy - Global Express" src="sites/default/files/media/buy_button.gif" /></a></span>

Paste the above HTML in source.

While using CK editor in IE, if we select the image and click on the link editor, it looses focus and link is inserted at the beginning of the HTML rather than at the image itself.

This is due to display: inline-block and happens only in IE. Please fix.

It would be nice if I can view unprintable characters of used formatting in CKeditor. Is it possible to make button for display and hide such unprintable characters?

Steps to reproduce

Using CKEditor with the basic configuration, plus the divarea plugin, hit space on an iPhone (if using the simulator, use the software keyboard, not a hardware keyboard).

Expected result

A period should be entered (this is how iOS handles double spaces).

Actual result

Two spaces are entered.

Other details (browser, OS, CKEditor version, installed plugins)

The issue does not seem present if the ementspath plugin is present. However, it is present if that plugin is present but .cke_bottom has been hidden with CSS.

Steps to reproduce

1. Open divarea sample and clean editor contents.
2. Type few letters
3. Open smiley or special character dialog
4. Type few more characters

Expected result

It should not be possible to type characters.

Actual result

It is possible to type characters.

Other details (browser, OS, CKEditor version, installed plugins)

Problem can be reproduced from CKEditor 4.0, only in Blink and Webkit browsers.

• Open a sample that has this style in its style set:

  	{ name : 'TEST1', element: 'div', styles : { 'color' : 'red' } },
  

• Click inside the sample content and click the div icon.
• Choose TEST1 from the styles list.
• Click OK.

JS error is thrown:

style._.definition.attributes is undefined
/_source/plugins/div/dialogs/div.js L339

Regression of [5846].

This is the same as #8771 which was closed as "expired - can't reproduce" a while back. This bug is still present in 4.4.5 and is actually very easy to reproduce even with the demo at ​http://ckeditor.com/demo#full-page:

Click the document properties button to open the docprops dialog.

Go to "Design" page.

Click on "Choose" button of "Text color" field.

Do *not* pick a color in the colorpicker but close the colorpicker with "Cancel".

Click on "Choose" button of Background color".

Now *do* pick a color in the colorpicker and close it with "OK":

The selected color is set into the "Background color" field (as expected) but is incorrectly *also* set into the "text color" field.

As already described in #8771, the problem is in ckeditor/plguins/docprops/dialogs/docprops.js, in the "getDialogValue" function:

Buggy code:

var onOk = function() {
	releaseHandlers( this );
	callback( this, this._.parentDialog );
};
var releaseHandlers = function( dialog ) {
	dialog.removeListener( 'ok', onOk );
	dialog.removeListener( 'cancel', releaseHandlers );
};
var bindToDialog = function( dialog ) {
	dialog.on( 'ok', onOk );
	dialog.on( 'cancel', releaseHandlers );
};

The problem with the above is that "releaseHandlers" is set directly as the "cancel" listener.

Suggested change:

var onOk = function() {
	releaseHandlers( this );
	callback( this, this._.parentDialog );
};
var onCancel = function() {
	releaseHandlers( this );
};
var releaseHandlers = function( dialog ) {
	dialog.removeListener( 'ok', onOk );
	dialog.removeListener( 'cancel', onCancel );
};
var bindToDialog = function( dialog ) {
	dialog.on( 'ok', onOk );
	dialog.on( 'cancel', onCancel );
};

docprops.js creates a hash table of meta elements, keyed by the name converted to lower case. However, there are several cases of tests such as:

name in hash

which fail if the meta element name is not all in lower case. Fix is to replace several occurrences of the above with:

name.toLowerCase() in hash

Also in setupMeta:

result = ( name.toLowerCase() in hash ) ? hash[ name.toLowerCase() ].getAttribute( 'content' ) || '' : '';

The below description summarizes first 11 comments.

@Nickholt has extended docProps dialog with extra meta tags values. He copied the code that we use for standard values like ‘author‘ and to his surprise it didn’t work for attributes with values like meta name="THIS.Is.An.Upper.Case.Meta.Name. so he used toLowerCase() Method on name attribute.

Our code works and custom code is completely different story which makes this request rather invalid but I thought that perhaps we could make our code more flexible. Who knows if there won’t be a browser or a mobile tool that needs this change to display documents correctly.

Just a thought but perhaps fixing #8668 which to me may related will also fix this one.

Found by Olek. It looks like the docprops is missing colordialog entry in the "requires" property. The "Choose" buttons in "Design" tab are supposed to launch colordialog.

Based on #10187.

The only way to change base path is using GLOBAL variable - CKEDITOR_BASEPATH. After setting this value, CKEditor.basePath == CKEDITOR_BASEPATH and CKEDITOR.plugins.basePath == CKEDITOR_BASEPATH +'/plugins'.
Properties basePath and plugins.baePath are read-only and changing them will not have any result. If you look at the ticket #10187 you will see that not everyone knows that.

As discussed with @fredck I propose:

1. Marking them in docs as read-only values
2. Changing text for plugins.basePath from "The base directory containing all resources." to something like "Path to directory containing all plugins". First one may suggest that this is in fact path to CKEditor directory.

The API docs for addButton are incomplete: ​http://docs.ckeditor.com/#!/api/CKEDITOR.ui

Some properties on 'definition' are not documented, such as the 'icon' property. For a list of properties one can currently find it deeper in the code at plugins/button/plugin.js -- I suggest going through the properties here and deciding which to document alongside addButton.

When documenting the 'icon' property, also mention that this is not the primary way to set icons, which is to use the 'icons' property on the plugin itself and to use matching icon/button names. Explain it is usually better to do it the primary way because then skins are able to override the icons if they wish.

​http://docs.ckeditor.com/#!/guide/dev_files

Oops…

Guide dev_files was not found.

Maybe it was renamed to something else?

Or maybe your internet connection has failed? This would be sad. Hopefully it's just a bug on our side.

Most likely you just followed a broken link inside this very documentation. Go and report it to the authors of the docs.

But if you think it's a bug in JSDuck documentation-generator itself, feel free to open an issue at the JSDuck issue tracker.

Sorry for all this :(

(This replaces #12932, which got messy)

Currently implementing hidpi is not documented. This ticket will try and describe what specifically needs documenting. My notes will be broader than hidpi, as I think more can be written about icon referencing in general.

To implement hidpi, hidpi:true needs setting on the plugin definition. This works in tandem with the 'icons' plugin definition property, telling ckeditor to automatically reference for the plugin's images/hidpi/example.png instead of the plugin's images/example.png. Explain that CKEditor is declarative in this way, and uses convention-over-configuration, it doesn't/can't/won't do filesystem searches or have any separate icon registry for plugins, apart from automatic insertion of reference to sprites for those plugins built in via CKBuilder.

It should mention that icons are always implemented using a background-image inline style, not using stylesheets or srcset. This confused me a lot, because you actually detect hidpi in JavaScript and set CKEDITOR.env.hidpi globally, which is an unusual (but effective) approach.

Following on from this, a plugin that sets a button icon via addButton (rather than the 'icons' plugin property), can look at CKEDITOR.env.hidpi to set the hidpi image path as needed.

The API docs for addButton are incomplete: ​http://docs.ckeditor.com/#!/api/CKEDITOR.pluginDefinition

It does not document 'icons'. 'icons' is particularly tricky because it is a comma-separated list, not a native JS list. This caused me quite a lot of confusion when debugging. Make sure it clearly specifies it as a comma-separated list.

Is there any way we can add a field to link a style sheet into the document properties page (when editing a full html page)? For normal editing when the text will be incorporated right into the site, setting the editor's css before writing the editor is good enough. However for a full page, although it previews with that style sheet, it doesn't actually write it into the page when submitting it. One would need to manually type in the css link.

Moved from SF:
​http://sourceforge.net/tracker/index.php?func=detail&aid=1172741&group_id=75348&atid=543656

Steps to reproduce

When changing the background color, cancelling, and changing the text color instead in document properties it changes the value for both fields.

1. Click Document Properties -> Design -> Chose Background Color
2. In the Background Color editor, select a color and then hit Cancel
3. Click on Chose for Text Color and make a selection
4. Click Ok to close out of the Document Properties dialog

Expected result

Document text color is changed

Actual result

Document background color AND text color are changed

Other details (browser, OS, CKEditor version, installed plugins)

I think this code might end up confusing you when Opera one day supports 'paste' events:

​http://dev.ckeditor.com/browser/CKEditor/trunk/_source/plugins/clipboard/plugin.js#L141

I suggest adding some additional feature detection - perhaps

if ( CKEDITOR.env.opera && ! ('ClipboardEvent' in window) )

or something like that.. There is no rush, paste event is high priority but probably won't happen for Opera 12 unfortunately.

This test passes in browsers like Fx and Chrome, but fails in IE7&8.

var root = newElement( 'span' ),
	child1 = newElement( 'span' ),
	child2 = newElement( 'span' );

child1.appendTo( root );
child2.appendTo( root );

assert.isTrue( CKEDITOR.tools.arrayCompare( child2.getAddress(), [ 1 ] ) ); // in IE7&8 - [ 0, 1 ]
assert.isTrue( CKEDITOR.tools.arrayCompare( root.getAddress(), [ ] ) ); // in IE7&8 - [ 0 ]

We ran into this with Drupal 8 - ​https://www.drupal.org/node/843708

There are a great list of examples - ​https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table#attr-summary

But using:

<table summary="descriptive text">

No longer fits with the HTML5 specs.

Using details/summary works fine: ​http://www.developerfusion.com/article/136530/making-tables-more-accessible-with-html5/ ​http://www.pdprogrammeur.com/tables-and-html5-table/

The UI shouldn't need to change, just the placement of the summary text.

Firefox 13 and newer no longer understand -moz-border-radius. The standard border-radius CSS property must be used instead, which is supported since Firefox 4 ​https://bugzilla.mozilla.org/show_bug.cgi?id=781059

There are some places in the ckeditor css code where you use -moz-border-radius without also using the border-radius

in a Dialog, if we press Enter key instead of click 'OK' button, onOK will be trigger double times. for example, if we show image dialog, and leave url field empty. the press Enter key, the alert will show double times.

1. Load the following content:

   <p><a href="#">link text</a></p>
   

2. Double click on word "text"

• Expected: selected word is highlighted;
• Actual: Link dialog opens.

Expect the double click (open dialog) shortcut only applies when link is fully selected when double clicked, which happens when:

1. Firefox always select the entire link text no matter of link text;
2. Other browsers it's fully selected only when link text has only one single word.

When a page has two editors present, calling the same dialog with dobule-clicking on both of them results in the second dialog box appearing underneath the semi-transparent background cover div.

Steps to reproduce:

1. Go to ​http://nightly.ckeditor.com/6504/_samples/replacebycode.html (currently the build is CKEditor 3.5.3 (SVN) (revision 6501))
   
2. Double click on the "Paste from Word" button in the first editor.
   
3. Close the dialog
   
4. Double click on the "Paste from Word" button in the second editor.
   
5. ???
   
6. PROFIT

Tested in latest Chrome and Firefox 3.6 on Windows 7 and XP. Screenshot attached.

There have been discussions about this in the forums with some plausible work-arounds but all seem a bit like a hack.

​http://ckeditor.com/forums/CKEditor/CKEditor-v4-Double-Click-to-Initiate-Editor

Would it be possible to add a configuration to override the default signle-click event to initiate inline edit mode?

Steps to reproduce

1. Open full featured example
2. Click increase indent and create list with one nested list

Expected result

Nested list has the same indent as the regular list

Actual result

Nested list has double indent

Other details (browser, OS, CKEditor version, installed plugins)

Steps to reproduce

1. Open Chrome mobile browser
2. Press button to add table
3. Accept inserting new table with enter key
4. Table should be added twice to editor

Expected result

Table will be added only once.

Actual result

Table is added twice.

Other details (browser, OS, CKEditor version, installed plugins)

Android 4.4.2, Chrome mobile v.58.

The link plugin does already attempt to remove the protocol on change events to the URL field, but it doesn't account for leading white space. It's understood that the URL shouldn't contain leading white space and this could be considered a user issue. However, later in CKEditor's workflow, it trims the URL specified before saving the result. If the user then re-opens the Link dialog for the link they have created, the URL field will now show the URL containing the protocol, but with the original leading white space removed. As a user at glance, everything looks ok, because I'm not aware that the Link plugin is going to prefix the field's data with the protocol that's currently selected in the drop down. Without triggering any change events, the URL field will remain untouched, still containing the protocol at the beginning.

The link dialog needs to either trim the contents of the URL field before checking for beginning with a protocol, or use a white space delimiter in the protocol regular expression.

Steps to reproduce

1. Highlight a word and click link button in toolbar
2. In URL field, enter a space character, then enter a URL prefixed with the protocol ​http:// (IE, ​http://www.google.com)
3. Click OK to save the link
4. Inspect the URL in the document and verify that the href for the anchor tag contains ​http://http://www.google.com
5. Re-open the link dialog for the link in your document.
6. Verify that the URL field contains the contents ​http://www.google.com

Expected result

" ​http://www.google.com" should be trimmed before checking for protocol OR " ​http://www.google.com" should remain as the actual contents of the URL field (not trimmed before save) so that the user can see the issue that exists.

Actual result

The URL field is not trimmed before checking for protocol but is trimmed before saving the field, thus causing the protocol to exists twice.

Other details (browser, OS, CKEditor version, installed plugins)

Chrome 54.0.2840.99 m Windows 7 Latest CK editor version (can reproduce in demo) Standard edition (specifically link plugin)

Steps to reproduce

1. Counfigure your CKEditor so that it allows Drag and Drop
2. Dropp file with ' in its name. You can use the attached one.

Expected result

<p><img alt="" height="630" src="/CKFinder/userfiles/images/can't%20send%20fax.JPG" width="450" /></p>

Actual result

<p><img alt="" height="630" src="/CKFinder/userfiles/images/can\'t%20send%20fax.JPG" width="450" /></p>

The ' in word can't is escaped.

Other details (browser, OS, CKEditor version, installed plugins)

Problem can be reproduced in every browser

1. Create editor instance with the element with ID:

` <p>foo<a href="​http://ckeditor.com" id="link">bar</a></p> `

2. Drag part of the link (ex. letter "a"),
3. Drop it somewhere else (ex. after "fo", before "o").

Result: two elements with the same ID: ` <p>fo<a href="​http://ckeditor.com" id="link">a</a>o<a href="​http://ckeditor.com" id="link">br</a></p> `

Is should not be possible to duplicate ID by drag and drop. Paste event may check if there is element already element with that ID and remove "id" attribute if so.

On the other hand the same issue exists with the native drag and drop on Chrome.

Chrome, Firefox, and IE10 allow you drag and drop an image file into the editor with the uploadimage plugin. For some reason it does not work with IE11.

This is a regression. It worked in version 4.4.8, but doesn't actually work in version 4.5.0 onwards.

Steps to reproduce:

1. Go to the ​demo page or any editor from the ​nightly build.
2. Drag any link you can find in that page into the editor.

What should happen: The editor should contain a link, with the title of the page and the URL in the href attribute, as shown in the first screenshot.

What happens instead: The editor contains the plain text URL, as shown in the second screenshot.

Reproduced on OS X 10.10.4 with Chrome 44.0.2403.89 beta and Safari 8.0.7.

Additional info: You can check out how it worked in version 4.4.8 in the following JSFiddle: ​http://jsfiddle.net/jm9syL75/

Reported through support channel.

Not sure if related to #11219.

When config.forcePasteAsPlainText is set, dragging&dropping inline widget results in widget being lost. Either drag&drop should be automatically disabled when config.forcePasteAsPlainText is set or widgets should not be lost in this very specific case.

A sample with inline widget is attached, drag & drop the widget and see that it is lost.

You can see this on the current 4.5.8 demo @ ​http://ckeditor.com/demo . Tried on Chrome & Firefox.

1. Sample content (source)

<a href="http://ckeditor.com/">link1</a> abc <a href="http://ckeditor.com/">link2</a>

2. In WYSIWYG mode, drag & drop the link1 to the very beginning or link2 to the very end of the line.

The link disappears & there's an error in the console:

Uncaught TypeError: Cannot read property 'type' of null
window.CKEDITOR.window.CKEDITOR.dom.CKEDITOR.dom.range.setStart @ ckeditor.js:formatted:3729

which is at:

setStart: function(b, c) {
                b.type == CKEDITOR.NODE_ELEMENT && CKEDITOR.dtd.$empty[b.getName()] && (c = b.getIndex(),

Upstream of that, a has no parent node @ setStartAfter:

setStartAfter: function(a) {
                this.setStart(a.getParent(), a.getIndex() + 1)
            },

Moved from ​https://github.com/ckeditor/ckeditor-sdk/issues/203

Steps to reproduce

When I upload "multi images" in this page, below error is displayed on my Chrome console. However, the upload itself is processed correctly.

Sample page: ​http://sdk.ckeditor.com/samples/fileupload.html#uploading-dropped-and-pasted-images Error message: ckeditor.js:430 The given range isn't in document.

The same phenomenon occurs also in my development environment.

Expected result

There should be no error reported in the error console.

Actual result

Files are uploaded (great!), but JavaScript exception occurs.

Other details (browser, OS, CKEditor version, installed plugins)

Chrome, reproduced on the latest version of CKEditor (4.6.1), did not try earlier versions.

Using the divarea and image2 plugin.

If you drag an image to a location in the editor that does not have any content, the image will disappear and an error will be thrown.

The error is "Unable to get property 'getParent' of undefined or null reference.

The problem occurs in IE, FireFox, and Chrome.

I've attached an animated GIF of the problem.

Steps to reproduce

1. Load CKEditor with the image2 widget and for easier testing

   config.allowedContent = true;
   

In the content add

<p><span style="border:2px solid red; padding: 10px">A span <img alt="" src="/userfiles/dnv.png">.</span></p>

(adjust image path as needed)

2. In design mode drag the image out of the span

Expected result

The image element is moved out cleanly

Actual result

A span wraps the image that is now out of the initial span

Other details (browser, OS, CKEditor version, installed plugins)

Tested with Firefox, Chrome and Edge

1. Go to ​http://ckeditor.com/demo
2. Drag image (which is wrapped in H1) in few places inside content area
3. Switch to source and notice that there are many empty headers inside content area <h1>&nbsp;</h1>

I have also tried using the below code (img inside div)

<div>
	<img alt="" src="http://a.cksource.com/c/1/inc/img/demo-little-red.jpg" style="margin-left: 10px; margin-right: 10px; float: left; width: 120px; height: 168px;" /></div>

• In Chrome div completely is lost.
• In Safari and Opera Div is lost on first drag. Wrapping div stays at the top and doesn't break paragraphs like H1.
• in Firefox and IE8-10 orphan divs are left throughout content area

Issue reproducible in all browsers from CKEditor 3.0

Steps to reproduce:

1.Insert a table inside the Ckeditor text area. 2.Click on the corner of the table. 3.Resizable border of the table will appear. 4.Drag the border out of the editor.

Issue 1:The dotted resizable corners of the table is displayed out of the CK editor. Issue 2:Now when we try to use the scroll of editor, the editor becomes unresponsive.

This occurs only in IE8 and IE9 and not in Firefox. I have attached a video to this, having the recording of the issue for your reference.

You can see this directly at ​http://ckeditor.com/demo#widgets

When dragging a widget, I would expect the editor to scroll up or down if I'm attempting to drag past the edges of the container. However, dragging is limited to the current height of the container, unless I also manually scroll with the scrollwheel.

Steps to reproduce

1. Create a drag-able widget.
2. Have a paragraph with left and right margins after it.
3. Drag the widget and hover between the widget and the paragraph.

Expected result

The line will match the size of the paragraph content.

Actual result

The line starts at the start of the paragraph content but is the width of the widget.

Ticket REF: 7320-RYDC-2204

Would be nice to have a plug-in available to draw tables like in Office Word.

The Main advantage of using this way with standard height and width is, user may not be confused to insert the table. With the current plug-in have great and more features , but may leads to confuse the user also.

I love FCKeditor, but I hope fckeditor has a drop-down list of pre-defined styles instead of a text box for image style like tinymce: (in the "Image Properties", "Advanced" tab).

Thanks. Bob

Steps to reproduce

Demo : ​http://codepen.io/Aanjaneyulu/full/ZpJOrz/

1. click on any drop down button
2. scroll with mouse

Expected result

list should move with editor.

Actual result

list does not move with the editor.

Other details (browser, OS, CKEditor version, installed plugins)

When I build forms with drop down lists without and selected default an error occurs. Afterthat it is impossible to use the rest of the form.

put the example code in the full featured editor in source mode an than switch to normal mode:

​http://ckeditor.com/demo#full

<select>
	<option value="test1">Test1</option>
	<option value="test2">Test2</option>
	<option value="test3">Test3</option>
	<option value="test4">Test4</option>
</select>

Open the console in IE11 or Chrome. Double click on the list to edit it in the form dialog and the error is thrown. Uncaught TypeError: undefined is not a function. selectjs:line 10, column 193

You expect the "selected" attribute but it is optional.

I un-minified the select.js and build a work around. After fixing the one error the next one occures...

here my code parts:

select.js: around line 10(minified version)

[...]
{
	id:"txtValue",
	type:"text",
	widths:["25%","75%"],
	labelLayout:"horizontal",
	label:c.lang.forms.select.value,
	style:"width:350px",
	"default":"",
	className:"cke_disabled",
	onLoad:function()
	{
		this.getInputElement().setAttribute("readOnly",!0)
	},
	setup:function(a,b)
	{
		//console.log( 'a', a );
		//console.log( 'b', b );
		if ( typeof ( b === 'undefined' ) )
		{
			return;
		}
		else
		{
			//console.log( 'b', b );
			//console.log( 'b attr', b.$.attributes['selected'] );
			if( typeof ( ( b.$.attributes['selected'] ) === 'undefined' ) )
			{
				return;
			}
			else
			{
				"clear"==a ? this.setValue("") : "option"==a && b.getAttribute("selected") && this.setValue(b.$.value);
			}
		}
	}
},
[...]

select.js: around line 12(minified version)

[...]
{
	type:"select",
	id:"cmbName",
	label:"",
	title:"",
	size:5,
	style:"width:115px;height:75px",
	items:[],
	onChange:function()
	{
		var a=this.getDialog(),
			b=a.getContentElement("info","cmbValue"),
			e=a.getContentElement("info","txtOptName"),
			a=a.getContentElement("info","txtOptValue"),
			d=g(this);
		i(b,d);
		e.setValue(this.getValue());
		a.setValue(b.getValue())
	},
	setup:function(a,b)
	{
		"clear"==a ? k(this):"option"==a && h(this,b.getText(),
		b.getText(),
		this.getDialog().getParentEditor().document)
	},
	commit:function(a)
	{
		var b=this.getDialog(),
		e=l(this),
		d=l(b.getContentElement("info","cmbValue")),
		c=b.getContentElement("info","txtValue").getValue();
		k(a);
		
		//console.log( 'e', e );
		// count is wrong, MINUS ONE, but there ist a new problem in the list, an empty element occures
		for( var f=0; f<e.count()-1; f++ )
		{
			var g=h(a, e.getItem(f).getValue(), d.getItem(f).getValue(), b.getParentEditor().document );
			d.getItem(f).getValue()==c && ( g.setAttribute("selected","selected"), g.selected=!0 )
		}
	}
}]
[...]

select.js: around line 14(minified version)

[...]
{
	type:"select",
	id:"cmbValue",
	label:"",
	size:5,
	style:"width:115px;height:75px",
	items:[],
	onChange:function(){
		var a=this.getDialog(),b=a.getContentElement("info","cmbName"),e=a.getContentElement("info","txtOptName"),a=a.getContentElement("info","txtOptValue"),d=g(this);i(b,d);e.setValue(b.getValue());a.setValue(this.getValue())
	},
	setup:function(a,b){
		//console.log( 'HIER 2 a', a );
		//console.log( 'HIER 2 b', b );
		if("clear"==a)
		{
			k(this);
		}
		else if("option"==a)
		{
			try
			{
				var e=b.getValue();
				h(this,e,e,this.getDialog().getParentEditor().document);
				"selected"==b.getAttribute("selected") && this.getDialog().getContentElement("info","txtValue").setValue(e)
			}
			catch( e )
			{
				// nothing
			}
		}
	}
}]
[...]

Some part of our dropdown markers (an arrow) is not grayed out when readonly mode is set.

It would be good idea to keep behaviour consistent.

1. open CKEditor Read-Only sample (i.e. samples/readonly.html)
2. click "Make it read-only" button

Expected result:
Arrows in buttons for plugin like Text Color, Background Color, Set Language, SCAYT are not grayed out.

Current result:
Arrows should be grayed out the same way as icons are.

additional info:

1. Note that arrows for Styles/Format combo are grayed as expected.

In Chrome and IE

1. Add dir="rtl" in body element of page.
2. Press maximize button.
3. Now if you want to open any of drpdowns they not work.

Steps to reproduce

1. Extract attached zip file, open test.html
2. Notice the drop downs work.
3. Click Move CK Editor
4. The toolbar moves, and now the drop downs open empty

Expected result

Dropdowns should open with content after the toolbar is moved

Actual result

Dropdowns open but appear blank

Other details (browser, OS, CKEditor version, installed plugins)

Tested in IE and Chrome using the latest CKEditor 4.5.6 with the shared spaces plugin installed.

To reproduce:

1. Open font menu, scroll down half way and then click away (don't select anything) so it closes
2. Now click the size menu.

Result: It starts scrolled down rather than back at the top.

This is happening because we use 1 float panel for dropdowns and don't reset on every open.
To be honest I have never considered this as a bug. Very common situation is when you try to select something from e.g. styles dropdown and you didn't click what you wanted. If you open dropdown again you will see dropdown in same area where you have finished. You don't have to scroll all the way down what may be frustrating to some (especially when you didn’t click what you wanted for the second time).

Sure when opening new dropdown user would expect it to be at the top. Since we are using one float panel we can either live with it or perhaps remember last dropdown opened and if current dropdown is different scroll it up.

For those who want to have float panel always scrolled up please use below code:

var editor = CKEDITOR.replace( 'editor1', {} );	
editor.on( 'panelShow', function( ev )	{				
	ev.data._.iframe.$.contentWindow.scrollTo(0,0);				
});

Another solution would be adding onOpen methods to below plugins (e.g. after onRender): \ckeditor4-git\plugins\format\plugin.js
\ckeditor4-git\plugins\font\plugin.js
\ckeditor4-git\plugins\stylescombo\plugin.js

onOpen : function(){
this._.panel._.iframe.$.contentWindow.scrollTo(0,0);
},

1. Clear editor
2. Insert below code into editor and select all contents with Ctrl+A

   <p><span style="font-family:arial,helvetica,sans-serif">test arial</span></p>
   <h1>test H1</h1>
   <p><span style="font-family:comic sans ms,cursive">test comic</span></p>
   

Result: Font dropdown shows Arial. In general, dropdowns reflect the beginning of selection.

Expected result: Dropdown shouldn’t show any value as current behaviour gives false impression that whole content has this type of font assigned.

Steps to reproduce

1. Load CKEditor with the image2 widget and for easier testing

   config.allowedContent = true;
   

2. In the content add

<p><span style="border:2px solid red; padding: 10px">A span</span></p>

and an inline image (without caption)

3. In design mode drag the image into the span

Expected result

The image is shown now inside the span

Actual result

The span is split in two and the image (widget) is placed between the two spans

<p><span style="border:2px solid red; padding: 10px">A </span><img alt="" src="/userfiles/dnv.png"><span style="border:2px solid red; padding: 10px">span</span></p>

Other details (browser, OS, CKEditor version, installed plugins)

Of course this happens with any other inline widget If the image is placed in source mode inside span then it works correctly and you can also drag the image from one position to another inside the span without problems

1. Open: ​http://tests.ckeditor.dev:1030/tests/plugins/uploadwidget/manual/image2
2. Add some image into editor.
3. Enable image caption.
4. Drop another one into image caption.

Effect: Image uploading notification is visible, but nothing changes in the editor content.

CKEDITOR.dtd.customtag = { em:1 };
CKEDITOR.dtd.$block.customtag = 1;
CKEDITOR.dtd.body.customtag = 1;

Load:

<customtag>foo</customtag>

It will be transformed to:

<customtag></customtag>

<p>foo</p>

I think that we don't have to rewrite all code which caches DTD objects because that would ruin performance or increase complexity in some places. Therefore we can introduce event CKEDITOR#dtd fired when DTD is created and allowing its modifications.

Based on: ​http://stackoverflow.com/questions/16066556/ckeditor-how-to-allow-for-inserthtmlcustomtag-myattr-value-customtag

EDIT: The problem is DTD caching makes it impossible to extend it after loading CKEditor source.

• Add div with id "someElementId" to the page
  
• Add to config
  

config.sharedSpaces = {top: 'someElementId'};

to move toolbar to the shared space.

• Inspect the page with developer tools/firebug - the toolbar and main editor element have the same id (cke_{name}).

I found this ticket (​http://dev.ckeditor.com/ticket/8451) in your database from 11 months ago and it's marked closed/invalid but the issue still seems to exist.

Steps:

-Create a table -Right-click on it, pick Table Properties -> advanced tab. -Enter: background-repeat:no-repeat; in the Style box, you get background-repeat:no-repeat no-repeat;

That is invalid and shouldn't happen. This can be reproduced in your ckeditor.com/demo site as well as latest nightly build.

What's interesting is that this doesn't happen when you create a new DIV, edit it and enter the same into style box there. This seems to happen on table properties only.

Steps to reproduce

1. Add new selection field
2. Set focus on it (select it)
3. Click list button, or Doubleclick on bold/italic/underline... button

Expected result

Selection field hasn't duplicate.

Actual result

Selection field duplicates in different ways. It depends on applied style.

Other details (browser, OS, CKEditor version, installed plugins)

Ckeditor version - 4.6.2 Installed plugins - Forms

At the moment AutoGrow plugin supports ​config.autoGrow_minHeight and ​config.autoGrow_maxHeight along with ​editor#autoGrow event, which can be used to force a custom height on every editor resize, i.e.

CKEDITOR.replace( 'editor2', {
	extraPlugins: 'autogrow',
	autoGrow_maxHeight: 400,
	removePlugins: 'resize',
	on: {
		autoGrow: function( evt ) {
			evt.data.newHeight = 42;
		}
	}
} );

Such behaviour is desired when the space around the editor is changing, i.e. window is resized, other page elements collapse or expand.

The event, however, controls height only, while overflow-y of editable area remains relative to config.autoGrow_maxHeight. The result is that even though it is possible to customise the main behaviour of the plugin, the scrollbar of editable area might be missing, making editor contents unreachable, which is a serious UX flaw.

Possible solutions:

1. Implement editor.plugins.autoGrow.setMaxHeight, which would override config.autoGrow_maxHeight on demand.
   1. + Solves the problem.
   2. - Change is permanent. Some devs may want to override autoGrow_maxHeight on demand, while in other cases they would expect default configuration to be preserved and respected.
2. Re-implement editor#autoGrow event, so autoGrow_maxHeight can be changed for every single event.
   1. + Solves the problem.
   2. + The impact of config.autoGrow_maxHeight remains.
   3. - Makes the code less obvious.
   4. - It's not straightforward. Hard to reach in documentation.

I would vote to extend templates and make them dynamic through the usage of popup dialog helper. The dialog would:

• contain user-configurable form
• go through validation & error display
• implement ui dependencies
• return html from a function, given formState hash.

This would allow a web site builder to provide client with smart templates that would react to web editor input.

Enclosed please find a very rudimentary example of what it would do. Validation and error handling aspects are not polished at this moment - subject to further development upon feature approval.

When working in the ckeditor, you used to be able insert a check box in one area and then click on top of the check box (you did not have to highlight it) and copy and paste it. You can no longer do that.

If you click on top of the check box and copy it with the context menu, it just pates a space (no check box).

If you very tediously highlight the check box and copy it, it includes a space before the check box and a space after the check box.

Steps to reproduce

1. Open ​http://ckeditor.com/demo.
2. Select some unstyled text.
3. Drag and drop it on some styled text or link.

Expected result

1. While dragging, cursor is visible.
2. Text is inserted in position of drop.

Actual result

1. Cursor is not visible.
2. Nothing happens.

Other details (browser, OS, CKEditor version, installed plugins)

Edge on Windows 10

Caused by ​https://connect.microsoft.com/IE/feedbackdetail/view/1609181/edge-contenteditable-preventing-the-drop-event-does-not-prevent-removing-the-dragged-text

Edge is the only browser which don't handle preventDefault() on drop correctly. The dragged text gets removed, so our cached dragRange points to an invalid location. This causes errors or removal of too much text. It could be possible to workaround this, but it's very, very sad and would make the CKEditor's integration with DnD very inconsistent.

Steps to reproduce

1. Go to ​http://ckeditor.com/demo.
2. Scroll editor viewport without focusing editor (e.g. using mouse wheel).
3. Click inside editor content to focus editor.

Expected result

The editor is focused and caret is placed on the position of the click.

Actual result

The editor viewport scrolls to the top and caret is placed on the beginning of the content.

Other details (browser, OS, CKEditor version, installed plugins)

Edge (Edge 38.14393, EdgeHTML 14.14393) - it does not happen in previous versions of Edge browser.

Steps to reproduce

1. Go to ​http://tests.ckeditor.dev:1030/tests/plugins/tableselection/manual/tableselection#child
2. Focus editor without focusing any table cell.
3. Select first table cell without dragging a selection out of it's border.

Expected result

Cell should be marked with native selection.

Actual result

Cell was marked with visual selection.

Notes

Bug appends only if cell wasn't focused. You can try this scenario:

1. Refresh test.
2. Focus editor without focusing any table cell.
3. Focus first table cell.
4. Select first table cell without dragging a selection out of it's border.

As you can see, it received native selection.

Other details (browser, OS, CKEditor version, installed plugins)

OS: Windows 10 Browsers: Edge, IE 11

Steps to reproduce

1. On an empty CKEditor instance
2. Try to touch the edition area to input content (anywhere)
3. Sometimes the edition cursor disapears and text input is not working.
4. Touch where the cursor should appear : the focus is set and the user can input content.

Expected result

A touch in the edition area (anywhere) should result in the ability to type content.

Actual result

A touch in the edition area sometimes result in the lost of focus.

Other details (browser, OS, CKEditor version, installed plugins)

OS: Windows 10

Browser: EDGE

Editor: version 4.5.7

Plugins :

• a11yhelp
• about
• basicstyles
• bidi
• blockquote
• clipboard
• colorbutton
• colordialog
• contextmenu
• dialogadvtab
• div
• elementspath
• enterkey
• entities
• filebrowser
• find
• flash
• floatingspace
• font
• format
• forms
• horizontalrule
• htmlwriter
• iframe
• image
• indentblock
• indentlist
• justify
• language
• link
• list
• liststyle
• magicline
• maximize
• newpage
• pagebreak
• pastefromword
• pastetext
• preview
• print
• removeformat
• resize
• save
• scayt
• selectall
• showblocks
• showborders
• smiley
• sourcearea
• specialchar
• stylescombo
• tab
• table
• tabletools
• templates
• toolbar
• undo
• wsc
• wysiwygarea

Steps to reproduce

1. Go to ​http://tests.ckeditor.dev:1030/tests/core/selection/manual/iecontenteditablefalse#child
2. Follow the scenario.

Expected result

Widget should receive a selection after key pressing.

Actual result

Widget doesn't receive a selection and moves downwards.

Other details (browser, OS, CKEditor version, installed plugins)

OS: Windows 10 Browser: Edge

Steps to reproduce

1. Open nightly build ​http://nightly.ckeditor.com/16-03-24-07-07/full/samples/
2. Open Image Properties dialog, enter an Image URL ex: ​http://img2.3lian.com/2014/f5/158/d/86.jpg
3. Select Alignment ( ex: Left)
4. Click OK to insert the image.
5. Right Click on Inserted Image.

Expected result

Context menu opens & it has Image Properties option.

Actual result

Context menu opens but it has no Image Properties option, so there is no way for user to edit the image

Steps to reproduce

HTML Source Code : <!DOCTYPE HTML> <html>

<head>

<script src="​https://code.jquery.com/jquery-2.2.4.js"></script> <script src="​http://cdn.ckeditor.com/4.5.11/full/ckeditor.js"></script> <script src="​http://cdn.ckeditor.com/4.5.11/full/adapters/jquery.js"></script>

<script> $(document).ready(function() {

$('#testCk').ckeditor();

}); </script> </head> <body> <textarea id="testCk"></textarea> </body> </html>

This works.

Remove DocType from html page. It does not work in edge browser only

Tried using Doctype config property. Still does not work.

Expected result

It should work in Edge even without Doctype declaration.

Actual result

It does not

Other details (Edge, Win 10,Full 4.5.11)

Steps to reproduce

1. Open attached word doc
2. Copy & paste the list using Paste from word doc

Expected result

List pasted properly with all nested levels shown properly

Actual result

List pasted incorrectly

Other details (browser, OS, CKEditor version, installed plugins)

In 4.6.0 we did not include generic test fixtures for Edge. It's time to fix it and add these missing pieces.

First we need to focus on fixtures directly in ​_fixtures directory.

Steps to reproduce

1. Open attached multi_list.docx in Word and copy it's content.
2. Open CKEditor.
3. Paste into editable.

Expected result

Pasted list has correct structure (ofc multiple digit markers do not need to be preserved).

Actual result

Starting with "4.2.1.Aa" item, list structure is broken.

Other details (browser, OS, CKEditor version, installed plugins)

I think it has something to do with this list item not having nbsp between marker and the list item content.

Steps to reproduce

1. Open nightly build ​http://nightly.ckeditor.com/16-03-23-07-06/full/samples/
2. Remove existing text and add test find and replace icon button
3. Keep cursor at beginning of paragraph
4. Open Find & Replace dialog, go to Replace tab, uncheck all checkboxes
5. In Find what field type "find", In Replace with field leave it empty
6. Click on Replace button
7. It finds word find
8. Click on Replace button again

Expected result

Find word is removed

Actual result == Find word not replaced

Steps to reproduce

1. Go to CKEditor sample.
2. Delete whole content.
3. Change style to "special container" and type some text.
4. Change style to "marker" and type some text.
5. Press CTRL + Z few times.

Expected result

It should undo all style changes.

Actual result

Style appears for a split second only and there's no possibility to undo changes.

Other details (browser, OS, CKEditor version, installed plugins)

OS: Windows 10 Browser: Edge

Steps to reproduce

1. Open ​http://tests.ckeditor.dev:1030/tests/plugins/widget/manual/block
2. Insert a doublecolumn widget(empty icon).
3. Cut the code snippet widget that's placed lower and paste it into the first editable in the doublecolumn widget.
4. Drag the code snippet widget somewhere - out of the editable, to the other cell - doesn't matter.

Expected result

Widget is moved, everything else remains the same.

Actual result

The editable in which the code snippet widget used to be disappears.

Other details (browser, OS, CKEditor version, installed plugins)

Opera.

It is first time called in editable's constructor, second in onDomReady inside wysiwygarea plugin.

This may not be a wrong behaviour, though it looks like one. We should investigate whether after the first call every changes (new listeners, etc) are cleaned up before second call. This maybe happen thanks to clean up done by setData which is done in onLoad function inside 'wysiwyg' mode (not class) constructor.

If everything is ok, appropriate docs should be written to avoid confusion in the future. Why editable#setup has to be called for the first time and why for the second time?

If you have a table inside a div with contenteditable="true", which is in turn inside a div with contenteditable="false" such as.

<div contenteditable="false">

<div contenteditable="true">

<table align="right" border="1" bordercolor="#ccc" cellpadding="5" cellspacing="0" style="border-collapse:collapse">

<tr><th scope="col">Position</th><th scope="col">Astronaut</th></tr> <tr><td>Commander</td><td>Neil A. Armstrong</td></tr>

</table>

</div>

</div>

and you change the properties of a cell. Then when you click 'Ok' on the cell properties dialog, the editor will scroll to the top, even if your table was not at the top of the page. This situation occurs when you have a widget with an editable section that contains a table. Reproduced in version 4.4.7 and on the CKEditor demo page.

When using Mozilla Firefox (or at least version 9.0.1), when a DIV with absolute positioning is not the first thing you click inside the editor, then it becomes uneditable.

Paste this inside a CKEditor to re-create:

<div>1. Click me</div>
<div style="position:absolute;">2. now try to edit me</div>

I note that this works as expected in competing editors such as TinyMCE.

Very often user needs to change attributes of some html element. For example, set class for current span element. At now there are no way to do this without switching to html code, searching manually this element in long html code and editing.

TinyMCE 3.x have this feature, you can check this here: ​http://www.tinymce.com/tryit/3_x/full.php Here is screenshots: ​http://i.imgur.com/DAllHOy.png ​http://i.imgur.com/wfElESi.png ​http://i.imgur.com/yb2hETk.png

Via this feature we can set for element custom id css class, edit css styles, onclick events, and many other features.

Will be good to implement this feature in CKEditor too, maybe not in core, but via separate plugin.

To reproduce the defect:

1. Open CK Editor and paste the lists from the attached doc

2. Keep your cursor after 2nd list item in Numbered/Bulleted list.

3. Press enter and press Increase Indent button

Expected Result:

A new empty list item appears at same level(level 1) as third list item.

Actual Result:

A new empty list item is created at level 1 and previous list items at level 1 are moved to level 2 and made as a sub list of the new empty list item created at level 1

To reproduce the defect:

1. Copy the list from attached word doc and paste it in to editor.

2. press enter after first list item.

Expected Result: A new empty list item is created and Numbers for other list items should update accordingly.

Actual Result: A new empty list item is created but Numbers for other list items are not updated they remain the same.

same behavior happens when we press enter after any of the pasted list items in the pasted list

Reproducing Procedures

1. Load any of the sample page and fill the editor with the following contents and selection:

   <table>
   	<tbody>
   		<tr>
   			<td>
   				^text</td>
   		</tr>
   	</tbody>
   </table>
   

2. Open 'Div Container' dialog and insert a default div.
3. Right click to open context menu;

• Expected Result: Options of 'remove' and 'edit' the div appear in menu.
• Actual Result: There's no optoins to modify the inserted div.