Custom Query

Browsers: Chrome

1. Open editor with empty content or just remove existing one.
2. Set some font size by clicking propper dropdown.
3. Type some text.
4. Try to make selection in the middle for created text.

Actual result: Making selection is impossible.

Note 1: It's possible to make selection from middle to very beginning.

Note 2: After making selection using method from Note 1 and pressing Ctrl key selection is also gone. It might be related.

In Lotus Notes, there's a featured called the Permanent Pen. You can set the style of the pen and when it's selected, you can write with that style anywhere in any document regardless of the document's formatting, where it came from, etc.

​http://www-12.lotus.com/ldd/doc/domino_notes/rnext/help6_client.nsf/b3266a3c17f9bb7085256b870069c0a9/0878ce791468b5b185256c1c0037f06d?OpenDocument

One of our customers find creating a table difficult in CKEditor, and finds the look and feel for the table and the dialog a little bit dated.

We would like a way to make the table look more modern in the editor if possible, and have an alternative to creating table For example, having a new plugin allowing to graphically select how many rows and columns is needed.

I built the Editor without the iframe plugin (guessing that the fallback would be just an inline-div) and did realise that I then require the divarea plugin.

When using the inline editing mode, the editor would work fine. But replace mode would result in the editor being disabled, without so much as a warning. In the code I tried to backtrack the problem but had no such luck. When I noticed that even the sample for textarea replacement did not work, I guessed that I misconfigured the builder somehow...but still did not know that I had to use the divarea plugin instead.

I stumbled upon the solution by accident when googling the issue.

A nice way to solve this would be an error/warning when neither the iframe nor the divarea plugin is used.

Paste below code in source mode:

<ul>
    <li data-title="The UK&#39;s No 1"></li>
</ul>
<p>The UK&#39;s No 1</p>

Switch to wysiwyg mode and back to source:

<ul>
 <li data-title="The UK's No 1">&nbsp;</li>
</ul>
<p>The UK&#39;s No 1</p>

Result: attribute value is has ' instead of '. It seems that entities in attribute values are not encoded.

​http://www.w3.org/TR/html-markup/syntax.html#attr-value-unquoted
​http://www.w3.org/TR/html-markup/syntax.html#syntax-attribute-value
​http://www.w3.org/TR/html-markup/syntax.html#syntax-charref

Problem can be reproduced in every browser from CKEditor 3.0.

1. Open replacebycode sample in IE11.
2. Insert 300x300 table.

Result: page hangs after a while. The table is not inserted.

Problem can be reproduced only in IE11 from CKEditor 4.3

I am developing an iOS app which integrates ckeditor 4.4.4. I just started testing on iOS 8, seems like ckeditor does not work at all. Whenever i have more than 500 words in a document,the following issues occur:

1. Focus keeps on switching between caret current position and top of page. Sometimes caret is also moved to the top of page while i am typing.
2. Touch event does not work when document is long, so i cannot start typing.
3. Cannot scroll my content -- happens randomly.

I have tested on nightly build 4.4.5 also. Issues can be reproduced in that build also. Seems like these are due to toolbar validation because if open my document in read only mode, none of the issues. occur. Any ideas on the fix? In the mean time any way i can disable the toolbar and still work in wysiwyg mode?

When pasting this source code into CKEditor (tested with 4.4.4) in Internet Explorer (tested with IE11):

<div style="background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==')">Foo</div>

It is changed into the following code when switching back to the WYSIWYG view:

<div style="background-image: url(&quot;data:image/png;base64,ivborw0kggoaaaansuheugaaaauaaaafcayaaacnbyblaaaaheleqvqi12p4//8/w38giaxdibke0dhxgljnbaao9txl0y4ohwaaaabjru5erkjggg==&quot;);">Foo</div>

Because data URIs are case-sensitive, the image becomes invalid.

The cause is the semicolon before base64. This part of htmldataprocessor.js contains the bug:

if ( CKEDITOR.env.ie ) {
	// IE outputs style attribute in capital letters. We should convert
	// them back to lower case, while not hurting the values (#5930)
	defaultHtmlFilterRulesForAll.attributes.style = function( value, element ) {
		return value.replace( /(^|;)([^\:]+)/g, function( match ) {
			alert(match);
			return match.toLowerCase();
		} );
	};
}

When i use Replace all feature and close the replace all dialog after that, an exception occurs in IE11.

Environment: OS:Windows 7 x64 Browser: Internet Explorer 11.0.9600.17280 (Update 11.0.12)

Reproducible on demo page: ​http://ckeditor.com/demo#full

Steps:

1. Remove all sample text and images from the CKEditor on the demo page.
2. Type the following text: test text number 1
3. Press Replace button on the toolbar
4. In the Find what field type the following text: number
5. In the Replace with field type the following text: N
6. Press Replace All button
7. Press OK button on the notification Message Box
8. Press close button on the Find and Replace dialog
9. Look in the browser console for the error.

Screen shot is attached.

System hangs when using Image upload on IOS 8 (iPhone, iPad):

Image Uoload Chose File "selected file" Send it to the Server

SYSTEM HANGS !!!!!!

This wad detected in version CKEditor 3.6.2 (revision 7275) used by my application, and HAS BEEN REPRODUCED ON YOUR DEMO KEditor 4.4.4 (Standard) (revision 1ba5105)

If you put from the source mode a link that has no text the editor automatically removes it. This is bad because I am using css to define images to be put instead of the text and the link is something like <a href="..." class="myclass"></a> and in the myclass is defined the actual image to be clicked on.

Steps to reproduce:

1. go to demo page
2. go in source mode
3. replace existing source with <a href="www.google.com"></a>
4. exit the source mode
5. enter again the source mode and you will see that the tag is no there anymore

The best solution I think would be that a config parameter to change this behavior would exist

After #12162 there's one red in ​http://tests.ckeditor.dev:1030/tests/plugins/magicline/widgets on most browsers (all except Chrome).

I found the both last odd and perhaps incorrect, but I need a.nowodzinski's opinion.

For now I commented out both cases in ​git:fb3b497.

Hi,

I'm struggling with a strange bug with the image2 (​http://ckeditor.com/addon/image2, version 4.4.4) plugin. If I insert two widgets with a caption and align the first one left and leave the align of the last one none, the first widgets becomes unselectable.

The problem was reproducible on the demo side ​http://ckeditor.com/demo#widgets

This code should reproduce the problem:

<figure class="image" style="float:left"><img alt="Apollo-CSM-LM" src="http://c.cksource.com/a/1/img/demo/apollo-csm-lm.png" width="200" />
<figcaption>Apollo CMS-LM spacecraft</figcaption>
</figure>

<figure class="image"><img alt="Apollo-CSM-LM" src="http://c.cksource.com/a/1/img/demo/apollo-csm-lm.png" width="200" />
<figcaption>Apollo CMS-LM spacecraft</figcaption>
</figure>

If you inspect the selection wrapper of the widget with none align, it covers the first widget (​http://imgur.com/veQbbwE). Could be a problem with the css float?

I tested it in Chrome (latest) and Firefox (latest) on a Mac (Version 10.8.5)

Thank you for your help!

Browsers: Chrome, FF and IE9+

1. Open editor with following content and selection:

   <ol>
   	<li>hello</li>
   	<li>moto</li>
   	<li><strong>[:D]</strong></li>
   </ol>
   

2. Click "Remove format" button.
3. Press "Ordered List" or "Unordered List" button.

Actual result:

There is an error in console: TypeError: node is null range.js:1724

this.setStart( node.getParent(), node.getIndex() );

1. Open languages samples.
2. Change language to Arabic.
3. Hover over one of the items in the elements path.

There will be "%1 sth".

I looked into the code and lang/ar.js and everything seems to be fine there, so it's worth checking what's going on.

The bug happen with CKEDITOR.ENTER_BR when you enter some words and then add MathJax waiting for the math created and then go to the start of Math press Enter and then press backspace the math is not return back.

1. Open document properties sample
2. Insert below meta tag into page (under title :)). You can also insert doctype but this has no effect on result.

   <meta charset="utf-8" />
   

3. Open document properties dialog and notice that charset it not set in dialog.
4. When you set charset to UTF-8 in dialog, below meta tag is inserted:

   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   

This problem can be reproduced from CKEditor 4.0 beta.

In current version the problem gets worse.

1. Let's say that you have removed HTML5 charset and decided to use HTML4 charset.
2. In current version (latest master) this charset is also not recognized. What is more every time you set utf-8 charset in dialog, new tag gets inserted so you can end up with multiple meta tags inserted into page.

Shouldn't charset meta tag be somehow dependent on doctype or this is something developer/user should know when creating page?

To reproduce the defect:

1. Open any CK Editor sample, switch to High Contrast mode.

2. Enter some text inside editor.

3. Click on Show Blocks button in toolbar

Expected Result: Dotted lines shows around each block level elements like(p, div etc) and corresponding html tag(p, div) displays inside them.

Actual Result: Dotted lines shows around each block level elements like(p, div etc) but corresponding html tag(p, div) is missing in HC mode.

Steps to replicate:
copy below snippet in 'source' mode

<p>Heading:</p> 
 <ol> 
    <li> 
	<ul>
	<li>List 1 Item 1</li>
	<li>List 1 Item 2</li>
	</ul> 
	<div>&nbsp;Sub heading</div>
	<ul>
	<li>List 2 Item 1</li>
	<li>List 2 Item 2</li>
	</ul> 
    </li> 
</ol> 

Repeat the steps below with Firefox, Chrome and IE8:

1. 1st scenario: Select the complete "List 1 Item 1" bullet line and then delete it.
   It works fine with Firefox and Chrome browser, the order of the list get mess up(re-ordered) with IE8 browser.

2. 2nd scenario: Now place the cursor at the very beginning of the "List 1 Item 1" bullet line and then backspace delete
   All Firefox/Chrome/IE8 browsers has this issue where the order of the list get mess up(re-ordered).

Over at ​https://www.drupal.org/node/1993928, we're working on shipping the Language plugin with Drupal 8 core. It will not be enabled by default, but it will be 'available' by default, hence making it simple to meet WCAG2, which is required by many governments.

It's working well in general, except… that the way it handles <span>s is extremely frustrating.

If you write

<p><span dir="ltr" lang="nl">Hallo, wereld!</span></p>

and you have your cursor at the end of that line and press enter (to start a new paragraph) and type something, you'll get:

<p><span dir="ltr" lang="nl">Hallo, wereld!</span></p>
<p><span dir="ltr" lang="nl">foo</span></p>

Where you'd really expect the language span to not be applied to this new paragraph.

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

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.

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.

I have been hassling with ckeditor on iOS for quite a while due to Ticket #12457. Turned out that inline editor does not suffer from all those issues of selection in iOS 7,8. So i moved my code to adapt with inline editor. Now i have observed new issue in selection with inline editor. Here are the steps to reproduce in 'inlinetextarea' sample from ckeditor in iOS 7:

1. select any word.
2. Now click on 'Link' button on the toolbar.
3. Type some URL in the text field and press OK.

Observe link is inserted at some random position (sometimes at last selection point).

Similarly my app has no of modal windows. Each time i open a window, selection is lost in the inline ckeditor, so cannot perform operation on the intended selection. Please suggest a solution to this.

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.

It semms that an extra space is added at the begining of class attribute of tables in the editable.

1. Open any sample with CKEditor. (i.e. samples/replacebyclass.html)
2. Evaluate following code using JavaScript console:

(function() {
	var editor = CKEDITOR.instances.editor1;
	// When data is ready, log the class attribute for first table in editable.
	editor.once( 'dataReady', function() {
		console.log( '"%s"', editor.editable().findOne( 'table' ).getAttribute( 'class' ) );
	} );
	
	editor.setData( '<table><tr><td></td><td>foo</td></tr></table>' );
}());

Expected result:

Following value should be logged:

"cke_show_border"

Current result:

We have a class with an extra space at the beginning.

" cke_show_border"

Additional info:

1. It's caused by the ​showborders plugin.

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

We should include a boolean value returned by the ​scrollIntoView method.

If scroll occurred, then true would be returned, false otherwise.

In addition to that it turned out that there are no tests at all for scrollIntoParent and only one for scrollIntoView.

Rationale:

You might need information if the scrolling really occured.

Logic which determinates if scrolling should happen or not, is a part of scrollIntoParent implementation and is not exposed.

I've got into that thing while working on our side project, where in case of scroll we had to do some extra layout repositioning.

Current workaround:

The shortest workaround would be:

var wnd = issue.element.getWindow(),
	initialYScroll = wnd.getScrollPosition().y,
	scrollOccurred;

issue.element.scrollIntoView();

scrollOccurred = wnd.getScrollPosition().y !== initialYScroll;

Somebody might also use scroll event listener to do that, which is even more ugly.

I belive we should introduce it in next major release, since it's an API change.

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".

If you remove editor container from DOM and then call editor.destroy(), you got exception, because CKEditor assumes frameElement of editable is available. But element.frameElement is null.

Demo: ​http://jsfiddle.net/danya_postfactum/wfy9fgdd/2/

The CKEditor 4 repos should adopt the ​CKEditor Boilerplate project.

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

Let the user enter a list of checkboxes/ radio buttons, that are actionable.

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.

I have a report where I wait for user input before creating a textarea object in jquery and turning it into a CKEditor instance. This works beautifully on IE 10/11, Firefox, Chrome, and Safari on Desktops but when we test on an iPad iOS 8 users have an issue typing into the editor.

When a user starts to type, the entire view scrolls back to the top of the page away from editor. The text still gets entered and after scrolling the page back down the user can see editor with their new text.

Plugins Using: autogrow clipboard colordialog dialog find link pastefromword

I'm hoping since I can't find another post/ticket on this topic it is a configuration or css setting conflicting with CKEditor. Any help would be beneficial.

PS: Some browsers on the iPad only scroll back to top when pressing the space button.

Maintain color of strikethrough and underscore the same as font color of the text when copying from Word into CKEditor.

TC:

• In MS Word, type in “Test font” with font family = Calibri, size = 14px and font color = red and then underscore and strikethrough the words “Test font”.
• Copy from Word and paste the same in CK Editor. The font color remains red as expected but the underscore and strikethrough changes to default black.

Solution: the color of strikethrough (<s>) and underline (<u>) will be maintained, but only if colors, underline, strikethrough are applied to exactly the same selection (portion of text).

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.