Custom Query

The language button is working on inline level, but currently not on a block level. You will notice that with RTL languages in LTR texts as the text stays left aligned. We could add the following behavior:

• if text included in a block element is selected, the block element should get a lang and dir attribute.
• if the user is adding a next blocklevel element, the language should be applied as well
• if the user has a blocklevel selected with a language, the language button should be active.
• If the user deactivate the button, the blocklevel element should remove the language and dir attributes.

It would be useful if it was possible to initialise many nested editables using just one name:

editables: {
    label: {
        selector: '.someClass'
    },
},

More details about the current behaviour and reasons: ​http://ckeditor.com/forums/Support/Editable-fields-in-widget#comment-134623

Workaround - using ​widget.initEditable with dynamically generated names and selectors.

Click on "Font" drop-down. Click on "Size" drop-down (all further clicks on "Font", "Size", "Format", "Background Color" and "Text color" drop-downs will result showing and immediate hiding of drop-down). Browser name and OS : Checked on IE8、IE9、IE10、IE11 on Windows 7.

We should describe solution for this issue in documentation just like for ticket #12768.

1. Clear editor contents and select "Italic Title"
2. Type few characters and press enter.
3. In second line change format to DIV (from format dropdown) and start typing. Result is italic div and there is nothing selected in styles dropdown probably because there is no such style.
4. Press enter and in third line change format to P. Typed text is still italic.

Result - you get italic P which you can only deactivate with Apply/Remove Italic title from styles dropdown.

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. Enable Bidi and Language plugins.
2. Set the text part to any RTL language (Arabic, Hebrew).
3. Even though the changed text part has dir="rtl" set, the LTR (and not RTL) Bidi button is active which is quite confusing.

After moving a widget (e.g. an image with a caption) to a different position and right-clicking on a text input, an error is thrown in the console and the right click menu doesn't show up. Issue occurs on Chrome 37.0.2062.120 (64-bit) running at Ubuntu 14.04.

Reproduction steps:

1. Open "New image plugin" sample: ​http://ckeditor.com/latest/samples/plugins/image2/image2.html
2. Move one of the images to the top of the text area.
3. Right-click on the image caption (don't select the text, just click it).

Result: No right click menu is visible and an error in the console is thrown: "Uncaught TypeError: Cannot read property 'checkReadOnly' of undefined"

Expected result: Right click menu should be opened.

1. Insert a table with default values.
2. Enter some content to each cell.
3. select one row.
4. right click -> merge cells.
5. while content in the merged cell is still selected click 'Select table' button.

Result: table is not selected

This happens only when merged cell content is selected, if you click inside the merged cell to deselect the content before clicking 'Select table' button then table will be selected.

This seems to be a IE9/10/11 specific issue.

When trying to write some text inside a word with added style (ie bold) the text doesn't have applied styles and new text can be placed on wrong place (like on the end of word).

Steps to reproduce:

1. Open demo and place cursor inside some word (ie: space|flight)
2. Toggle 'Bold' button to start writing bold text
3. Start writing some text

Expected result: spacesometextfligth (new text should be bold)

Actual result: spaceflightsometext

The result is the same on every tested browser.

The same result is when using voice input:

1. Open demo and place cursor inside some word (ie: space|flight)
2. Toggle 'Bold' button to start writing bold text
3. Start voice input some text

Actual result: text from voice input is not bold

From my observation it looks like Android or Cyanogenmod keyboard is replacing text from auto-suggest.

The only way to write bold text is to put:

1. cursor between two spaces
2. Toggle bold button
3. write new text

Tested on:

• Android 4.4.4 - Cyanogenmod 11-201410008-SNPAPSHOT-M11-i9300
• Browsers:
  • Firefox: 32.0.3
  • Chrome: 37.0.2062.117
  • Browser (preinstalled Chrome): 33.0.0.0 (from user agent string)

The issue was originally reported @ ​http://stackoverflow.com/questions/26257663/ckeditor-android-formatters-work-incorrectly

Following ​https://github.com/ckeditor/ckeditor-sdk/issues/25.

#cke_tooltip is placed directly in website <body> so it inherits global font rules. It looks strange if website's styles are very different from dialog's styles, e.g. a place where tooltips are shown. #cke_tooltip should gain static font-size and line-height to avoid weird layout in those cases.

See: ​CKEDITOR.config.devtools_styles.

Inside the same fieldset, two ckeditors will overflow the container on resize in Chrome/Safari.

Code that reproduces the bug:

<!DOCTYPE html>
<html>
	<head>
		<title>CKEditor</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<style>
			html {
				background-color: lightgray;
			}
			textarea {
				width: 100%;
			}
		</style>
	</head>
	<body>
		<div id="content">
			<fieldset>
				<textarea name="editor1" id="editor1">&lt;p&gt;Foo foo!&lt;/p&gt;</textarea>	
				<textarea name="editor2" id="editor2">&lt;p&gt;Foo foo!&lt;/p&gt;</textarea>
			</fieldset>
		</div>
		<script type="text/javascript" src="http://ckeditor.com/apps/ckeditor/4.4.5/ckeditor.js"></script>
		<script>
			CKEDITOR.replace('editor1');
			CKEDITOR.replace('editor2');
		</script>
	</body>
</html>

• enable autogrow plugin
  
• remove all content
  
• insert table with margin: 1%

The height of the editor will be greatly increased. The table will appear at the bottom of the editor.

When working in full page mode, if you open the editor for a given page, then use the docprops dialog to change a document setting, for example the background color, but you do not make any other changes, then CKEDITOR.editor.checkDirty() will still return false, so the changes will not be saved if saving is done only if checkDirty() returns true.

This is because checkDirty() and resetDirty() use only getSnapshot(), which returns the document body, but all changes in the docprops dialog are outside of the body.

Suggested change:

In checkDirty():

if (this.config.fullPage)
    return this.status == 'ready' && this._.previousValue !== this.getData();
else
    return this.status == 'ready' && this._.previousValue !== this.getSnapshot();

and in resetDirty():

if (this.config.fullPage)
    this._.previousValue = this.getData();
else
    this._.previousValue = this.getSnapshot();

To reproduce:

• Open editor, open image edit popup
• External .destroy()

Result: dialog is cleaned up, but the background overlay is left behind.

Reproducible in the current CKEditor demo Steps:

• Remove all editor content
• Insert table

-> Magicline is available before and behind the table

• Open table properties and set horizontal alignment

-> Magicline is not available

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 );
};

Use below code in contenteditable element or paste it into editor:

<table border="0" cellpadding="0" cellspacing="0" style="width:100%">
  <tbody>
    <tr>
      <td align="center">
        Plain text pasted here
        <br>
        <span style="font-size:8pt;">
          PDF, 378 KB
        </span>
      </td>
    </tr>
  </tbody>
</table>

Now copy this Chinese text 字讀音,臺灣教育部異體字字典標同 (can also be done with european text), select PDF, 378 KB and paste the chinese text.

In Firefox span gets removed in editor and native contenteditable.

In Blink and IE:
In editor:

<td>Plain text pasted here<br><span style="font-size:8pt"></span>字讀音,臺灣教育部異體字字典標同<span style="font-size:8pt"> </span></td>

In native contenteditable:

<span style="text-align: start;">字讀音,臺灣教育部異體字字典標同</span>

I don't think we can do anything about Firefox but perhaps there is room for improvement for Blink and IE.

Reproduction steps {using Chrome Version 37.0.2062.124 m (64-bit)}

1. Go to CK Editor demo page
2. Select Inline editing
3. Select all the text in one of the editor boxes and delete it (ctrl+A and then DEL).
4. Switch to Right to Left editing (ctrl + right shift)
5. Insert Bulleted list
6. Insert Numbered list

Result: browser is stuck!

The inline mode of CKEditor does not honor the ​baseHref option.

I guess it is because it relies on the base HTML tag and the inline editor does not use an iframe.

Could this feature be implemented inside the dataProcessor instead, to work in inline mode seamlessly? Otherwise, please add a note to the documentation of the option, so it is clear it will not work with inline editing.

The tutorials for adding custom widgets do not mention using them with custom tool bars

eg if you add a widget with

editor.widgets.add('foo', {
 allowedContent:'span[foo]'
,button:'Add foo'
});

config = {
  extraPlugins='foo'
 ,toolbar_Test=[['Source','foo']]
 .toolbar='Test'
}

Then the 'Foo' plugin will NOT appear on the toolbar also any 'foo' attributes will be stripped from spans

I have discovered, after a great deal of lost time that the command is auto generated from the widget name by uppercasing the first letter and lowercasing the rest

eg changing the toolbar definition to

[['Source','Foo']]

Reproduce with the help of the simplebox widget:

Click the toolbar button to insert a simplebox.

In the second of the two editable boxes of the widget, set the cursor somewhere in the middle of the word "Content...".

Use SHIFT+Cursorkeys to move the cursor up into the first of the editable boxes, somewhere in the middle of the word "Title", so that you have a selected text area that selects the end of the word "Title" and the beginning of the word "Content...".

Press DELETE to delete the selected text.

The result is as expected: The remaining text is now in the first box (the title box), but the content box, which is now empty, is still there, i.e. you can again insert new text into the content box.

Now make the following slight modification to the simplebox plugin:

Change the template so that the title box (the one with class="simplebox-title") is a div instead of a h2, like so:

template:
    '<div class="simplebox">' +
        '<div class="simplebox-title">Title</div>' +
        '<div class="simplebox-content"><p>Content...</p></div>' +
    '</div>',

(Also for completeness sake, change the "allowedContent" so that it says "div(!simplebox-title)" instead of "h2(!simplebox-title)".)

Reload the editor and repeat the above experiment.

You will see that when you press DELETE to delete the highlighted text, that the text is deleted as expected, but the second editable box (the div with class="simplebox-content") is also deleted, i.e. a protected part of the widget is damaged. You can no longer add new text into the "content" field of the widget since it no longer exists.

1. Create Table with formattings (e.g. width=50%, bg-color=blue, headers=first row)
2. Select (all cells) of the table
3. Copy (STRG + C)
4. Paste (STRG + V)
5. Open table properties of the pasted table

Result: Table looses formattings (width, bg-color, headers)

Expected: All table formattings are copied properly

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

If an empty String is supplied as fileName the description tells: "If provided with a empty string, will implicitly indicates that path argument is already the full path."

The implementation does test with if (!fileName) which also matches an empty string.

I ran into this problem when trying to get ckeditor-4.4.5 to work in an jsf-enabled application where the path returned by getUrl is for example: styles.js?ln=ckeditor/ckeditor-4.4.5. AddExternal takes ckeditor-4.4.5 as the filename instead of using the already full path provided. Changing the call in styles.js from:

CKEDITOR.stylesSet.addExternal(styleSetName, externalPath ? partsStylesSet.slice(1).join(':') : CKEDITOR.getUrl('styles.js'), '');

to

CKEDITOR.stylesSet.addExternal(styleSetName, externalPath ? partsStylesSet.slice(1).join(':') : CKEDITOR.getUrl('styles.js'), ' '); 

with one space provided as the filename fixed the problem for me.

The test should be something like if(fileName ===undefined || fileName === null), but I am not a javascript developer.

Based on #12323.

Open editor with following content:

<ul>
  <li>one</li>
  <li>two</li>
</ul>
<p>hello</p>

2. Select whole list.
3. Delete list by pressing backspace.
4. Click on line with "hello"

Result: text will jump up to first line.

The textarea used to input the Tex code should have spell checking disabled by specifying spellcheck="false" since spell checking makes absolutely no sense there.

This is especially annoying in Internet Explorer 11 which seems to fix words automatically, for example changing "\binom" to "\Binom", thus breaking the code.

1. Open replacebycode sample.
2. Turn the first header into ul list.
3. Select the text in created list item and apply any inline style.
4. Try adding block before the list item.

Error:

  'null' is null or not an object  plugin.js, line 533 character 3

From magicline plugin.

In Firefox on Android, if you press enter at the end of a paragraph, the cursor skips down to a new line briefly, but then jumps back up. It is not possible to cursor down. You can tap a touchscreen where the next paragraph would be entered to move there. Problem occurs on your demo site, and in our local copy of 4.4.5.

Test platform: Android 28 or 33 on Nexus 10, Android 4.3.

This seems similar to ticket #12423.

Current behaviour: Insert a table and open cell properties layer. Type 70 for width click OK and the cell will become 70 px. Then open the layer again and change the measure unit to % and click OK -> nothing happens (bug) . Open the layer again and px are prefilled in the dropdown instead of % . Edit the input to 71 for example and the new cell width is fired.

Expected: when changing the the measure unit without editing the value, and clicking OK then the new unit to be applied.

Following on from the update to ​`getAscendant` should hasAscendant have the same parameter pattern?

1. Open sample page
2. Start typing, e.g. abc
3. Observe elements path bar

Actual result: span element gets created on each key press as checkElementMatch return FALSE

Expected result: span element gets created only once on the first key press

This works as expected in FF & Chrome

If user drop a big image it should not break paragraph.

Until upload is done image alignment of the images should not be possible because it ends up with the wrong content if user user image2.

Tested in Blink.

Issue 1:

1. Insert below code into editor

   <div>video s^tarts<video src="some.mp3"></video>ends here</div>
   

2. Put cursor where mark ^ is
3. Start pressing delete

Result: Once you have reached 'S' before video tag. The letter s and video gets removed. This issue is specific to CKEditor.

Issue2:

1. Insert below code into editor

   <div>video s^tarts<video src="some.mp3"></video></div>
   

2. Try putting cursor behind video.

Result: If video element is last element in editor there is no possibility to move cursor behind it. Reproducible also in native contenteditable.

Issue 3: It is not possible to select video tag in editor in Blink, Webkit and FF. If you click on video, cursor stays somewhere in the text. This is probably why element's path also doesn't show that video is selected.
If you try to select video with mouse (selecting element from left to right), you will get JS error: Permission denied to access property "files"

Issue 4: If you insert video tag like the one in comment:5 and start clicking next to it, you will get JE error:
Permission denied to access property "nodeType"

We have two solutions here: try providing support for native tag or avoid problems and choose known stable solution like the one we have already chosen for Flash or Ifame plugins which is Place Holders.

There is something wrong with meta-tags protection. When I open the docprops window, then keywords-, description-, autor- and copyright-fields are empty. If I remove /<meta[\s\S]*?\/?>/gi from function protectSource in file htmldataprocessor.js, it shows the content of the meta-tags.

Reproduced on Safari, Chrome and Firefox. I haven't checked IE.

1. Clear contents.
2. Type abcd.
3. Bold "c".
4. Set the caret before "c" in a way that the style won't be active (on FF you must move caret further left and then go back right using arrow keys).
5. Press the bold button and type "x".

Result: <p>ab<strong>x</strong><strong>c</strong>d</p>

1. Open any sample.
2. Clean the contents.
3. Press the bold button and type something.
4. Press enter multiple times. Notice that the bold style is preserved.
5. Start pressing up arrow or clicking in the empty paragraphs.
6. Notice that bold is gone.
7. Check the DOM - strong elements are still there.

There are two solutions possible:

1. Put bogus <br> inside empty inline elements. Then, I think that browsers will place the caret inside empty blocks by themselves.
2. Handle this on keyup and mouseup events. Check whether collapsed selection was placed next to empty inline element in an empty line and fix the selection.

BTW. Note that pressing the bold button again after navigating to the empty line will create another strong tag. This is due to #12633.

It seems that if I lock the UndoManager for snapshots, keyboard presses will still render undo button to indicate that undo steps are available.

1. Open any sample with CKEditor. (i.e. samples/replacebyclass.html)
2. Go to JavaScript console, and enter following code:

CKEDITOR.instances.editor1.fire( 'lockSnapshot', { dontUpdate: true } );
CKEDITOR.instances.editor1.fire( 'lockSnapshot', { dontUpdate: true } );

3. That should result with UndoManager lock counter being increased to 2, confirm that by evaluating:

CKEDITOR.instances.editor1.undoManager.locked.level

4. Type anything in the editable.

Expected result:
No snapshot should be created, undo button should be off/unavailable.

Current result:
Undo button is enabled.

Additional info:

1. Good news is that it seems not to be recent regression, as I've checked 4.3.0 and the same error occurs there.
2. Commands do cares about UndoManager being locked, because if you'll perform bold or any other command it will not record snapshot.
3. Snapshots are not really recorded, you can check that by evaluating CKEDITOR.instances.editor1.undoManager.snapshots.length

When you copy and paste a relative url in a contentEditable field, it becomes an absolute path (in some browsers?). CKEditor does some processing to fix this. When you enable the BBCode plugin, nothing changes and the url stays absolute.

Steps to reproduce:

1. Make a relative link (Link protocol: <other>, URL: 'test.html'
2. Copy and Paste that link inside the editor
3. Check the source

The same works perfect without BBCode enabled.

Tried in Chrome 38 and FF 33.

In CK demo paste this source code in the source area of the CK editor:

<div style="background:#eee;border:1px solid #ccc;padding:5px 10px;">AAAA</div>

<div style="background:#AAA;border:3px solid #ccc;padding:5px 10px;">BBBB</div>

as the first row is the style "Special container" and the second is the same style with modified color and border. Go to the end of the "AAAA" string and click "Del". Then "BBBB" is merged into the same paragraph, but the paragraph gets the style of "BBBB" instead of "AAAA".

If there is more than one paragraph style in the style combo with surrounding <div></div> the bug is present, but as the the demo such second style lacks, typing it in the source area gives us the same effect.

Only FF. Chrome and IE seem to work correctly - they take the style from the "AAAA" text.

Let's have the following HTML:

<div>111<br></div>
<div>222 <br></div>

This we receive as we use divs for paragraphs and using magicline after 111. After 222 we have whitespace, it is not &nbsp; for FF. We select 222 (only 2s without the interval behind) and copy (CTRL+C) and then in the clipboard we have '222 '.

Steps to reproduce on the demo:

1. Place the following HTML on empty CK area with firebug. Using source button in the demo clears the divs, so use firebug.
2. Select the 222 text without the interval and make CTRL+C.
3. Place the cursor among 111 and CTRL+V. The result is 1222 11.

The bug reproduces for the most of the cases, rarely it will work correct, even though on the demo we did not faced correct behaviour.

I've got a problem with the CKBuilder.

The builder goes somewhere too deep when looking for icons. I use it in ​https://github.com/Reinmar/kuma/tree/ckeditor-update and it enters this directory: ​https://github.com/Reinmar/ckeditor-descriptionlist/tree/master/dev ("ckeditor-descriptionlist" is a submodule of the "kuma" repository).

It looks like everything works after building, so it's not critical but it would be safe to have this fixed.

Logs:

Generating plugins sprite image
WARNING: cowardly refused to add an image to a sprite because it's too big: /www/kuma/media/js/libs/ckeditor/source/ckeditor/plugins/descriptionlist/dev/ckeditor/skins/kama/icons/icons.png
WARNING: cowardly refused to add an image to a sprite because it's too big: /www/kuma/media/js/libs/ckeditor/source/ckeditor/plugins/descriptionlist/dev/ckeditor/skins/kama/icons/icons.png
Building ckeditor.js
Minifying ckeditor.js
Created ckeditor.js (503KB)
    Time taken.....: 6.877seconds
Building skins
WARNING: cowardly refused to add an image to a sprite because it's too big: /www/kuma/media/js/libs/ckeditor/source/ckeditor/plugins/descriptionlist/dev/ckeditor/skins/kama/icons/icons.png
WARNING: cowardly refused to add an image to a sprite because it's too big: /www/kuma/media/js/libs/ckeditor/source/ckeditor/plugins/descriptionlist/dev/ckeditor/skins/kama/icons/icons.png
    Time taken.....: 4.308seconds

The GCC does not say where the WARNING is. It just says it's in en.js, but there are dozens of en.js files.

Logs:

com.google.javascript.jscomp.LoggerErrorManager println
WARNING: en.js:5: WARNING - Parse error. Internet Explorer has a non-standard intepretation of trailing commas. Arrays will have the wrong length and objects will not parse at all.
} );
 ^

Once Paste from Word button is used, after that, even if we use Ctrl+V with a content in clipboard that is copied somewhere in the editor, then the specific Paste from Word filtering/processing is executed.

I see in the paste from word plugin code that there is flag "forceFromWord", that actually is never set to 0. There is event handler function resetFromWord that set the flag to 0, but it is not attached to any event. I can see that in ver.3.6.5 this handler has been attached to 'afterPaste' event and this misbehaviour is not reproduced.

While working on #12621 I noticed that ​this line accepts cases in which we don't need a filler char.

One of them is: <p><br>^<br></p>, however, the comment says that it also creates the filler char in empty paragraph, what doesn't make sense at all, because empty blocks should be filled with the bogus <br> and then the filler char is not necessary any more.

The line (as well as comment and referred ticket in which this line has not been added) is so vague that it should be carefully checked.

The only scenario which it seems that it should accept is an empty inline element.

Tested with ​http://ckeditor.com/demo (which reports v4.4.5) using latest Chrome.

1. Clear editor contents.
2. Add some online image using dialog (Be sure to preload image in dialog).
3. Type some text - I typed foo.
4. Execute undo command.
5. Execute redo command.

Actual result: Caret position is right after image but should be where it was before executing undo command.

Problem: Native getSelection().getRanges()[0] returns wrong offset which is 0 but should be 3. And this wrong range is saved in snapshot before executing undo command.

I checked already whether selection is changed somehow by CKEditor code by simply adding onselectionchange listener. But it's not.

Case to verify

We think that the TC reported in ​http://dev.ckeditor.com/ticket/12515#comment:14 is related to this ticket and should be verified together with it.

In most places names are formatted like "Language Direction", "Advisory Title", "Split Cell Horizontally". However, some labels are not following this standard - e.g. in the table dialog there's "Border size" and "First column", in the flash dialog there's "Window mode", etc.

This should be unified across the entire editor UI. We also should have this standard written down somewhere (may be a part of code style documentation). Especially that it's not obvious when we write all words capitalised or not. I guess the differentiation is made based on whether this text is a sentence or a label (e.g. error messages are sentences).

When copying multi-line text where each line starts with double byte white space(s) from Firefox and pasting into a ckeditor text field, the double byte white spaces are all dropped.

Steps to reproduce:

1. create a html file with the following content:

   <html><title></title><body>
   &#12288;1<br>
   &#12288;&#12288;2<br>
   &#12288;&#12288;&#12288;3
   </body></html>
   

2. Open the file in firefox and copy all 3 lines.
3. Paste into a ckeditor text field (I'm currently using ​http://ckeditor.com/demo#inline for testing)

Actual behavior:
All double byte white spaces are dropped.

Expected behavior:
They should be retained.

Additional information:
If the same html file is opened in Chrome and copying happens from a Chrome browser, pasting into ckeditor text field succeeds as expected.

Copying a single whitespace and the pasting it several times again has not effect.

• Steps to reproduce:

1. Open a ckeditor text field and put

   x x
   

into it.

2. Copy the whitespace (without the 'x')
3. Paste the whitespace 5 times

• Actual output:

1 whitespaces

• Expected output:

1 whitespaces

• Additional information:

Copying single whitespace in Chrome and Internet Explorer works fine. In firefox it also works if one copies 2 or more whitespaces.

Reproducing this but work also while using double byte whitespace instead of single byte whitespace.

We are using a MindTouch implementation of CKEditor.

Follow these steps to reproduce the issue:

1. Open the latest version of Google Chrome
2. Create a new page
3. Type three words into the header
4. Highlight the words and set them as H1
5. Type five words below your new header, making sure they are plain text
6. Triple click the middle word in the header to highlight the whole line
7. Press backspace
8. Notice the plaintext below has now inherited the H1 styling

This does not happen in IE9.

JAWS user may want to access the toolbar controls using button list (INSERT F5) and select a button (e.g. bold button) from the list and then use space to trigger the action. However, I could not trigger any button action in this way. The workaround is to use “B” key to iterate through the button list and then enter the space key to trigger the action. The issue can be reproduce in the last night build sample CKEditor page. ​http://nightly.ckeditor.com/14-11-17-07-09/standard/samples/replacebycode.html

Reproduced on demo and nightly build on IE11 on Windows 8.1

Steps to reproduce:

1. Apply some font styling (font family, size, colour).
2. Type a line and create a new line by pressing enter
3. Click the beginning of the new line to position the cursor there. (Optionally, reposition the cursor elsewhere first).
4. Begin typing again

Behaviour:

Expected: The text styling on the new line should be the same as that on the previous line

Actual: The style has reset to the editor's default

In #12403 we introduced a workaround for the missing feature of the style system. It should be moved to the styles system.

Example use case

1. Open editor and clear it's content.
2. Type some text: abcdefg
3. Put caret here: ab^cdefg
4. Select font size: 72
5. Put caret somewhere else: abcd^efg
6. Select font size: 24

As you can see cursor fit 72 but we don't have any 72 text. That's because empty span hasn't been removed.

Since it's affect only visual part of editor (empty elements are removed on save). We might consider using CSS3 :empty pseudo selector:

span:empty {
  display: none;
}

But it's more workaround rather sultion, and it's not fully supported by browsers and it's not bulletproof.

There are two red tests in ​http://tests.ckeditor.dev:1030/tests/plugins/font/font

Tested on Safari 7.1 and Safari 8.

Note: tests were marked as regressions.

Update: during the investigation one of these issues turned out to be a ​bug in Webkit. The other issue was fixed in our tests tools.

Other scenario:

1. Clear editor contents.
2. Change font size to 72.
3. Type 'foo'.
4. Change font size to 20.
5. Type 'bar'.
6. Press enter.
7. Type 'ban'.
8. Undo.
9. Undo.

Result: 'bar' was not removed, instead cursor moved between 'foo' and 'bar'.

Might be related: #12658, #12403.

Since: 4.0 (fine in 3.6.6).

Tested on Chrome.

1. Press new page button to clear content.
2. Insert horizontal line using button.
3. Press backspace.

Result: horizontal line was not removed, but the paragraph was removed instead and I can write directly in the body now. Also it is not possible to remove that line using backspace.

Since 4.0, was fine in 3.6.6.

Also works fine on Chrome.

1. Open any editor (classic or inline).
2. Drag and drop any image (image1): "Apollo" or smile.

Result: Cannot move cursor using keyboard. Even if I move cursor to the other place with a mouse I am still not able to move it with a keyboard arrows.

Looks like browser regression.

Checked with CKE 4.4.6, 4.0.0 and 3.6.6.

Tested with Firefox 33.1.1 on Windows 7.

On Chrome everything is fine.

​http://tests.ckeditor.dev:1030/tests/core/selection/manual/selectionafterfocusing

Expected: Selection in editor 1: h1

Actual: Selection in editor 1: p

Tested on iPad Safari, Chorme and Firefox.

Edit:
Image2 resize feature could have limiter which limits resizing image to:

1. specified width (perhaps also height) in pixels.
2. body (for classic editor) or editable element (for inline editor) width (perhaps height as well). I'm not sure whether size has to be specified or will be taken from computed styles (but what if body size changes in the meantime?)

image2 let you enlarge the picture beyond the editor limits so there is a horizontal-scroll if the image is too big

This is how HTML/CSS works. You can set overflow:hidden; for body element if you don't want to see scrolls. This is not a bug so I have reedited you original report.

1. Open sample "Basic usage of the API".
2. Click "focus" button. (caret is at the beginning - as expected).
3. Click "Execute bold command" button once or twice.

Actual result: Caret is now at the end of the first word.

I'd like there to be another enter key mode which matches people's expectation on how paragraphs and new lines are created, based on how most people use a textarea.

The rule would be:

• Two new lines = P element
• One new line = BR element

We have made a fix in #9284 but now users can't use tabletools if they don't want to use contextmenu plugin.

We could make tabletools available from toolbar but first we need to fix: ​http://dev.ckeditor.com/ticket/7903.

My mistake, here is the correct way to reproduce:

1- Use Chrome 39.0.2171.71 m (although the bug also occurs in Firefox, the present procedure only works in Chrome, I don't know why).

2- Go to the official Shared Space demo: ​http://ckeditor.com/ckeditor_4.3_beta/samples/plugins/sharedspace/sharedspace.html

3- In Chrome's console, type: for (var i in CKEDITOR.instances) CKEDITOR.instances[i].setReadOnly(true); ==> All buttons are now disabled.

4- Click anywhere on the shared toolbar. ==> Three buttons are now enabled: "Paste", "Paste as plain text" and "Paste from Word".

Currently, "menu" plugin skips menu items, associated with commands, having disabled state. This behavior is good for context menus. But "menu" plugin is "abstract", it's also used for toolbar menus, where this behavior is not desired.

See demo: ​http://jsfiddle.net/danya_postfactum/gwragLhw/ See table tools button. It should have "Delete table" and "Table properties". But these items are displayed when cursor in table context only.

It's easy to fix, because this feature is not used, except "table" and "clipboard" plugins. Other plugins just do not add items to context menu for inappropriate contexts.

I'll send patch now.

While working on ticket:11982 I found out that ​this code might be error prone. Based on this ​fix. When I commented lines which might be risky I found out that all tests pass. Few things need to be done:

1. Tests have to be written.
2. We should find in which use cases there might be an errors (mostly when there is one li in list).
3. Eventually fixes should be applied.

Steps to reproduce:

1. Insert numbered list and insert a table in it

2.Place a cursor after the table, and hit ENTER

Expected: new numbered list item should be added Actual: the previous list item with the table is deleted.

Issue happens in all browsers

Numbered bulleted list - no choices for types of lists and no differentiation (e.g. uses 1,2,3 for every level) at different levels. They're exposed for the edit case, but not in the creation case.

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.

The dialog resize feature would be much more useful on the image properties dialog if the image preview would resize as well as the URL and Alt input fields, see attached image for example.

Almost everywhere classes that start with cke_ are used by CKEditor to style various elements of UI. The colordialog plugin does not follow this scheme and is using 'ColorCell' instead.

Steps to Reproduce

1. Open the editor full featured demo page
2. Paste in this test text:

   test` test~ test! test@ test# test$ test% test^ test& test* test( test) test- test_ test= test+ test[ test{ test] test} test\ test| test; test: test' test" test, test< test. test> test/ test?
   

3. Open the find dialog
4. Enter test as the search term
5. Check the Match whole word checkbox
6. Click find repeatedly

Expected Behavior

I don't think there is any consensus to exactly which characters should or should not delimit words but the main characters we are concerned with are parentheses (), square brackets [], and the slash / which are used often to enclose or connect words but without making them compound words with the other content around the symbol.

Word 2013 finds every instance of the word in this test with Find whole words only checked, Internet Explorer finds all but the one next to a single quote '

Actual Behavior

Only the instances of test that are adjacent to quotes and common sentence separator characters are found.

1. Open a sample with ACF disabled (e.g. the magicline sample).

2. Paste the following in source mode:

<table border="0" cellpadding="0" cellspacing="0" style="width:100%">
  <tbody>
    <tr>
      <td style="color: #5f2351; font-size: 18pt;">
        Hello &amp; welcome to K-talk
      </td>
    </tr>
  </tbody>
</table>

3. Switch to WYSIWYG mode.

4. Copy "Test paste" string from some plain text editor (e.g. Notepad on Windows)

5. Place the cursor at the end of the text and press the keyboard shortcut to paste (CTRL + V).

6. The result is (wrong):

   <table border="0" cellpadding="0" cellspacing="0" style="width:100%">
     <tbody>
       <tr>
         <td style="color: #5f2351; font-size: 18pt;">
           <font color="#666666">
             <span style="font-size:10px">
               Hello &amp; welcome to K-talk
             </span>
           </font>
           Test paste
         </td>
       </tr>
     </tbody>
   </table>
   

7. However, if you paste the same content using the "Paste" button in CKEditor, the result is different (correct!):

   <table border="0" cellpadding="0" cellspacing="0" style="width:100%">
     <tbody>
       <tr>
         <td style="color: #5f2351; font-size: 18pt;">
           Hello &amp; welcome to K-talkTest paste
         </td>
       </tr>
     </tbody>
   </table>
   

Confirmed on Google Chrome (Win, Linux, Mac), happens in CKEditor 4.0 - 4.4.6. Works fine on CKEditor 3.6.6.2 and on plain contenteditable.

I couldn't find any other markup different than tables that would cause similar issues.

When using jQuery UI, there are sometimes issues when CKEditor is instantiated inside a jQuery UI modal dialog. Typically, the CKEditor dialogs become read-only.

This is explained here: ​http://bugs.jqueryui.com/ticket/9087

It would be very helpful if jQuery UI was detected in the jQuery Adaptor (typeof jQuery.ui != 'undefined') and the fix for CKEditor instances in modal dialogs (from the above ticket reference) was executed in that case. I do not expect the JQuery UI developers to implement something specific for CKEditor, so I am hoping that you may be open to adding some variation of this in the jQuery adaptor.

Hi, i have a problem in IE 11 with object stylied with sizes:

<div style="width: 903px; height: 210px;">test div</div>

Select borders are over editor sizes. How can i hide this or use css maybe?

This is an extension of ticket #12132 ​https://dev.ckeditor.com/ticket/12132
The image dialog still has some ACF issues.

Expected behaviour:

If you disallow image styles, but still allow their related element attributes, the image dialog should force the usage of the attributes.

Eg: this code

<img style="width:30px; height:40px; float:left;">

should become

<img width="30" height="40" align="left">

What actually happens:

The image dialog ignores ACF and keeps the styles at first. The ACF rules are only applied after you switch to source code view.

How to reproduce:

1. set this configuration

// Allow all elements/attributes/styles/classes by default
config.allowedContent = {
    $1: {
        elements: CKEDITOR.dtd,
        attributes: true,
        styles: true,
        classes: true
    }
};
// Then disallow some styles
config.disallowedContent = 'img{width,height,float}';
// Or all of them
//config.disallowedContent = 'img{*}';

2. insert an image with width/height/align set.

3. inspect the image element - it contains the style attribute.

4. switch to source code view - the style attribute is gone.

The UI for dragging & dropping widgets is consistent across web browsers and quite intuitive.

It would be great if the same was possible for tables. Right not D&D is not available in all browsers: for example in Firefox "selecting" the whole table and dragging it into a different place results in an empty copy of a table being left in the original place. Also the selection of a table in order to drag & drop it is cumbersome in some browsers.

Found in Chrome, confirmed also on Firefox.

1. Create a table
2. Insert a widget (e.g. Enhanced Image) in a table cell (note: it works only in CKEditor 4.4.1+ #11798)
3. See that below widget an empty paragraph is created. If this additional space is disturbing for somebody, one cannot remove it.

This issue can also be reproduced directly in body: ​http://stackoverflow.com/questions/30262191/ckeditor-how-to-delete-empty-paragraphs-before-and-between-widgets

To reproduce try this code:

<table border="1" cellpadding="1" cellspacing="1" style="width:500px">
	<tbody>
		<tr>
			<td>&nbsp;</td>
			<td>
			<figure class="image"><img alt="dfgdfg" height="480" src="assets/image1.jpg" width="377" />
			<figcaption>Caption</figcaption>
			</figure>

			<p>&nbsp;</p>
			</td>
		</tr>
		<tr>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
		</tr>
	</tbody>
</table>

There is one interesting method to actually remove the element. But this is so counter-intuitive that it should not be considered as a correct solution.

1. Put the cursor in the <p> element that you want to removed

2. Select p in elements path (see that additional br showed up in the elements path automatically)

3. Press Backspace. Now the paragraph is gone (although slightly different visual result is in Chrome and Firefox).

Right not widgets use lineutils to handle drag and drop. This is causing some limitations on how drag&drop can be used. For example it is impossible to drag the enhanced image with a caption across table cells.

Use the following code:

<p>test</p>

<ul>
	<li>test
	<ul>
		<li>test</li>
	</ul>
	</li>
</ul>

Put the cursor at the start of the first list item and hit backspace. The item won't be removed, cursor will be moved at the end of the previous paragraph.

Javascript error in IE9-11:

• Create new table on CKEditor area;
• Enter some table caption using "Table Properties" dialog;
• Press "Ok" button on table properties dialog;
• Set mouse pointer on entered caption's text value;
• Click right mouse button (at the entered caption) and select "Table Properties" from context menu;
• Edit table caption value and click "Ok";

As a result you will receive javascript error: SCRIPT5022: IndexSizeError ckeditor.js, line 407 character 528

The toolbar based interface gets out of hand quickly as new plug-ins are added. I tend to think all the icons can get very "busy" very quickly and contribute to information overload on the part of end users.

I think that some sort of overhaul of the toolbar based interface will be warranted in the future.

Some possible ideas...

(1) Implement/support icon/button pods, groups of configurable, related hidden buttons in an overlay that are displayed when a displayed toolbar button is clicked. The overlay could have a title that describes the grouping.

(2) Support some sort of configurable drop down menus as a configurable alternative to icons for the toolbar. Again, the purpose is to enable end developers to move some icons off screen while still having them accessible. I get that drop downs are supported for plug-ins, but why can't I just configure CKE to put a group of toolbar icons in a drop-down menu to take up less toolbar space?

(3) Support some sort of tabbed toolbar groupings as a configurable alternative. Thus, the top level groupings could correspond to tabs that provide high-level groupings of icons.

With all of the above approaches, the general idea is to make sure that the most used toolbar icons are readily available, while configuring less frequently used icons as somehow temporarily hidden, yet still having them be accessible.

Granted, I can fiddle around with changing toolbars, but that is kind of a show it ("it" being an icon/button) and access it, or don't show it and don't access it approach. What I am suggesting, is more of a configurable middle approach--don't show an icon/button, but still have it be available via an overlay, drop-down, or tab selection.

Hi.

It could be useful to allow users to copy one selected cell into all the selected cells. In this scenario all the selected cells should contain the same content as the source cell after the paste command.

I have modified the editable.js file to support this feature.

I hope you will find this feature useful.

1. Open replacebycode sample.
2. Set your system language to Japanese Hiragana.
3. Type 2-5 letters and press enter to commit composition.
4. Repeat the above few times.
5. Press CTRL+Z (not the undo button).
6. The changes were undid, but the redo button is disabled.

Reproduced on FF and Chrome. This issue is a little bit random - I think that order in which the CTRL and Z keys are released matters. In my case I was first releasing Z and then CTRL.

In ​http://dev.ckeditor.com/ticket/12391#comment:4 Artur suggested that there may be a change fired. I'm rather thinking that keyup causes the onTypingStart function to be executed.

Related issues: #12391, #12597.

When i came across documentation for ACF-Custom mode, I clicked a link for live demonstration of ACF-Custom mode. But, result is Not Found (404).

No block wrapper after removing table

1. Open any sample with CKEditor. (i.e. samples/replacebyclass.html)
2. Remove the table by right-click / "Delete Table"
3. Type text "foo"

Expected result:
Caret is not within any paragraph, therefore foo gets typed directly into a body.

Current result:
Caret should be put innto some block wrapper.

Additional info:

1. Doesn't seem to be recent regression, checked 4.3.0 and it's also reproducible there.

I've pasted the code below so you can see what I'm doing to strip HTML comments from the HTML code. The HTML comments get effectively stripped out but empty script tags (<script src="..."></script>) get stripped out too:

CKEDITOR.on('instanceReady', function(ev) {
  // Filter rules to apply on output
  // Node properties & methods: http://docs.ckeditor.com/#!/api/CKEDITOR.htmlParser.element-property-attributes
  ev.editor.dataProcessor.htmlFilter.addRules({
    comment: function() {
      // Remove HTML comments
      return false;
    },
    elements: {
      script: function(node) {
        // Remove language and script attributes from script tags
        'language' in node.attributes && delete node.attributes.language;
        'type' in node.attributes && delete node.attributes.type;
      }
    }
  });
});

I fixed it just by commenting out the "comment" rule in the htmlFilter. A bit weird :S

Page crashed when typing multi-byte characters( Japanese/Chinese in my test ) after hitting enter key before image. Happened on iOS 8 safari.

Step to reproduce:

1.Make caret right before an image, then hit enter key.

2.Try to input multi-byte characters.

Expected Results:

Multi-byte characters are normally input.

Actual Results:

Page crashed and reloaded with message said: "A problem occurred with this webpage so it was reloaded"

Toggling bulleted list inserts unwanted line breaks when enterMode is configured as CKEDITOR.ENTER_BR

Please see attachment.

Because Firefox does not support custom data types properly during copy/cut/paste we do not bind copy/cut and paste events. Wherefore all paste events are recognize as external and user is not able to pass data from copy/cut to paste using dataTransfer facade (copy/cut dataTransfer object and paste dataTransfer object are 2 separate objects instead of one).

We can improve it. On Firefox we handle selected data manually so we could add special <meta> tag to the data to pass the information about the source editor and bind copy/cut with paste.

On IE are 2 problems with binding copy/cut and paste events:

• there is no support to custom data type,
• any access to clipboadData displays warning dialog to user, which we want to avoid.

Because of these problems on IE we do not bind copy/cut and paste events. Wherefore all paste events are recognize as external and user is not able to pass data from copy/cut to paste using dataTransfer facade (copy/cut dataTransfer object and paste dataTransfer object are 2 separate objects instead of one).

Fortunately in many cases we are able to guess the connection between copy/cut and paste events. On the one hand we can read selected HTML during copy/cut, on the other we can get pasted HTML from the paste event. Of course browser can modify that HTML structure, but the text should be the same. On paste we could remove all HTML tags from cut/copied and pasted HTML, remove all white characters and compare remaining text if it is longer then X characters (e.g. 10). This way we could bind most cases.

We could also handle some most popular cases with only HTML. For example if user copy/cut and paste single image we can read and compare both image source and alt and, if they are the same, bind events. Similarly we could check single widgets. We could also compare both HTML data. In some cases they may be the same.

Of course some cases will not be covered: if user cut and paste only HTML data (without any text) which is hard to compare, then the paste will be still recognized as external, but it means it will work as good/bad as it works now.

Type is required attribute of <style> tag according to ​http://www.w3.org/TR/html401/present/styles.html#style-group

But CKEDITOR generates following

<style>.cke{visibility:hidden;}</style>

There shall be simple fix - add attribute " type='text/css' " to generated <style> tag. We tried to fix downloaded source code by adding one line into document.js:

  var style = new CKEDITOR.dom.element( 'style', this );
  style.setAttribute('type','text/css'); //added by us
  style.append( new CKEDITOR.dom.text( cssStyleText, this ) );

But it seems it does not work in Internet Explorer 11.

It is causing problems with formal validation of HTML code in IBM internal application.

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;

}

I've been unable to recreate this on the demo site -- the only input[file] elements in core plugins are on image and link plugins -- both of which appear on the third tab. This problem appears only when the input is on the first tab.

When using the inline editor with Chrome -- if a plugin has a file input on the first tab, when the dialog is shown, the file input element will gain focus -- this has the effect of making ckeditor lose focus and the toolbar will be hidden.

After closing the dialog, the cursor selection is still somewhere in the editor, but the toolbar is still hidden. One must click off the editor and back on to get the toolbar to show up again.

I tried this in FireFox 35, IE11 and Chrome 40 -- Chrome was the only one to exhibit the problem. Also, it seems like timing issue -- if I have dev tools open with a breakpoint in the plugin's onShow function and resume, the problem goes away.

Edit:

1. Add attached plugin to editor and use attached sample file.
2. Load sample, click on editor and click on button with no icon.

Result: Dialog with file element loads and toolbar disappears. It is not brought back after closing dialog.

checkDirty() function does not work properly with CodeSnippet and Mathematical plugins in Inline mode.

If there is a codesnippet or a formula in the ckeditor element, CheckDirty() always returns "true" after page has been loaded.

Steps to reproduce:

1. Select any editable element on the page and add codeSnippet or a Formula
2. Save the element and reload the page
3. Execute in JS console:

CKEDITOR.instances.editor_instance.checkDirty()

where editor_instance is id of the element. It will return "True" but it should be "False"

This issue emerges only in Inline mode, not in classic mode.

Software versions:

Ckeditor: 4.4.7 (custom build)

OS: Ubuntu 12.04 x86_64

Browsers: Chrome 40 and Firefox 35 (latest versions at this time)

Edit: Please also see comment:8 because this issue also occurs when you just load the editor (checked in CKEditor 4.5.6 at the time of writing).

In the plugin.js for the "Forms" plugin, the code explicitly defines different allowed contents for different form elements:

allowedContent = {
	checkbox: 'input[type,name,checked]',
	radio: 'input[type,name,checked]',
	textfield: 'input[type,name,value,size,maxlength]',
	textarea: 'textarea[cols,rows,name]',
	select: 'select[name,size,multiple]; option[value,selected]',
	button: 'input[type,name,value]',
	form: 'form[action,name,id,enctype,target,method]',
	hiddenfield: 'input[type,name,value]',
	imagebutton: 'input[type,alt,src]{width,height,border,border-width,border-style,margin,float}'
},

but since "checkbox", "radio", "textfield", "button", "hiddenfield" and "imagebutton" all define their allowed content for the same tag (with the name <input>), what we end up with is actually that the combination of all the allowed contents for all these form elements is allowed for all of them.

For example, even though "checkbox" explicitly lists that the allowed content is only "input[type,name,checked]", it is still possible to add for example the "src" attribute by hand to an <input> tag with type="checkbox" (in source code mode) and it will not be removed, even though it was initially not listed as allowed content.

I guess it is not removed because the "imagebutton" defines "src" as a valid attribute for the <input> tag, and thus *all* <input> tags now allow the "src" attribute, even tags with type="checkbox" where the "src" attribute does not make any sense.

Proposed fix: For the allowed content, instead of the string notation, use the object notation with a match function, like this:

allowedContent = {
	checkbox: {
		input: {
			match: function (element)  { return element.attributes.type == "checkbox"; },
			attributes: "type,name,checked"
		}
	},
	radio: {
		input: {
			match: function (element)  { return element.attributes.type == "radio"; },
			attributes: "type,name,checked"
		}
	},
	textfield: {
		input: {
			match: function (element)  { return element.attributes.type == "text" || element.attributes.type == "email" || element.attributes.type == "password" || element.attributes.type == "search" || element.attributes.type == "tel" || element.attributes.type == "url"; },
			attributes: "type,name,value,size,maxlength"
		}
	},
	textarea: 'textarea[cols,rows,name]',
	select: 'select[name,size,multiple]; option[value,selected]',
	button: {
		input: {
			match: function (element)  { return element.attributes.type == "button" || element.attributes.type == "submit" || element.attributes.type == "reset"; }, // TODO
			attributes: "type,name,value"
		}
	},
	form: 'form[action,name,id,enctype,target,method]',
	hiddenfield: {
		input: {
			match: function (element)  { return element.attributes.type == "hidden"; },
			attributes: "type,name,value"
		}
	},
	imagebutton: {
		input: {
			match: function (element)  { return element.attributes.type == "image"; },
			attributes: "type,alt,src",
			styles: "width,height,border,border-width,border-style,margin,float"
		}
	}
}

The proposal above should be equivalent to the original code, only the added "match" functions should make sure that for each type-variant of the <input> tag, only the actually defined allowed content is applied.

Of course you then may want to revise these individual allowed content definitions, for example for the imagebutton, you may want to allow "name" and "value" too?

We have CKEditor set to use em units for font sizes in our CMS. This is so content is portable.

If you select 1em for the font size then I think that should be equivalent of unsetting any existing font size style, and removing any empty wrapper span.

Currently it just gives an explicit 1em font size.

Edit:
While it is possible to select e.g. font-size 72px and then reset it by unselecting 72px option from same dropdown or it is possible to reset style with Remove Format Button, we may be missing something here:

• Remove Format Button removes all inline styles it finds or all inline styles it has defined. Users may want to remove just the font-size.
• Resetting e.g. font-size with dropdown is only possible for matching styles. If user pastes span with font-size in em then default dropdown won't match anything.
• The default option could first of all target only font-size (if used in font-size dropdown) and remove font-size whether it matches anything in dropdown or not (it could be highlighted when tag contains font-size style).

As you know, one of the worst (notorious) problems about WYSIWYG editors is the style mess made when pasting, or when styling using a pure visual approach. You make a number of efforts to mitigate this: the advanced content filter, paste from word, I think other internal filters, and sensible decisions regarding how to merge and remove HTML nodes. This is all good, but it does not solve the problem well enough in my opinion, especially for the case where users are pasting into an unfiltered editor (unfiltered due to necessary support for arbitrary markup).

I suggest you extend the "Remove Format" plugin to have a context menu. When you right-click at any point in the document it has an item on the context menu to remove any of the inline styles defined above that point.

For example, you paste something in and it has got a line-height there (because the browser extracted it from some CSS class when you did the original 'copy' op). The user can right click, see it there, and remove it. This stops them needing to remove it manually from the HTML view, which frankly is scary when a lot of inline styles are defined. It would be good also to be able to choose to remove a style globally (i.e. remove all line-height defined for any node).

Please consider this. I think it would be a really big improvement to CKEditor.

PART 1, wording of dialog intro text

The issue with browser pasting is a thorny one. I think it would help a bit to tweak the dialogue text to be more concise/accurate.

Before: "Because of your browser security settings, the editor is not able to access your clipboard data directly. You are required to paste it again in this window. Please paste inside the following box using the keyboard (Ctrl/Cmd+V) and hit OK"

After (Windows/Linux): "Because of browser security, the editor is not able to access your clipboard data directly. Paste in the box below using the keyboard (Ctrl+V) and hit OK"

After (Mac): "Because of browser security, the editor is not able to access your clipboard data directly. Paste in the box below using the keyboard (Cmd+V) and hit OK"

I've done 3 things here: 1) Removed reference to 'security settings' as only Firefox ever had such a setting, and it is since removed. It really confuses users, who then look for the settings. 2) Shortened the sentences as much as possible for conciseness, made it fit on fewer lines. 3) Tailored for Windows/Mac. We don't want to get techie giving multiple keypresses to try, and confusing Windows users (what's Cmd?) when this is such a core dialog.

PART 2, make function of paste from Word clearer

Can we make the dialog title for Paste from Word as "Paste from Word (automated cleanup)". Just so that it makes it clear why this is a separate button, as it will confuse users.

It would be much better to just have two paste buttons (plain text, regular). Detect if it is coming from Word via some simple heuristic, and then clean up if the CKEditor config says to do so.

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.