Custom Query

We should have a config entry for initial maximize as we have with 'show block' plugin.

As requested, I am sending everything that your developers will need in order to add a button to the toolbar to facilitate embedding Silverlight using CKEditor.

Embedding Silverlight is very similar to embedding Flash. With Flash, the application is packaged in a SWF file. With Silverlight, the application is packaged in an XAP file.

So the new toolbar button will simply need to add some HTML -- it's a lot like embedding Flash.

How to embed Silverlight using HTML: ​http://msdn.microsoft.com/en-us/library/cc189089(VS.95).aspx

A list of all available embed parameters: ​http://msdn.microsoft.com/en-us/library/cc838268(VS.95).aspx

Working example -- a Silverlight Video player: ​http://www.timacheson.com/Blog/2009/sep/halo_3_odst_launches_next_week#silverlightControlHost

HTML code for the example:

<object id="Player" data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="640" height="360">

<param name="source" value="/ClientBin/VideoPlayer.xap" /> <param name="minruntimeversion" value="2.0.31005.0" /> <param name="background" value="#000000" /> <param name="initParams" value="m=​http://www.xbox.com/NR/rdonlyres/D5A8470A-A00C-4EE3-A87E-9A027CC6FFA0/0/vidhalo3odst230lo.asx" /> <a href="​http://go.microsoft.com/fwlink/?LinkId=124807" style="text-decoration: none;"><img src="​http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none" /></a>

</object>

Custom plugins and extensions are able to extend the list of loaded styles in the styles plugin. Unfortunately the styles plugin does not reflect dynamic changes to its list of styles and requires a reload of the whole editor to reflect the new options.

Ideally the editor should provide a way for any plugin to be reloaded without requiring the whole editor to be reloaded. Alternatively, a simpler approach to this problem would be to allow just the styles plugin to reload its data dynamically, through some additional API.

Steps to reproduce:

1. Press "Form" button and create a form (with name and action)

2. Place mouse cursor inside of the form, hit "Selection field" button, size: 2 lines, add two random options.

3. Press "OK" to close the dialog and insert the element

4. Cursor is now placed straight after created element

5. Hit enter, you should see a new empty "Select" element created below the "real" selection field that we have just created.

Confirmed in FF 3.5 and FF 3.0.

This is a minor thing, but just doesn't look nice.

If you want to create a link, select Link Type = "Link to anchor in the text", then the table that is displayed below has width set to 260px an is centered. If you choose "E-mail" or "URL", you'll see that other elements have width set to 100% (or just change tab to "Target", there are also two select elements that are positioned correctly, table width is 100% and there are two cells with width set to 50%).

Perhaps another improvement would be to remove selecting "By Element Id" it there are no anchors with id (it is impossible to set the id of an anchor with CKEditor).

If site content served with contentType="application/xhtml+xml" CKeditor replaces some characters on special symbols.

For example: test

will be replaced in output onto: &curren;es&curren;

i.e. 't' will be replaced on &curren;

The toolbar toggle button can not be given focus when tabbing through the toolbar items. It also does not display any tooltip text when you hover over with the mouse.

go to the demo and click on the image dialog. notice that there is no space between the "Align" label and the selectbox.

to reproduce:
open the "multi-language interface" demo and choose a language that has long caption in the align field (Hebrew or Hungarain for example).
open the image dialog.
open the "align" text box to see all the options. notice that some of them are being amputated.

This is trivial issue but created ticket just as a reminder.

to reproduce

• Open ​CKEditor demo with FireFox
• Click 'International Names' table

CKEditor 3.0.1 is incorrectly wrapping tags with arbitrary <p> tags.

Problem / Steps to reproduction:

1. Switch to HTML mode, type:

<br /><script type="text/javascript">alert('hello');</script>

or

sample text <script type="text/javascript">alert('hello');</script>

2. Switch to WYSIWYG

Expected result (as per XHTML spec):
<script type="text/javascript">alert('hello');</script>

Actual result:
<p><br /><script type="text/javascript">alert('hello');</script></p>

This problem shouldn't / can not be remedied by changing the enter mode, as we want text wrapped in <p>, but not <script> tags

Kind Regards,
Johannes

It would be handy if the resize plug in fired a "resized" event at the end of the resize.

More or less in the dragEndHandler do the following:

function dragEndHandler(evt) {
    CKEDITOR.document.removeListener('mousemove', dragHandler);
    CKEDITOR.document.removeListener('mouseup', dragEndHandler);

    if (editor.document) {
        editor.document.removeListener('mousemove', dragHandler);
        editor.document.removeListener('mouseup', dragEndHandler);
    }
    editor.fire( 'resized' ); // let folks know the resize has finished
}

This would allow clients to persist the size of the editor if they wished to (trying to persist after each individual resize event is too resource intensive).

Can a search functionality be added to the api documentation? That is, it would make developer's life a lot easier when searching/looking for specific methods/properties. Also, could we have more examples?

Thanks, adico

Right now it is possible to create in CKEditor form with enctype set to "multipart/form-data".

So it seems that nothing stops us from adding another button that will allow users to create easily input type "file" with CKEditor?

I'll missing always an Button to insert WMV, AVI, MOV and other MEdiafiles like in the TinyMCE with HTML Tag <object>

Right now CKEditor does not provide almost any advanced features that will let users change rows in a table.

Some things that (I think) should be doable:

• changing background color of selected row
• setting row height
• changing alignment
• changing class/id

It would be nice if the flash dialog could be configured to prompt for width and height if not specified. We have users that plug in the SWF file they get from a web designer and don't set the dimensions. They get confused when nothing shows up on the page.

Similar refactoring should happen to Flash dialog to completely avoid XHTML deprecated attributes in favor of proper inline style with #4246.

There are a few different problems with indented text. Different behaviour is observed depending on the users selection of "Measurement units" under the menu option Tools -> Options -> General Tab in Word.

When Picas is selected:
The indented text is pasted with "margin-left: XXpc;". This works for a single indentation. For multiple indentations on a single line, when "Decrease Indent" is applied once, all the indentation is removed.

When centimetres, millimetres or points is selected:
The indented text is pasted with "margin-left: XXpt;" (points). Alignment of different indentations is inconsistent after altering the indentation level using Increase or Decrease indentation feature due to these functions using pixels.

When inches is selected:
Same behaviour as with Picas except:
When pasting text with a single indentation into IE, no "margin-left" style is applied.
When pasting text with a single indentation into FF, it is not possible to Decrease the indentation.

Style tag content should be left as untouched.

Reproducing Procedures

1. Open any sample page, load editor with the following content:

    <style>
   	span {
   		color: blue
   	}
   </style>
   <p>
   	<span>text</span></p>
   

2. Switch to 'wysiwyg' mode and back to 'source' mode.

• Actual Result:

  <style type="text/css">
  span {
  		color: blue
  	}</style>
  <p>
  	<span>text</span></p>
  

• Expected Result: Output is same as original source.

Environment

Firefox

Reproducing Procedures

1. Open any sample page, load editor with the following content and selection (multiple cells selected):

   <table>
   	<tr>
   		<th>[head1]</th>
   		<th>[head2]</th>
   	</tr>
   	<tr>
   		<td>[cell1]</td>
   		<td>[cell2]</td>
   	</tr>
   </table>
   

2. Click on 'Indent' command;

• Actual Result: Only the first cell (head1) get indented.
• Expected Result: All cells get indented.

FF3: List indentation change relocates caret.

Reproduce

1. Use following content:

   <ol>
   	<li>
   		LI
   		<ol>
   			<li>
   				LI^
   				<ol>
   					<li>
   						LI</li>
   				</ol>
   			</li>
   		</ol>
   	</li>
   </ol>
   

2. Press Decrease Indent button
3. Result is visible on attached screenshot. Wrong caret position is indicated with red line.

Reproduced in FF3 quirks, works fine in FF2. CKEditor 3.0 is also affected.

This is not a bug, but it simply doesn't look nice.

Using the following code in full page mode:

<html>
	<head>
		<title>CKEditor Sample</title>
		<meta content="text/html; charset=utf-8" http-equiv="content-type" />
		<script type="text/javascript" src="script1.js"></script>
		<script type="text/javascript" src="script2.js"></script>
		<link href="/search" rel="search" />
		<link href="my.css" rel="stylesheet" type="text/css" />
	</head>
	<body>
		<p>
			test</p>
	</body>
</html>

it is transformed into:

<html>
	<head>
		<title>CKEditor Sample</title>
		<meta content="text/html; charset=utf-8" http-equiv="content-type" />
<script type="text/javascript" src="script1.js"></script><script type="text/javascript" src="script2.js"></script>		<link href="/search" rel="search" />
		<link href="my.css" rel="stylesheet" type="text/css" />
	</head>
	<body>
		<p>
			test</p>
	</body>
</html>

Note that <script> tags are in one line and in the same line there is also one <link> element.

This bug existed also when the full page mode was not available.

It is quite a common scenario when content of a page is placed inside of a div with some id ("main", "wrapper") and CSS rules are defined for that div.

For IE we're creating "accessibility label" using label and fieldset. Unfortunately, it is possible to accidentally change the style of those elements and make CKEditor looking strange or even unusable.

Steps to reproduce

• take the replacebyclass sample
• in the head section add the following:

  	<style type="text/css">
  	#main fieldset {padding:20px; margin:20px; width:400px}
  	#main legend {padding:40px; margin:40px; width:400px}
  	</style>
  

• put the form element inside of <div id="main">:

  	<div id="main">
  	<form action="sample_posteddata.php" method="post">
  			<p>
  				<label for="editor1">
  					Editor 1:</label><br/>
  				<textarea class="ckeditor" cols="80" id="editor1" name="editor1" rows="10">&lt;p&gt;This is some &lt;strong&gt;sample text&lt;/strong&gt;. You are using &lt;a href="http://ckeditor.com/"&gt;CKEditor&lt;/a&gt;.&lt;/p&gt;</textarea>
  			</p>
  			<p>
  				<input type="submit" value="Submit"/>
  			</p>
  		</form>
  	</div>
  

• save the sample and lauch it in IE
• result: the editing area is broken.

It's not a regression while same thing works well in V2.

Environment

IE8 Strict

Reproducing Procedures

1. Open any page sample, load the editor with the following content and selection.

   	<ol>
   		<li><p>item1^</p></li>
   	</ol>
   

2. Press 'enter' at the end of the paragraph;

• Actual Result: There's an extra line height above the newly created list item.

When maximizing the editor, the text cursor appears when moving the mouse over the text inside the toolbar combos. This does not happen when not maximized (the arrow doesn't change, as expected).

Confirmed with FF3.5 in the Kama skin at least.

1. Create a table with border=0. The table should be visible due to the showborders plugin.
2. Select all (CTRL+A).
3. Click the "Remove Format".

The table borders disappear.

By default, shiftEnterMode is set to ENTER_BR, and Shift+Enter will insert <br> under <li>.

To Reproduce

• Add following settings to config.js.

  config.enterMode = CKEDITOR.ENTER_BR;
  config.shiftEnterMode = CKEDITOR.ENTER_P;
  

• Open sample page.
• Click "Numbered List" or "Bulleted List" button from toolbar.
• Type some text.
• Move caret at the middle of text.
• Press Enter from keyboard.
  • expect: <br> is inserted
  • actual: next <li> is created

Hi,

You can test it right here : ​http://nightly.ckeditor.com/4908/_samples/sharedspaces.html

When you click on the little arrow to collapse the shared toolbar, the editor height changes, as if the toolbar height was still calculated in the editor size.

The More Colors dialog that reappeared in CKEditor 3.1 has 8 black color buttons filling the last slots in the bottom row of color buttons. It would be nice if these "filler" buttons could be overruled by custom color buttons defined in the custom configuration.

While it's already possible to add custom colors to the default color button menu via CKEDITOR.config.colorButton_colors, one or two custom color buttons look out of place there.

I would like to add a couple of colors used in our company style as buttons in the More Colors menu, allowing me to specify the color and its name (i.e. Company green) to use in the title text.

The current behavior for the Print command is printing the contents as we see them in the editor, not as they will be in the final output. So, anchors, flash placeholders and anything else that is editor specific will be visible in the print.
We should change the print plugin to instead print the outputted document (just like preview).

There are some things that should be included in the default stylesSet sample so it's more useful to learn how to use it:

• Styles for the div container: #4973
• How to apply classes

The default stylesheet might need also some adjustments to reflect those classes.

Recreate Bug

Use Firefox (I tested on both Windows FF 3.5.7 and Linux FF 3.5.5) and the ​online demo and perform the following steps.

Setup

1. Click in the editor and remove all content i.e. <CTRL> + <A> then <BKSP>
2. Type or paste in: foo bar baz
3. Double-click bar and make it bold. Notice That FF on Linux selects only the word bar on double-click. Chrome and IE8 on Windows select the word plus one trailing space, which also gets the bold style.

Test 1

1. Place the cursor anywhere in the word baz then move left with the arrow key to the end of the word bar. Notice that the B button is NOT active and the status bar displays only body p.
2. Use the arrow keys to move left then right one character, returning to the same position. Notice that the B button is active and the status bar displays body p strong.
3. Use the arrow keys to move right then left one character, again returning to the same position. Notice that the B button is NOT active and the status bar displays only body p.

This inconsistency is confusing my users and is likely related to the odd behave I will describe next.

Test 2

1. Again, place the cursor to anywhere in the word baz then move left with the arrow key to the end of the word bar.
2. Backspace to the end of the word foo, completely deleting the word bar and the space between foo and bar.
3. Type <space>bar to replace the original text. Notice that the text is bold again. But rather than a STRONG tag we have a SPAN with inline style.

Unless you delete both foo and bar you cannot get rid of the littered inline style. These tests exhibit the same behavior using italic and underline, and indeed my own custom styles. This behavior is not exhibited using Chrome nor IE8. I have tested this in 3.01, 3.02 and 3.1. All exhibit the bug in FF only.

There is a bug with IE in standards mode when trying to click to the right of a control selectable node such as an image.

To replicate Set the HTML to:

<p>
	Line 1<br />
	Line 2<img src="http://www.google.com/intl/en_ALL/images/logo.gif" /></p>

I have attached a patch which fixes this problem. I dont know if it is implemented up to your standards though.

Some things that are bad about my patch are:

• Its using the CK dom range inside selection (seems a bit cyclic)
• You cannot mouse down and drag to select more
  
• I dont really understand why there are multiple selections / ranges so I have just used "getRanges()[0]"
  
• Its using setTimeout() because the selection is not ready before the event
  
• I am using a constant of 20x20 pixels to check the mouse offset - perhaps a character size calculation is needed?

There may be some other ways to fix this. Another idea is that we could insert a whitespace text node / span at the end of the block before the end of the mousedown event.

Cheers,
Scott
​http://www.synergy8.com/

When ckeditor shares a DIV with an object that has a float: left property the editor doesn't render properly.

See the attached HTML file to replicate this issue. Just copy the attached file into your samples directory and view it.

I believe the issue is due to the following CSS:

.cke_skin_kama
{
       display: block;
}

in the mainui.css file. It seems to render correctly if the css is changed to

display: inline-block;

This causes the editor to lose focus and causes the editor to lose focus, scroll somewhere offscreen and remain inaccessible due to the scrollbar having been disabled through javascript. Pressing tab will eventually circle you back around to get the editor back in focus, but not a solution by any means.

First, create a few bullet point lists items with nested lists. Next try to select a nested list and start typing to overwrite the text. Notice how the text continues at the parent list level and the multiple bullet points on the same line. It is really hard to recover from this, without deleting and recreating the lists. It seems to only be an issue in Firefox and IE6,7,8. Looking at the source, it seems that there is an orphaned <ul> tag under an empty <li> tag.

For example, the source below will cause the duplicate bullet points:

<ul>

<li>first level</li> <li>

<ul>

<li>start of 2nd level</li>

</ul>

</li>

</ul>

It is possible to get into this situation using the above steps to highlight and overwrite text.

I quote from the manual : "In-page settings can be passed to any of the editor instance creation functions, namely CKEDITOR.replace and CKEDITOR.appendTo."

​http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Setting_Configurations

I use :

function ckeditorInit() {

    if (editor) /* If we already have an editor, let's destroy it first. */
    editor.destroy(true);
	CKEDITOR.replaceAll( 'rich-text', {
	    customConfig : '',
	    enterMode : CKEDITOR.ENTER_BR,
	    shiftEnterMode : CKEDITOR.ENTER_P, // Paragraphs are now made by pressing shift and enter together
	    skin : 'office2003', editor */
	    toolbar : [
		['Preview', '-', 'Cut','Copy','Paste', 'Find', 'Undo','Redo', '-','SelectAll','RemoveFormat', 'Table','HorizontalRule','PageBreak', 'ShowBlocks', '-', 'Templates', '-', 'Styles','Format', '-', 'Font','FontSize'],
		'/',
		['Bold','Italic','Underline','Strike', 'SpecialChar', 'TextColor', '-','SpellChecker', 'Scayt', '-', 'NumberedList','BulletedList','-','Outdent','Indent','Blockquote', '-', 'JustifyRight','JustifyCenter','JustifyLeft', 'JustifyBlock', '-', 'Link','Unlink','Anchor', '-', 'Image','Flash', 'Smiley', 'BGColor', '-', 'NewPage', '-', 'Source', '-', 'Maximize'],
	    ]
	}); /* End CKEDITOR replaceAll rich-text */


};

window.onload = ckeditorInit;

All the textareas are replaced with ckeditor but the config is ignored.

So, In-page settings cannot be passed to any of the editor instance creation functions. Just some of them and not CKEDITOR.replaceAll.

Please sort this out. It's what most people would expect as "Normal" Behaviour.

Thank you.

I have not found a good way to adjust the alignment of the radio buttons. The radio buttons is outputted as table cells in a single table row, that makes it impossible to use css to display them in an vertical list (Internet Explorer).

It would be great to have the following options for the radio element:

• Vertical or horizontal display of radio buttons
• Whether to display the labels above, below, in front of or behind the radio buttons.

When navigating a context menu with the keyboard, the ARROW-RIGHT executes the selected entry, just like ENTER. It should do nothing, being used just to open an eventual second level menu.

There is no visual behavior for checkboxes in dialogs when tabbing over them. We have the impression that the focus got lost.

JAWS is not reading out the accessibility help legend in dialog, it should be in VPC mode when focus reaches the legend.

Load 'Shared toolbars' sample from latest nightly.

The first two editors editor area overlaps the border of the editor.
If you specify a very small width to the editor (like 200), the width of the editor area will be about 320px (only the border gets the specified size).
(Chrome 5.0.322.2)

If the instance is created replacing a textarea, try to make it match those dimensions by default. If the config has some dimensions set, then of course, use that, but if it's missing, then get the size of the textarea like requested in ​http://cksource.com/forums/viewtopic.php?f=11&t=17682

Text and Table Template uses "float: right" on the table, this then cannot be changed with the table properties dialog.

To reproduce

• Open an empty CKEditor instance and insert 2 page breakes.
  
• SELECT (drug the selection - not by clicking on a page break sign) the 2 page breakes signs (make sure you are not selecting any other thing - including text nodes, this is important).
  
• Insert an element on it (HR for example).

JS error is thrown (getFirst() is empty or not an object).

CKeditor's flash plugin accepts youtube URLs, if they point directly to the flash file (youtube.com/v/XXXXXXXX URLs); youtube's interface gives URLs like youtube.com/watch?v=XXXXXXXX.

This patch does a string replace on the interface so that people can paste youtube page urls.

Supplied code reeks of duct tape, but it gets the job done; I don't have 40 hours to spend learning CKeditor internals (it's already perfect, anyway!)

In api_dialog sample, there is too much space before My Custom Field in the customized link dialog. This may be related to a generic issue that needs investigation.

This behavior is confirmed in all browsers but IE.

1. Load the following HTML:

<p>This is <b>some sample</b> text.</p>

2. Select "This is some".
3. Click the Bold button.

Current results:

<p><strong>This is </strong><b><strong>some</strong> sample</b> text.</p>

Expected results:

<p><strong>This is some</strong><b> sample</b> text.</p>

With IE8 with Compatibility mode:

1. Load the following HTML:

<p>Line 1</p>
<p>Line 2</p>
<p>Line 3</p>
<p>Line 4</p>

2. Select Lines 2 and 3.

3. Click the Div Container button.

4. In the Advanced tab, set the Style field to "border: solid red".

5. Confirm the dialog.

Note that there will be extra (unwanted) space at the top padding of the created div. When moving back and forth to source, that space disappears.

If I put a background image behind my H1 tags in the editor css, that background image shows in the headings when you click the styles drop down in the editor. I'll attach a screenshot to show what I mean.

To reproduce

• Open a new editor and go to Source mode
• Write this text: <blockquote>Text</blockquote> and place the caret somewhere inside it
• Click on the blockquote button

The blockquote is not removed.

To reproduce

• Open a new editor
• Click on the B button and type some text.
• Place the caret in the beginning of the text
• Click again on the B button. Notice that the the button is not unselected.
• Type some text. notice that noe the button is unselected.

When printing the content inside of CKEditor (using the "Print" button), page breaks apart from breaking pages correctly, are also printed.

This is a similar problem to issue with printing tables without a border (#731).

<textareas> are being handled like normal HTML tags, when they should be getting the same treatment as <pre> tags.

I've done a quick look and from what I see, the offending file would be fragment.js: -Line 152: Original: "&& element.name != 'pre'" Possible replacement: " && element.name != 'pre' && element.name != 'textarea'"

-Line 191: Original: "else if ( tagName == 'pre' )"

-Line 332: Original: "if ( currentNode.name == 'pre' )"

That should theoretically fix it. I haven't worked much with it, so this is all untested, but it'd be nice if someone who has more of an idea how to work this could make a proper patch.

Browser: IE8, OS: WinXP

Occurs in demo page ( 'Little Red Riding Hood' )

When you use the up/down arrow keys to navigate through the Text, the caret will stop at the end of the first <p>-Paragraph.

The next step would be to jump into the table on the right.

Same happens at the end of the positioned table back to the second Paragraph, and also on your way back up.

When linking an image tag which is wrapped by span tag(s) the link is placed around the span tag(s) rather than the img tag. Unless the span tag has text inside it as well as the img tag, in this case the img tag will only be linked.

Example html: <a href="​http://www.google.com"><span style="font-size: 11px;"><img alt="wink" src="/ckeditor%202/plugins/smiley/images/wink_smile.gif" title="wink" /></span></a>

Expected HTML: <span style="font-size: 11px;"><a href="​http://www.google.com"><img alt="wink" src="/ckeditor%202/plugins/smiley/images/wink_smile.gif" title="wink" /></a></span>

OS: Mac OS X 10.6.2 Browser: Firefox 3.5.8

I can confirm that the new version fixes the img align= problem. Would it be possible/difficult to add support for replacing the style= with a CSS class for more consistent design (similar to the justifyClasses and indentClasses)? Maybe call it imageAlignClasses...

Like other form elements, a CKEditor instance should provide a way to reset back to the original contents.

And then we can hook the form onReset event to act like other elements ​http://cksource.com/forums/viewtopic.php?p=46129

To reproduce

• Open the demo or a sample in the SVN.
• Insert any form element (e.g. input, select etc.).
• Move the caret to the sides of the element.

in IE, the caret won't move back to the right. in FF, it won't move to both sides.

Related to #4711 but this is weirder: Using IE8 set this source:

<pre>Hello world!
Bla, bla, bla
</pre>

Go to the end of the first line and press enter several times, this is what it generates:

<pre>
Hello world!

B
l
a
,
 
b
l
a
,
 bla
</pre>

IE6 and IE7 seem to work correctly.

Since there is no 'OK' button in the search and replace dialog, the enter key is useless. therefore, when in search tab, the enter key should trigger the search, and in replace dialog it should trigger the replace.

When <font> tag is used in the HTML content, the font name combo displays invalid font name (Arial) instead of current font.

Steps to reproduce

• Open ​http://ckeditor.com/demo.
• Paste the following in the source mode:

  <p>
  	sdfsd sd fsd fsd f</p>
  <p>
  	<font face="Courier" size="2">test</font></p>
  

• Switch to wysiwyg mode.
• Click on the second paragraph.
• Result: the font name combo shows "Arial" instead of "Courier", which is confusing.

Confirmed in IE8 and FF 3.6.

<br> tag is lost when the block element after line break is empty.

Steps to reproduce

• Set in CKEditor configuration ignoreEmptyParagraph to false
• Paste the following in source mode:

  <div>
  	First line</div>
  <br />
  <div>
  </div>
  

• Switch to wysiwyg mode, result:

  <div>
  	First line</div>
  <div>
  	&nbsp;</div>
  

Same things happens when <p> tag is used instead of <div>.

When editor is running inside an ​modeless dialog of IE, clicking on all toolbar commands will cause the focus transferring from the dialog back to the main window, which brings a major problem for continual editing experience. See attached sample page to reproduce.

Reproducing Procedures

1. Load the 'enterkey' sample and switch enterMode from <P> to <BR>;
2. Click on 'Div' command and insert a default div container.

• Expected Result:

  <div>
  		This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>. </div>
  

• Actual Result: Line is wrapped by an extra paragraph.

  <div>
  	<p>
  		This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p>
  </div>
  

Reproducing Procedures

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

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

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

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

This ​screencast in IE demonstrates that Smiley icons are displaying in a fly-in way on slow connection thus break the layout of dialog.

It's not able to move cursor after the following elements at the end of document:

• ul/ol
• form
• blockquote

The unexitable elements list should expand to consider these elements.

1. Open Ajax Sample.

2. Click the Replace icon on the editor toolbar.

3. Attempt to find & replace some text within the page content.

The user should have the option to find text before replacing it, as he/she won't always want to replace a particular occurrence of some text.

Note: Text can be found through the Find tab & replaced specifically through the Replace tab but this function should & could be simplified by adding a Find button to the Replace tab.

Environment

All IE versions.

Reproducing Procedures

1. Open any of the sample page;
2. Open 'Styles' combo and click on 'Inline Quatation" and start typing a few characters;
3. Select 'Inline Quatation" again to close the style, then continue typing;

• Actual Result: The closed half of quatation is not displayed.

Environment

IE6/7

Reproducing Procedures

1. Open any of the sample page;
2. Insert a textarea with all fields filled;
3. Switch to 'Source' mode and switch back;
4. Open 'Text Field' dialog through context menu;

• Actual Result: 'Columns' field value is missing.

Reproducing Procedures

1. Open any of the sample page, load the document with the following content and selection;

   <p> [some sample] text </p>
   

2. Apply the 'Background-color' style with 'red' value.
3. Make the following selection based on the result document.

   <p><span style="background-color: rgb(255, 0, 0);">some [sample</span> text]</p>
   

4. Apply the 'Font-size' style with value '72pt';
   • Actual Result:
     1. Firefox, IE8 and Safari:
     2. IE6/7:

• Expected Result:
  

When pasting HTML that contains lots of nested tags, IE6 throws an error: "stack overflow at line: 27".

Steps to reproduce

• Open _samples/api.html
• Copy content from attached file
• Paste it into the textarea
• Press the "Insert HTML" button

While reading #4358, I was wondering about a way to easly switch between the two list types. With the new dialog in #4358 it should be enough to switch between the tabs and pressing OK.

Context menu may became partially invisible (unusable) if it is positioned above the cursor (i.e. there is no space for context menu to be displayed below cursor).

Can be easily reproduced with SCAYT enabled - when there are SCAYT items in the menu, also may be reproduced with table menus.

Current behavior: if there is no room for the menu under the cursor it is displayed above the cursor position, and if there is no room for the whole menu above cursor position it becomes partially invisible

Expected behavior: if there is no room for the menu under cursor position then the room above cursor position should be evaluated - if there is a room for the menu - menu should be displayed above cursor position, if there is no room for the menu, it should be displayed strating from the top of the document visible part (i.e. top: 0).

Steps to reproduce

• Open the demo.
• Put the caret inside one of the table's cells.
• Click 'body' in the elements path.

Notice not only the body is selected, but also 'h1' and 'image'.
Tested with the demo and the current trunk with IE 8.

Like MS Word, the first option in the Styles combo should be "Remove format" as it's clearly related to the Styles so it's easier to find for new users, then people can opt to remove the button from the toolbar.

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

When someone copies a hex value for a custom color without initial hash character (e.g. cc31e2) and then use it as a custom color, CKEditor will ignore this color and insert an empty <span> tag.

Confirmed in IE8 and FF 3.6.

<p>
	Sample <span>foo</span> bar.</p>

Steps to reproduce

• Select some text
• Press "Text Color" button
• Press "More Color"
• in the right corner paste cc31e2 and press "Ok"

1. Open 5606.html​ on FF.
2. Focus editor.
3. Switch to source mode.

<p><br />
<? $stuff='stuff'; ?></p>

All browsers autoparagraph protected source. FF additionally adds <br>.

Follow up from #4231:

If the editor has been set so it can be resized only vertically, instead of having the grabber at the right-bottom corner it should be displayed at the bottom with a different picture. Same applies for horizontal-only resize.

Putting contentEditable="false" on table doesn't prevent the table content from been editable, this works in all other browsers.

CKeditor 3.2.1 : IE 7.x only - Unable to set font name and font size

I can reproduce the problem in CKeditor demo site:

• Blank the editor's textarea
• Type one word, for example "WORD"
• select the word typed previously and apply font name "arial" and immediately select font size "12"
• put the cursor at the end of "WORD"
• With the cursor at the end of the word, select font name "Tahoma" and immediately select font size 18

=> You will notice that the font is Arial again. The font name "Tahoma" disappeared when you select the font size, paragraph format or styles.

This's a continuation of #5111, where it's not able to navigate the toolbar in JAWS with Arrow keys, it shouldn't be a problem if JAWS is in PC cursor mode.

Environment

IE

Reproducing Procedures

1. Open any of the sample page and clear all content with 'New Page';
2. Create a empty bulleted list in place.
3. Open 'Format' combo and select the 'Normal' paragraph format.
   • Actual Result: There's an extra blank line above the paragraph created, but as soon as we start typing, the empty line vanishes.

1. Load the following content in editor;

   <p>
   	wrongspell</p>
   

   • Expected Result: The word is red-marked in wysiwyg mode.
2. Open 'Replace' dialog and replace the word with "right spell", then close the dialog.
   • Expected Result: The red underline is removed.
   • Actual Result: The red underline is still in place.

1. Load the following content with selection in editor;

   <p>paragraph</p>
   <table>
   	<tbody>
   		<tr>
   			<td>
   				[cell]</td>
   		</tr>
   	</tbody>
   </table>
   

2. Open context menu on the selection, select 'Column' -> 'Delete Columns'.
   • Expect Result: The entire table is removed.
3. Click on 'Undo' once to revert the deletion.
   • Actual Result: the table is brought back but the cursor is not blinking inside the paragraph instead in the cell.
   • Expected Result: both content and selectoin should match the original state.

1. Load the following content with selection in editor;

   <table>
   	<tbody>
   		<tr>
   			<td>
   				some [mispelled] word</td>
   		</tr>
   	</tbody>
   </table>
   

2. Open context menu on the selection, make sure the selection overlaps exactly with the underline marker.
3. Click on either 'Delete Cell'/'Delete Column'/'Delete Row';
   • Actual Result: Error thrown and there's on deletion happens.

Reproducible in all browsers, error stack in Firefox:

row is undefined
http://ckeditor.t/projects/3.3.x/_source/plugins/tabletools/plugin.js
Line 181

Environment

IE, enterMode=BR

Reproducing Procedures

1. Load the following content and selection in editor;

   <ol>
   	<li>
   		item1^</li>
   </ol>
   

2. Press 'Enter' key twice to move out of the list.
   • Actual Result: The new paragraph is not created and cursor is blinking at wrong place.
   • Expected Result: A new paragraph is created after the list.

fixlineends should handle special keywords, for example to not add a BOM character to a .js file or force different line endings.

For example in .js file we could add:

// FIXLINEENDS_NOBOM

to remove BOM from that file (.js files should have BOM character).

This is important as BOM is causing problems when creating the API documentation ([5526]).

Steps to reproduce

• Load a sample with enterMode br
• Click on one of the list icons.
• Create two list items and press ENTER twice to finish the list.

Notice that the caret is getting back to the last item, thus it is impossible to create sequential lists.

In IE6 there is a 8MB memory leak every time an instance of CKEditor is created.

Confirmed using Process Explorer, after creating & destroying CKEditor 10 times (using AJAX sample), memory usage (private bytes) jumped from 9MB to 90MB (tested on IE6.0.3790.1830 @ Win2003/SP1, also reported by user using IE6 6.0.2900.2180).

I have attached a dump from IE Sieve.

Confirmed in FF 3.0.19.

When using CKEditor in fullPage mode, an error is thrown when <title> tag is not present.

Steps to reproduce:

• In Ajax sample add

  var config = {fullPage : true};
  

in createEditor() function.

• Open ajax sample, press "Create Editor".
• Press "Source" button or "Remove Editor".

Result:

element.children[0] is undefined
http://192.168.1.126/bugtest/ckeditor/_source/plugins/htmldataprocessor/plugin.js
Line 198

196  title : function( element )
197 {
198     element.children[ 0 ].value = element.attributes[ '_cke_title' ];
199 } 

Browser/Os: In Chrome on Ubuntu Linux. Bug does not occur in Firefox, not sure about other browsers/operating systems. Steps to reproduce: 1) Go into Full screen mode. 2) Open a dialog (seems like any dialog, but for sure the image dialog produces bug). 3) Exit full screen mode.

At this point, the editor will extend all the way to the right of the screen, instead of going back to the size it was originally.

It seems to me that if a dialog was opened for the first time before going into full screen mode, then the bug does not occur.

Checkbox and radiobutton do not get focus or context menu on FF 3.6.3 and are not editable because of this.

Fake element replacement would be feasable to fix this since elements have basically two appearances selected and unselected.

In #4056 I posted form_changes.zip which uses fake elements for this. Allthough changes are dated and should be rewritten I see no harm done in this approach.

I got this code from #4647:

1. Go to ckeditor.com/demo in IE8 and paste the following into the source:

<p style="width:200px"><img src="http://dev.fckeditor.net/chrome/site/logos.gif" /></p>

2. Right click the image to open the context menu or select the image and click the image button.
3. Image Properties option is not there or it loads the dialog with empty fields.

Note that the first time I right click the image I don't get the "Image Properties" option. However, if I then right-click on the image again OR if I left click the image and then click the Image button, I get the "Image Properties" option and the dialog loads correctly.

It's not able to block certain keystrokes in IE with 'CKEDITOR.config.blockedKeystrokes', e.g. F5.

In Google Chrome 5.0.375.70 (Windows 7) adding :first-letter style to content.css leads to incorect editor behavior.

If you set cursor to any position inside an existing paragraph and press a character, the character is inserted not in the cursor position but at the previous position.

If you try to set cursor at the beginning of an existing paragraph, it's set after the first letter instead. If you try to press backwards key to move the cursor via keyboard, the script hangs.

In IE 8 that works fine.

• Place CKEditor 3.3.1 inside a DIV or other element
• Editing works fine
• Hide the CKEditor by changing that enclosing DIV's "display" CSS properly to "none".
• Show the CKEditor again later by changing the CSS "display" back to "block".

The result is that the CKEditor works OK, but the cursor is never displayed. If you type ... you may see your results, but without any visible cursor.

You can get the cursor back by changing the CKEditor mode to "source" and then back to "wysiwyg". This is not a very user friendly Work Around.

Issue observed in FireFox 3.6 on Mac and Windows XP. Have not tried it in other browsers yet.

This issue did not exist with CKEditor 3.1.