Custom Query

Tested on firefox 3.6.16 on ubuntu. Shortcut (alt+f10) from ​http://docs.cksource.com/CKEditor_3.x/Users_Guide/Keyboard_Shortcuts in Accessibility section doesn't work.

Paste the folowing code:

<form action="formAct" id="myid" method="get" name="form">
	<select name="myselect" size="1"><option selected="selected" value="val1">opt1</option><option value="val2">opt2</option><option value="val3">opt3</option></select></form>
<p>
	<select name="myselect" size="1"><option selected="selected" value="val1">opt1</option><option value="val2">opt2</option><option value="val3">opt3</option></select></p>

1. Place the cursor after select element in form and press enter

Result: seceond empty select element is created.

Bugs #7502 #7503 describe issues with select and eneter key for other browsers.

When use mod_pagespeed for apache from ​http://code.google.com/intl/pl/speed/page-speed/docs/module.html. CKEditor have problems with loading files (css , js) after refresh (when pagespeed works). Remember that use of this module automatically set Accept-Encoding gzip,deflate headers. Because this module became more popular (it is installed on hosting) we should take care about it. Please look at screenshots. All test done with _samples/eplacebyclass.html with different CKEditor js files loaded (FF 3.6.16 on Ubuntu). Problem was reported by Drupal users ​http://drupal.org/node/1095908

Create two level list or paste the following code:

<ol>
	<li>
		item1</li>
	<li>
		item2
		<ol>
			<li>
				item3</li>
			<li>
				item4</li>
			<li>
				item5</li>
		</ol>
	</li>
	<li>
		item6</li>
	<li>
		item7</li>
	<li>
		item8</li>
</ol>

Try to select 2-level list (item 3-5) and press delete or backspace. Result depends on IE version:

1. IE6 and IE7 - deleting whole second level list works if you select something like "empty space" behind item2 element. See ie67.png. If you don't select "empty space" behind item 2 there will be second-level empty list element left.
2. IE9 - there will always be second-level empty list element left.
3. IE8 - This is weird. If you select second-level list with empty space behind item2, than after pressing backspace you will get first-level empty list element. See ie8_empty.png. If you delete second-level list without this "empty space" than just see the ie8_without_empty.png, it will tell you more than my explanation :)

To remove empty element you have to place cursor behind item2 and press delete. In my opinion this is very unintuitive. Furthermore the described issue works perfectly in other browser. When you select second-level list you can delete it whole and nothing will be left.

The following TC is failing:
​http://ckeditor.t/dt/plugins/styles/styles.html

With the following HTML:

<b>this is some</b> sample text

The style system creates this when applying <b> in the word "is":

<b>this <b>is</b> some</b> sample text

I'm unable to drag and drop text outside of any paragraph elements in IE.

Steps to reproduce:

1. In the ckeditor demo, clear out all text leaving only a single paragraph.
   
2. Select some text from a word document, and drag it to the editor.
   
3. Anywhere below the first line the mouse cursor is crossed out, and a drop is disallowed.
   

Expected result:
Like in other browsers you should be able to drop text anywhere in the editor, regardless of if there is a paragraph tag there or not.

We would like to be able to set a default font for text in the editor. We realise this is currently possible using config.contentsCSS to specify a CSS file which defines the default stylings. However we require the default font styling to be stored within the document instead of in an external CSS file.

For example, if the default font is set to Arial, then the text entered in the editor should be wrapped in a span tag and the font family inline style should be set to arial by default e.g.

<span style="font-family: arial;">sample text...</span>

Would it be possible to implement a config option to specify a default font that will be applied like this to all text in the editor unless the user specifies a different font through the font drop down field? Alternatively could you provide an extension point that we could hook into to apply styling like this to text before it is inserted into the editor?

Note: This request came from a customer and it is a feature that would be benificial in many of our products.

If a link has a class or style attribute, unlinking in Firefox 4.0 will leave a span tag behind with the same class/style attributes.

Steps to reproduce:

1. In source mode, enter

   <a class="class" href="#" style="font-weight:bold;">Test</a>
   

2. Switch back to WYSIWYG
3. Select the text
4. Click unlink
5. Go to source mode, HTML is now

   <span class="class" style="font-weight:bold;">Test</span>
   

After moving an image inside of editing area (e.g. a smiley), clicking on the "Source" button does not switch to source mode, until one click on the editing area.

• Load replacebyclass sample
• Insert a smiley at the end of first line
• Move it with a mouse to the beginning
• Click "Source" button
• Result: nothing happens

There is no JS error in the error console.

Steps to simulate:

1. Prepare 2 paragraphs, e.g.:

   <p>
   	a</p>
   <p>
   	b</p>
   

2. Copy a paragraph (or more paragraphs) from some site into the clipboard. Note that if copying just 1 paragraph, the copied HTML must include <p> and </p> tags. If in doubt, use e.g. ​this, triple click on a paragraph and copy.
3. Put the cursor at the end of the 1st paragraph in the editor.
4. Do the paste.

Expected result:

Only the copied text should be added to the document.

Actual result:

The copied text is added to the document and is followed by another (empty) paragraph. When switched to the source code, the additional paragraph contains &nbsp;.

Tested on:

Windows 7, 64-bit, IE9

Additional notes:

• bug happens only when pasting to the end of a paragraph (this includes pasting into empty paragraphs) and it doesn't happen when pasting to the end of the document
• other browsers (FF, Chrome, Opera) don't add the empty paragraph when pasting

This error is sometimes thrown in IE. It happens onClick and I've tracked it down to the following bit of code.

plugins/selection/plugin.js

Ln #215: editor.getSelection().getRanges()[ 0 ].select();

According to the documentation, and my observations, editor.getSelection() can return null. This statement should be wrapped in a conditional block to avoid calling .getRanges on a null object.

if((selection = editor.getSelection()) != null) {
   selection.getRanges()[ 0 ].select();
}

Open editor and paste the following code:

<pre>
line1

line3
</pre>

• Toggle to WYSIWYG mode
  
• Put cursor to the second line
  
• Right click (notice that all content are selected now) and select Paste from context menu
• After pasting all content of pre block will be replaced with new content

With the following ​changes the popup plugin was extended with window features, but it is still impossible to specify the popup windowName. It would be nice to add support for it, otherwise the file browser is opened in a new window each time (even if the corresponding window is already opened).

The popup function in the CKEditor/trunk/_source/plugins/popup/plugin.js can be adjsuted to accept windowName:

popup : function( url, width, height, options, windowName )

Thank you in advance!

1. Go to ​http://ckeditor.com/demo
2. Scroll the editing area to the bottom and click at the end of the document. The insertion point should be at the end now.
3. Run the following code in console or firebug or via javascript: in the address bar.

var e = CKEDITOR.instances.editor1; var d = e.document; var r = new CKEDITOR.dom.range(d); r.selectNodeContents(d.getBody()); r.collapse(true); r.select(); e.focus(); e.getSelection().scrollIntoView(); 

In FF4, the cursor doesn't scroll into view, but if you use the scrollbar of the editor to scroll up, you'll see the cursor is at the beginning of the document.

• Got to ​http://ckeditor.com/demo
  
• Click in the editing area
  
• Ctrl-A to select all
  
• Ctrl-C to copy selection
  
• Ctrl-V to paste and replace selection
  

FF4: Result looks pretty much the same as it was

Chrome: All text is bold

IE9: All text is bold and font size is 3 times as large

Opera: Doesn't work at all. Neither Ctrl-C or Edit -> Copy seem to actually copy the content, so Ctrl-V just pastes whatever was previously on the clipboard

While checking the new stylesheet parser plugin introduced with #901 I've noted two issues:

1)

strong.green {
	color: #739E39;
}

is not listed as "Object Style" after clicking on the <strong> element.

2) Using the default sample text:

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

click in the middle of strong element:

<strong>sa^mple text</strong>

and in the "Styles" dropdown list, select "strong.green". Note that nothing happens (an empty <strong class="green"></strong> is inserted into the document, but that's not an expected result here).

Note: the described problem has nothing to do with the new plugin. It looks like it always worked this way, to confirm it in older versions, I've tried the following:

	{
		name : 'Strong blue',
		element : 'strong',
		attributes :
		{
			'style' : 'color:blue',
		}
	},
	{
		name : 'Strong green',
		element : 'strong',
		attributes :
		{
			'class' : 'green',
		}
	},

This happens in Firefox 3.6 and 4, Chrome 10, and Safari 5. It does not happen in IE7, IE8, and IE9.

1. Create a list
   
2. Select the text that you want to become the list
   

2.A.1 Click anywhere on the first line of the list
2.A.2 Home key
2.A.3 Shift-Down
2.A.4 Repeat 2.A.3 until last line is selected
or
2.B.1 Click before the list item marker
2.B.2 Shift-click before the first free line after your list.

3. Click on Numbered or Bulleted list button on the toolbar
   
4. Click on the Increase Indent button on the toolbar
   

Compare this to changing step 2 to selecting the list from the middle of the line's text.

This can also be done by selecting a list that has already been created in the same way.

I was able to reproduce this with the nightly build as well.

When opening the editor in full screen the right click context menu us not opening, after figuring it out and swithcing to normal mode(not full screen) i found the contenxt menu opened somewhere on top of the document outside of the editing area. Tested in IE8,IE9,Chrome. in FF it works good.

On

dialogDefinition.addButton(
{
    type : 'button',
	id : 'mybutton',
	title : 'My Button',
	onClick : function() {
		myFunc();
	}
}, 'ok' );

or

dialogDefinition.addButton(
{
    type : 'button',
	id : 'mybutton',
	title : 'My Button',
	onClick : function() {
		myFunc();
	}
}, 'cancel' );

My Button is allways inserted as last Element, not before 'ok' or 'cancel'.

The toolbar buttons on the bottom row of of the v2 toolbar are not displaying properly in RTL languages in IE9 (see screenshot). A similar issue was reported to be fixed in 3.5.2 ​#7181 but this issue is still present in 3.5.3.

Editor will not parse the following source, degrade it into a single text node, some fault tolerant has to make instead.

<span style=""">text</span>

Using the following with an editor configured as enterMode=BR:

<blockquote>
	abababab^</blockquote>

Hit ENTER, then click on the blockquote button.
Expected: blockquote is removed in the current caret position.
Actual:

<blockquote>
	abababab^</blockquote>
<blockquote>
	&nbsp;</blockquote>

When placed in an update panel, ckeditor leaks about 700Kb - 1MB every refresh, both in IE9 and FF4.

I have attached a very simple example that loads an editor then on submit, destroys it. This is placed on a 1 second timer. I watched the memory using sysinternals process explorer over a period of about 10 minutes and it continually grew.

Darren

Perhaps this is the same problem as described in comment 15 to the ticket #4594

It only concerns mouse navigation (and so doesn't apply to the keyboard navigation). Please see the image attached and see how the submenu is placed. There is no way to navigate down the main context menu! (well ok, actually there is, but could be quite challenging what should not be the case).

I'd like to propose a little patch that deals with it. The simple solution is to move the submenu a few pixels (e.g. 5) to the left (or right in case of rtl lang).

In fact that's just a couple of keystrokes :)

In file ​http://svn.ckeditor.com/CKEditor/trunk/_source/plugins/floatpanel/plugin.js

change line 255 from

left += ( panelSize.width * ( rtl ? 1 : -1 ) );

to

left += ( ( panelSize.width + 5) * ( rtl ? 1 : -1 ) );

I have read through the half-dozen or so bugs on the tracker here and followed the instructions there. However, I am still having this bug. In IE7 (it works in Fx, Chrome, and IE8+) we are getting the commonly-reported 'lang.contextmenu.options is null or not an object' error. Here is what I have tried:

-Removing the language declaration from the compressed ckeditor.js file -Manually specifying (in both my jquery instantiation and the config.js file) the language as 'en' -Disabling the contextmenu plugin. -Disabling all CSS to verify that it was not an issue with 'table-layout:fixed'

All of these fail to correct the issue. What other options are there for fixing this? The editor works great in all browsers except IE7, which (sadly) is the primary browser used by my client... so it's kind of a deal-breaker.

Thanks in advance.

1. Load the following content:

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

2. Double click on word "text"

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

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

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

Start an empty editor and press simultaneously on your keyboard PAGE UP (or PAGE DOWN) and ENTER many times.

You should see that the editor adds <br> in the body section of the page that contains the editor.

For an easier editing I change some styles and set it with

contentsCss : ['path/pagestyles.css', 'admin/changes.css']

pagestyles.css is the normal stylesheet and with changes.css I make a div bigger or set display: none to display: block and so on.
This doesn't work in fullPage mode.

To reproduce the defect:

Open Ajax sample and keep cursor in editor body

Expected Result: Cursor stays in Editor body & elements path bar shows body & p tags.

Actual Result: Cursor stays in Editor body, but elements path bar will not show any tags. we have to click twice or type some text to get elements in path bar.

To reproduce the defect:

1. Open Ajax sample and insert a table.

2. Go in to table cell, insert a smiley.

3. Try to insert a special character next to smiley by selecting a special character from Select Special Character dialog.

Expected Result: Selected Special Character gets inserted after the smiley inside the current table cell.

Actual Result: Selected Special Character is inserted in next table cell if current table cell is not last table cell. if current table cell is last table cell then special character is inserted in an empty paragraph after the table.

1. Paste the contents of the attachment in to editor (WYSIWYG mode)
2. Place the cursor before ‘item2’ (on the left of i) and press enter
3. Place the cursor before ‘item5’ (on the left of i) and press enter
4. Select ‘item2’, ‘item3’ and ‘item4’ using shift key and arrow keys
5. Press bulleted list button for selected text.

Result: When I selected ‘item2’, ‘item3’ and ‘item4’ and pressed bulleted list, an empty list item above ‘item2’ was also created.

When I tried to outsmart IE9 and selected everything except letter ‘i’ in ‘item2’, pressed bulleted list, it created three item list but it inserted an empty paragraph above it.

This issue was discovered when reproducing bug #7640

Enter in source mode :

<style type="text/css">
  body {
    font-size: 14pt;
}
</style>

Back to wysiwyg mode, enter a letter. Finally, do an undo command, and see the source : the style tag dissappeared.

If editor contains a button (created by using <button> tag), then placing the cursor to the right of button and pressing "Backspace" key, does not delete the button. Instead it goes on deleting the button title. If you place the cursor to the left of the button and pressed "Delete" key, then that deletes the button successfully.

Also, we cannot put the cursor between 2 consecutive buttons. Deleting the first button using "Delete" key, also deletes the second button.

1. Open replaceBycode sample.
2. Go to second editor
3. Select part of sample text and try to cut it with toolbar button.
4. Security alert pops out.
5. Click ok and place the cursor after sample text (after dot)
6. Now buttons for cut and copy are disabled. Try to select whole sample text from dot '.' to 'T'.

Result: Buttons for cut and copy are still disabled. If you try to do it on part of the sample text or select whole text from 'T' to dot '.' it will work (Buttons become enabled on mouse up).

This has been reproducible in FF, Opera since CKEditor version 3.5.1

In Webkit these buttons are disabled all the time. I'm not sure if this is a bug or if this is due to the security settings in this case.

Example: ​http://tvz.myhomework.nl/ckeditor_problem.html

The simple container has opacity (CSS3) set. When you click the Maximize button, the entire container disappears, leaving only the background left. When I remove the opacity from the container, the Maximize button works fine.

CKEditor is version 3.5.3. I am using Firefox 4.01. Internet Explorer 9.0 seem to work okay.

Apparently FF3.6 has the same issue, see also ​http://cksource.com/forums/viewtopic.php?f=6&t=22363

When using ckeditor_basic.js (for ​boosting page load performance) the jQuery Adapter does not seem to work.

Can be tested in the _samples/jqueryadapter.html when replacing:

<script type="text/javascript" src="../ckeditor"></script>

with

<script type="text/javascript" src="../ckeditor_basic.js"></script>

Thank you in advance!

Kind regards

Sergiy Shyrkov

1. Go to demo page.
2. Run the following in Firebug.

   CKEDITOR.instances.editor1.document.getBody().setHtml('<p>paragraph<br><br></p>');
   CKEDITOR.instances.editor1.getData();
   
   

3. Observe the following result.

<p> paragraph<br /> &nbsp;</p>

Expected result (filler node should be removed):

<p> paragraph<br /></p>

Tested in Firefox 4, WinXP. CK version 3.5.3

Holding "shift" + "ctrl" allows you to select entire words at a time. You can select one word with your mouse, and then hold shift+ctrl+(right arrow) to select words within the editor.

In IE8, something prevents this from working correctly in ckeditor.

You can duplicate this in 3.5.3 on the online demo: ​http://ckeditor.com/demo

Steps to reproduce (using IE8, this works fine in Firefox 4): 1) Use your mouse to highlight the word "Little". 2) Hold down shift+ctrl on your keyboard and hit the right arrow. The space next to "Little" is selected. 3) Keep hitting the right arrow. Words/spaces will be selected up until the quotation mark (") starting the first paragraph. 4) Bug: The editor does not allow words past this quote mark to be selected.

You cannot see my keyboard strokes in this video, but this is what happens: ​http://screencast.com/t/sHFTZHP1zmF . I have continued hitting the right arrow (several times) when I reach the quotation mark in the first paragraph but nothing is selected after this point.

Of interest (not sure if this helps or not), if you view the source code of the editor, this text is wrapped with <b> bold tags, while "International Names" is wrapped with <strong> strong tags. If you select "adaptations" in the first paragraph and hold shift + ctrl and hit the right arrow, you are able to correctly select the "International Names" text and continue selecting further text beyond this. My testing indicates this happens with the <b> and <i> tags specifically, so the issue may have to do with using these tags specifically. In any event, you can duplicate in the online demo with the text pre-filled.

I want to present my own translation for help topics for CKFinder.

Environment

Opera 11.10

TC 1

1. Clear content
2. press Striketrough button and Subscript button
3. type some text

Actual result

Strikethrough line is placed above entered text

TC 2

1. Clear content
2. press Striketrough button and Sperscript button
3. type some text

Actual result

Strikethrough line is placed below entered text

Expected result for TC1 and TC2

• Strikethrough line is crossing the entered text.
• when entered text is selected again, and sub/sup is disabled ane enabled again, everything works fine

In other browsers above cases are working fine

In AIR, open the smiley dialog. Note that the blue border is position half way through the image, so it interrupts viewing the smiley.

Environment

Opera 11.10; Connected with context menu issue #7644

TC

• open any sample
• enable fullscreen mode
• click right mouse button in edit area (menu is shown in wrong place)
• disable fullscreen mode
• enable fullscreen mode again

Actual result

Editor is wrongly placed (cke 3.4.3; 3.5+) or is missing (cke 3.5.2+)

Tested with the CK Demo Version: Inserted Code ( as Source)

<table class="vtad">
<tbody>
<tr>
<td class="vtad">

<a href="/sites/files/images/users/Karin/preistraeger.png" target="_blank" title="Preisträger FK 2011"><img alt="Preisträger FK 2011" src="/sites/files/images/users/Karin/thumb_preistraeger.png" style="width: 100px; height: 100px;float: right;"  /></a>

<ul>
<li>
<a href="/node/1441">Gleitende Durchschnitte 3.0 (Moving Averages 3.0) - 1. Preis</a></li>
<li>
<a href="/node/1442">Lineare Regressionsgeraden in der Technischen Analyse - 2. Preis</a></li>
<li><a href="/node/1454">
Handelsstrategien auf Basis von Strukturbr&uuml;chen bei Korrelationen und Volatilit&auml;ten  - 3. Preis</a></li>

         Alle Arbeiten finden Sie unter <a href="/forschungsarbeiten">"Forschungsarbeiten"</a> oder direkt unter dem Link
                                                                                 <a href="/taxonomy/term/63" >"Award 2011"</a>.<br/>
<em>Foto: Preisträger des VTAD-Award 2011. Von links nach rechts: Dr. Gregor Bauer (Vorstandsvorsitzender der VTAD e.V.),
Dr. Manfred Dürschner (1. Preis), Joachim Lenz (2. Preis), Dr. Daniel Ziggel und Dr. Dominik Wied (3. Preis).</em>

                         </ul>
</td>

</tr>
</tbody>
</table>

Code after deactivating and activating ht Source View

<table class="vtad">
	<tbody>
		<tr>
			<td class="vtad">
				<a href="/sites/files/images/users/Karin/preistraeger.png" target="_blank" title="Preisträger FK 2011"><img alt="Preisträger FK 2011" src="/sites/files/images/users/Karin/thumb_preistraeger.png" style="width: 100px; height: 100px;float: right;" /></a> <a href="/forschungsarbeiten">&quot;Forschungsarbeiten&quot;</a><a href="/taxonomy/term/63">&quot;Award 2011&quot;</a>
				<ul>
					<li>
						<a href="/node/1441">Gleitende Durchschnitte 3.0 (Moving Averages 3.0) - 1. Preis</a></li>
					<li>
						<a href="/node/1442">Lineare Regressionsgeraden in der Technischen Analyse - 2. Preis</a></li>
					<li>
						<a href="/node/1454"> Handelsstrategien auf Basis von Strukturbr&uuml;chen bei Korrelationen und Volatilit&auml;ten - 3. Preis</a></li>
					Alle Arbeiten finden Sie unter oder direkt unter dem Link .<br />
					Foto: Preistr&auml;ger des VTAD-Award 2011. Von links nach rechts: Dr. Gregor Bauer (Vorstandsvorsitzender der VTAD e.V.), Dr. Manfred D&uuml;rschner (1. Preis), Joachim Lenz (2. Preis), Dr. Daniel Ziggel und Dr. Dominik Wied (3. Preis).
				</ul>
			</td>
		</tr>
	</tbody>
</table>

Following links disappeared:

<a href="/forschungsarbeiten">"Forschungsarbeiten"</a>
<a href="/taxonomy/term/63" >"Award 2011"</a>

CKEditor currently allows users to specify the border size for a table and the border colour for a table cell. We would like to expand this so that it is possible for users to specify the size, colour and style of the border for both tables and cells.

This would require new fields on both the Table dialog and the Cell Properties dialog for border width, border color and border style.

If you have two or more paragraphs of text, and misspell a word, the cursor shifts when the word is marked. This means that continuous typing can cause the text to get jumbled up.

Steps to reproduce:

1. Type out two paragraphs of text, with no misspellings.
   
2. Begin typing a sentence above the second paragraph. This time include some misspelled words.
   
   1. After the word has been marked, you should notice the cursor moves.
      
      

This typically happens more often when the user is typing quickly.

1. Open stylesheetparser demo page;
2. Load the following source by input (but not from file)

   <style>
   	p.red
   	{
   		color:red;
   	}
   </style>
   <p class="red">some red text</p>
   

3. Check Styles combo;

• Actual Result: The style doesn't show up.

1. Enable SCAYT, load the editor with the following source:

   <p>
   	<a name="anchor1">anchor mis</a>pell</p>
   

2. Wait until word "mispell" is marked by SCAYT;

• Actual Result: marker splits up the anchor text into two, with each of them get applies the anchor styles.

1. Now open context menu on first anchor and change the name to "anchor2";
2. Check source:

• Actual Result:

  <p>
  	<a name="anchor2">anchor </a><a name="anchor1">mis</a>pell</p>
  
  

Not sure if we have already a ticket for it.

The XHTML sample is using classes for different styles and it works fine (it's possible to apply bold and italic to the same text):

coreStyles_bold	: { element : 'span', attributes : {'class': 'Bold'} },
coreStyles_italic	: { element : 'span', attributes : {'class': 'Italic'}},
coreStyles_underline	: { element : 'span', attributes : {'class': 'Underline'}},

However, when using the following:

config.coreStyles_bold = { element: 'span', attributes: { 'style': 'font-weight:bold'} };
config.coreStyles_italic = { element: 'span', attributes: { 'style': 'font-style:italic'} };
config.coreStyles_underline = { element: 'span', attributes: { 'style': 'text-decoration:underline'} };

CKEditor allows setting only one style on the same selection. It's quite strange because each style uses a different CSS rule (font-weight/text-decoration etc.).

Environment

CKE 3.6, Opera 11, IE6/7, Chrome

TC

• Load BBCode sample
• clear content
• type "default"
• change font size to 200, type 200
• change font size to 150, type 150 See that newly typed text is bigger, than previous, and element path contains two size
• repeat for other font sizes

Result

the size tags, are not closed after changing font size to other values:

default[size=200]200[size=150]150[size=120]120[size=100]100[size=50]50[size=30]30[size=300]300[size=200]200[/size][/size][/size][/size][/size][/size][/size][/size]

Attached screen

Expected

default[size=200]200[/size][size=150]150[/size][size=120]120[/size][size=100]100[/size][size=50]50[/size][size=30]30[/size][size=300]300[/size][size=200]200[/size]

IEJSLeaksDetector detected memory leaks for CKEditor in IE8 and IE7

To reproduce the issue:

1. Download and install IEJSLeaksDetector: ​http://joinmicrosofteurope.com/files/IEJSLeaksDetector2.0.1.1.zip

2. Point IEJSLeaksDetector to ajax.html in the nightly build, for example, ​http://nightly.ckeditor.com/6870/_samples/ajax.html.

3. Create and remove CKEditor a couple of times and then stop the application.

4. Notice that IEJSLeaksDetector reports memory leaks.

I tried to test it with no buttons on the toolbar and still got the memory leak.

I have attached a screen shot.

Our page has several divs that are placeholders for CKEDITOR instances. When a user clicks on one, it closes the active editor, and creates a new instance of CKEDITOR on the clicked div using CKEDITOR.replace. When you have an editor instance open, right click to open the context menu twice, and click on another div to open the editor, I get this error.

Cannot call method 'split' of undefined

This error only occurs when I am using ckeditor.js and not ckeditor_source.js. I've tracked the error down to line 23 of ckeditor.js. Here is a snippet of the issue:

q=function(x){var y=x.config.skin.split(','),z=y[0],A=a.getUrl(y[1]||'skins/'+z+'/');

Interestingly, I cannot find any reference in the source to 'config.skin.split'. It seems that this only exists in the ckeditor.js file.

Steps to reproduce:

1. Start out on a page with two div elements with ids, 'editor1', 'editor2'.
2. Use CKEDITOR.replace to replace 'editor1'
3. Right click on the active editor to activate the context menu
4. Left click on the active editor, not clicking on the menu items
5. Repeat Step 3
6. Repeat Step 4
7. Use CKEDITOR.replace to replace 'editor2'

Tested in Chrome, IE8/9

I use autogrow with sharedSpaces. On firefox 4 it's not working properly. In this case editor loads with default height and added 20 pixel (think it's one line-height) on every click inside editor.

It works correctly on ff 3.6 and with autogrow.html samples file (on ff 4).

To reproduce the defect

1. Open any sample except AJAX.

2. With out focus in Editor body,select a font(for eg: Comic Sans MS) from Font Name drop down list.

Expected Result:Selected font option shown in Font Name drop down list.

Actual Result:Selected font option not shown in Font Name drop down list but when we start typing the text, the option will be shown in the drop down list.

Same behavior happens with Font Size drop down list

Tested against IE6,IE7,IE8 & IE9

We would like to see improvements in the selection API and associated documentation for CKEditor. Some of our products are extending the editor to support features such as content-assist, word completion, extracting the selection into new documents etc. While the CKEditor selection API does a good job of isolating us from browser differences, it is very difficult to figure out how to use and could be more robust in what API it provides.

Suggestions on areas where we would like the API extended and better documentation are included below:

API to help user query selection:
a) Get the plain text of the selection.
b) Get html behind selection (properly formed)
c) Get element at cursor
d) Proper selection change API (see ticket #6443)
e) Find out if the selection is contained in a single block element, or spans more than one block element.
f) Find out if the selection spans any markup.

API to help user modify selection:
a) Adjust the selection to remove leading or trailing the whitespace. (Double-click selects word plus trailing whitespace, whereas most of our operations are likely to want to work on just whole words).
b) Expand selection to span complete words.
c) Expand selection to whole block.
d) Reduce selection to be contained in one block.

Better documentation/examples around range/selection/bookmark functionality:
a) What is the difference between bookmark and bookmark2, and when should I use one rather than the other?
b) When does a selection/range/bookmark become invalid.
c) Useful examples of how to use selection/range/bookmark API

1. Load the editor in enterMode BR;
2. Empty the editor, type in some content;
3. Select all, then apply one inline style like bold;

• Actual Result: Everything looks fine except cursor is not blinking at the end of doc;
• Expected Result: Text selection remains unchanged.

Problem can be reproduced from CKEditor 3.5.1 rev. [6272], it gets fixed in CKEditor 3.6.1 rev. [6919] and gets broken again in CKE 4.0 beta.

To reproduce the defect:

1. Open Ajax sample and type "foo".

2. Press Horizontal Line button.

Expected Result:

Horizontal Line is inserted after current paragraph and cursor goes to empty paragraph after Horizontal line.

Actual Result:

Horizontal Line is inserted after current paragraph but cursor goes to end of current paragraph instead of the empty paragraph after Horizontal line and we can not place the cursor after Horizontal line using keyboard or mouse.

Same issue was raised in ticket #7583 but it was closed as fixed, but the issue in the ticket was not fully fixed. so i opened this new ticket

• Set pasteFromWordPromptCleanup = true.
• Copy-paste any doc file into the editor using CTRL+V or paste button (NOT paste from Word button).
• Hit "cancel" when the cleanup prompt appears.

Note that in FF, unlike other browsers, Word's metadata appears in source (o:OfficeDocumentSettings etc.).

In our CMS, the CKEditor is sometimes loaded in the background, in a hidden div (part of a tabset). Although hidden, the editor instance is already created and works fine.

When displaying the DIV, I want to focus the editor, and do so by using editor.focus(). This will put focus on the editor. This works correctly for and empty editor or one with content, and works correctly in all browsers.

The only exception is Firefox (tested on both version 3 and 4), which adds the following content on a editor without any content:

<p><br />
	&nbsp;</p>

The result being an empty editor, with a <br /> tag in it. In addition, focus is placed on the second line, but when starting to type it will place all text on the first line, NOT removing the second line. You just can't type anything on the second line.

This issue has been present since at least 3.5.3.

Steps to reproduce:

1. Create a DIV with display: none;
2. Place a textarea inside, without any content
3. Replace the textarea with a CKEditor
4. Show the DIV (it will not have focus)
5. Focus the editor using editor.focus()
6. The code mentioned above is inserted into the editor

Expected result:

6. The editor is focused, content remains empty

Does not apply for:

• other browsers than Firefox
• editor with existing content
• manually focusing the editor by clicking on it
• editors not hidden when created

If you click (select) an image, table, anchor, ... in FF then the selection handles appear. Now try to reset the selection using javascript code :

oEditor.getSelection().reset();

OR

var doc = oEditor.document; var range = new CKEDITOR.dom.range(doc); var body = doc.getBody(); range.setStart(body, 0); range.setEnd(body, 0); oEditor.getSelection().selectRanges( [range] );

The selection is removed (this can be checked with selection.getSelectedElement), but the selection handles in the wysiwyg area remain.

Also, when trying to select an element using javascript code (oEditor.getSelection.selectElement()), the selection handles do not appear.

I think this is a bug in CKEditor and not in FF because it did work in the previous version FCKEditor.

To reproduce the defect:

1. Open CK Editor, insert a table and enter data in all table cells.

2. keep cursor in first table cell and select the text in all table cells using mouse or key board and press Ctrl + C

3. keep cursor in the paragraph after the table and press Ctrl + v.

Expected Result: A new table is pasted which has same no of rows and Columns as the table inserted in step 1.

Actual Result: Data in all table cells are pasted but not as table. when we keep cursor in the pasted data Element path bar shows tr and td tags but no table tag.

when we go back to source view and come back to Rich Text it will combine all the pasted data as single paragraph.

Load the following content:

<p><img src="​http://a.cksource.com/c/1/inc/gfx/icon.png" /></p>

Click on the image, then select the anchor item in the menu. Add an anchor with any content. Submit the anchor dialog.

Cut image (only the image, not the attached anchor!) from the document. Paste the image back into the document. Paste it repeatedly.

Expected: Cutting content from the document should remove the content from the document that is moved into the clipboard.

Actual: Content remains within the document but is *also* put into the clipboard.

Ideally this new anchor feature would work in a WYSIWYG type fashion, but in it's current incarnation it's hard to use.

Additionally it's pretty debatable on whether the anchor should be copied at all in the above scenario. Common sense indicates it should not, as I did not select the anchor to be cut, so why is it in my clipboard to begin with?

This test occurred in firefox 4

There's a small visual defect of the autogrow plugin that flicks the vertical scrollbar when growing.

Feature request to introduce dialog to maintain a list at list item level, including list item style type and start numbering.

The issue is present with Firefox 3.6.18 and 4.0 (on Linux and Windows). Maximize works fine in Chrome 11.

CKEditor 3.4.2 works without any issues in exactly the same setup.

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

When you are working in br mode the lists work different than in p mode. To see what i mean:

Set this in your config file: config.enterMode = CKEDITOR.ENTER_BR;

In WYSIWYG mode write something like: testing lists ckeditor

Then highlight: testing lists and the beginning of the line where's 'ckeditor' but not the text from it

Then click on any of the list buttons (numbered/bulleted list). You will get the three lines listed while in p mode you will get only the two highlighted lines listed.

Flash plugin url escapes some values.

Testing against ​http://nightly.ckeditor.com/6928/_samples/replacebyclass.html

To reproduce:

1. Insert new flash element through dialog
2. Set value to [url|ALL|9839]
3. Close dialog
4. View source to verify bug. embed tags src attribute gets url escaped

Expected (new lines added for readability):

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" data="[url|ALL|9839]">
<param name="quality" value="high" />
<param name="movie" value="[url|ALL|9839]" />
<embed pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" src="[url|ALL|9839]" type="application/x-shockwave-flash"></embed>
</object>

Got (new lines added for readability):

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" data="[url|ALL|9839]">
<param name="quality" value="high" />
<param name="movie" value="[url|ALL|9839]" />
<embed pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" src="[url%7CALL%7C9839]" type="application/x-shockwave-flash"></embed>
</object>

From what I could see this might be some difference in embedNode.setAttribute and CKEDITOR.dom.element.createFromHtml -> setAttributes

This bug is a rewritten forum entry ​http://cksource.com/forums/viewtopic.php?f=11&t=22508

It occurs in IE7 and IE6 with enterMode set to BR from CKEditor 3.5.3.

1. Copy the attached file to samples
2. Load it
3. click on a select box.

Result:JS error pops out: Message: editor.getSelection() is null or not an object Line: 818 URI: /_source/plugins/wysiwygarea/plugins.js Code: range = editor.getSelection().getRanges()[ 0 ];

The bbcode plugin is now textifying all unknown HTML elements (in wysiwyg), this's ok for inline elements only but not blocks, e.g.

1. Open "replacebyclass" sample, copy all content;
2. Open "bbcode" sample page and paste in the clipboard content;
3. Switch to Source and back.
   • Expected: pasted paragraphs new lines remains.
   • Actual: All line-breaks are now lost in wyiswyg.

After creating a table using "Insert Table" plugin, the column size gets automatically changed after you start typing into the columns. There is no way to assign fix column size to the table.

Also when the table is selected, pressing delete or backspace key does not remove the table from the editor. To remove the table, you need to select the previous and next line of the table as well.

This behavior is seen on FireFox and IE.

1. Append the following to content.css file:

   ul, ol {
        color:#888888;
        line-height:16px;
   }
   

2. Open any of the rich combo

• Actual Result: List box items are affected by content style.

The "showborders" makes assumption on existence of certain table dialog field thus get broken when table dialog definition is reduced.

1. Create a link (i.e. to an anchor)
2. Save and re-open the page for editing
3. Move cursor to last position of link
4. Select the whole link and remove it
5. Start typing plain text

PROBLEM: the text is undelined, but should have no format

This function return 'old' data but check dirty function returns proper value. This is especially visible when switch between source and WYSIWYG mode. Please look at attached file. To reproduce just open attached file and fire any editor command and look at firebug console. This issue is also reported here ​http://cksource.com/forums/viewtopic.php?t=22532.

The enter key does not work when the cursor is directly after a placeholder. The ForceEnter setting does not alter this behavior.

To reproduce the issue, just open the placeholder Sample, ​http://nightly.ckeditor.com/6949/_samples/placeholder.html, position the cursor right after the closing brace of the placeholder, and press the enter key. A new line will not be created.

To reproduce the defect:

1. With JAWS on, Insert an Image, Open Image properties dialog of the image.

2. Navigate to width and height fields, change the values of those fields.

3. Now navigate to Reset size button and press space bar.

Expected Result: Width and height values for the image restored to original values and JAWS should read updated values of width and height.

Actual Result: Width and height values for the image restored to original values but JAWS not reading out the updated values of width and height.

we can fix this be keeping aria-live="assert" on width and height fields when the user presses Reset size button.

The table tools plugin provides many useful functions for inserting and deleting table cells/rows/columns, merging cells, splitting cells etc. However these APIs are not available when developing extensions to the editor. Can these APIs please be exposed so that we can provide extensions to the table functionality in our products?

Steps to reproduce the defect:

1. Open the Ajax sample in either Safari or Chrome.

2. Enter some text.

3. Select the text and choose Comic Sans MS (or any other font name) from the Font Name combo box in the toolbar.

4. Select the text & hit spacebar. See that the Font Name in the combo box changes to Arial.

5. Type so more text.

Result: The text that has been entered is Comic Sans MS (or whatever font you chose) but Arial is still displayed in the Font Name combo box.

To solve the problem, I have to modify the file plugins/editingblock/plugin.js. Is this OK ?

New code : (1 line disabled, 1 line added)

CKEDITOR.editor.prototype.setMode = function( mode ) {

this.fire( 'beforeSetMode', { newMode : mode } );

var data, holderElement = this.getThemeSpace( 'contents' ), isDirty = this.checkDirty();

Unload the previous mode. if ( this.mode ) {

if ( mode == this.mode )

return;

this.fire( 'beforeModeUnload' );

var currentMode = getMode( this ); data = currentMode.getData(); currentMode.unload( holderElement ); this.mode = ; LINE HAS BEEN DISABLED

}

holderElement.setHtml( );

Load required mode. var modeEditor = getMode( this, mode ); if ( !modeEditor )

throw '[CKEDITOR.editor.setMode] Unknown mode "' + mode + '".';

if ( !isDirty ) {

this.on( 'mode', function() {

this.resetDirty(); this.removeListener( 'mode', arguments.callee );

});

}

modeEditor.load( holderElement, ( typeof data ) != 'string' ? this.getData() : data);

FOLLOWING LINE HAS BEEN ADDED this.mode = (this.mode == 'wysiwyg') ? 'source' : 'wysiwyg';

};

Steps to reproduce the defect:

1. Open the Ajax sample in IE8 or IE9.

2. Insert a table that has a width of 120% and is right aligned.

Result: There is no horizontal scrollbar so you cannot view the data in the left-most cells. If you remove the editor there is still no horizontal scrollbar.

Reported in ​http://cksource.com/forums/viewtopic.php?f=6&t=22581

I have searched and couldn't find anything relevant.

ok so I am not using the save button that comes with CKEditor I am basically just sending the contents to of the text property to the database.

So when I have a page that causes to the editor to be populated with existing data and then I modify that data and then click my own save button nothing changes in the database....when I run through debug with visual studio 2010 when i check the contents of the text property of the editor control after I have changed it and clicked the button(as stated above) the text property still contains the old data that i pulled out of the database on page load and so therefore it writes the same data back

When you click an element in the elements path, the elementspath.js plugin executes the instruction

editor.getSelection().selectElement(element);

However, in all browsers except Firefox, the editor.getSelection().getSelectedElement() returns null !

Is this a problem that has been solved already in some patch ?

1. Load the following source in IE:

   <div style="float: right">
   Foo <img alt="" src="http://a.cksource.com/c/1/inc/img/demo-little-red.jpg" /> Bar</div>
   

2. Select an image
3. Click "Image" button (do not use the context menu)
4. Image dialog opens, but all fields are empty.

It looks like it started happening in 3.2.1.

on ie8- if you add a style on an element using background:url() it get completely stripped from the source, same problem with background-image:url()

It can be reproduce in your demos as well.

code example:

    <div style="text-align: center; width: 800px; background: url('http://symple2.com/editor_images/image_c88658f6/Patterson Farms/Fresh Produce/PattersonProduceEadsmallheader_02_419.jpg') left top repeat-y;">
             test</div>

Reproduce:

1. With Safari and Chrome, go to ​http://ckeditor.com/demo
2. Right click on the Little Red Riding Hood image.
3. Select "Image Properties"
4. Changle "Alignment" to "<not set">
5. Press "Ok"

Place your cursor in the "Little Red Riding Hood" text that is next to the image. Observe that the cursor is as tall as the image. This differs from other browsers. While this is probably inherent to the browser, perhaps there is something that can be applied to the image so that it remains inline but does not affect the cursor size.

In version "Nightly Build":

To reproduce, change to source-code view and paste this html code:

<title>aa</title>
bbb

now switch again to view html, and again to source-code, now the code will be:

<p>
	<html>
		<head>
			<title></title>
		</head>
		<body></body>
	</html>
</p>
<p>
	<title></title>
	bbb</p>

In version 3.6: To reproduce, change to source-code view and paste this html code:

<title>aaa</title>
bbbb

now switch again to view html, and again to source-code, now the code will be:

<p>
	&nbsp;</p>
<p>
	<title></title>
	bbbb</p>

• Insert a flash object, with some height and width.
• Click on the image.
• Open the styles combo and see that image styling options are available.
• Click on "image on the right". See that the image's dimensions get reset.

Hi, a nice feature to have would be to fire an event when we click on a template to select it.

I "forked" the code like this to do so (very easy indeed):

file: /ckeditor/_source/plugins/templates/dialogs/templates.js line: 58

item.on( 'click', function() { insertTemplate( template.html ); } );

replace with

item.on( 'click', function(event) {editor.fire('templateSelected', event); insertTemplate( template.html ); } );

This little thing could be the first step to a "I-know-which-template-is-used-right-now" dynamic.

Just as a notice, this is useful in the case you have multiple templates, each with its own css. You select a template, you do a few modification, and send data to server. Then, if the server needs to know which template was selected to fetch the appropriate css, you're screwed.

If an event is fired, at least you can do some work to get the css path. Let's say the template thumb and its css are in the same folder. If you know the thumb's src, you know the css place.

After a clic on the template, you can get the target (event.data.getTarget()) and then browse up to the <table>, then down to the <img> and you're ok.

But that's an other story . Just the fire('templateSelected') would be very nice!

Thanks

1. Append the following styles to the content.css file:

   p,strong
   {
   	border: 1px dotted #000;
   }
   
   

2. Load the editor with following content:

   <p><strong>paragraph1</strong></p>
   <p>paragraph2</p>
   

3. Copy all content and paste at the end of doc.

• Actual Result: The computed style of the content is pasted as inline style.

To reproduce the defect:

with config.pasteFromWordRemoveStyles = false & config.pasteFromWordRemoveFontStyles = false copy the text from attached word doc and paste it in to the editor.

Expected Result Text pasted properly and should be same across all browsers

Actual Result we are seeing the differences between IE(6,7,8& 9) & all other browsers.

In IE the top text is shown in bold and big font size where as in other browsers it is shown with small font size and with out bold.

I have attached screen shots of pasted text in IE & FF.

To reproduce:

1. start with a clean editor.
2. set font size to 20 (or some other formatting ending up in span)
3. type 'asdf' hit shift+enter
4. type 'asdf' hit shift+enter
5. type 'asdf'

6. now, select row 2 and 3 with mouse.
7. press the bullet list icon/button.

the first bullet in the list will have lost the formatting.

To reproduce the defect:

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

2. press enter after first list item.

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

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

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

Back in #4246 we've changed the way how image dimension is set: deprecate the attributes for inline styles. Some users are not adapted to this change (such as #5547) and some others on the opposite want it a step further - to propagate this convention to other plugins (e.g. flash, iframe).

As usual, as both criticism has it's own advantages, it looks like the best option is still to create a configuration entry for choosing the scheme of the dimension, as well as aligning all objects with this convention.

1. Load the editor with the following content:

   <article>article</article>
   

2. Put cursor inside the article block;

• Actual Result: New paragraph established.

If I enter this code into the source view using IE8:

<table>

<tr>

<td align="center">some text</td>

</tr>

</table>

It gets changed to

<table>

<tr>

<td align="middle">some text</td>

</tr>

</table>

The new value of "middle" instead of "center" and the page is no longer validate using an xhtml transitional dtd.

I found this issue after recent upgrade to the version 3.6.

Steps:

• Set Focus to the CKEditor text area;
• Click any other control you have on a page (like link or button);

See attached video (6-1-2011 6-56-55 PM.zip) and an ASP.NET sample application I used for testing (CKEditorTest.zip) for details.

It would be very useful to have ability to rearrange rows in a table. Ideally with drag/drop, but if not, even a context menu "move row up" / "move row down" would be helpful.

• Load the HTML content posted below
• Scroll down to the bottom, select and image and right-click on it

• Results: Firefox and IE scroll to the top. Additionally in IE "Image properties" option is not available (reported in #7974, because it is happening since CKEditor 3.3).

Firefox scrolls to the top since CKEditor 3.3.
IE scrolls to the top since [5214] (CKEditor 3.2.1).
Related ticket caused by the same changeset: #7934.

<p>
	(Scroll down to the bottom, select and image and right-click on it)</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<div style="float: right">
	Foo <img alt="" src="http://a.cksource.com/c/1/inc/img/demo-little-red.jpg" /> Bar</div>

• Load the HTML content posted below
• Scroll down to the bottom, select and image and right-click on it
• Results: "Image properties" option is not available and IE scrolls to the top (reported in #7973, started happening in 3.2.1).

"Image properties" option disappeared in 3.3.

<p>
	(Scroll down to the bottom, select and image and right-click on it)</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<p>
	&nbsp;</p>
<div style="float: right">
	Foo <img alt="" src="http://a.cksource.com/c/1/inc/img/demo-little-red.jpg" /> Bar</div>

The below description was copied from bug #7928 comment 3.

Second example :

1. Create new table
2. Put the cursor in a cell
3. Add some text in the cell
4. Click "td" in the elementspath
5. Click with RBM on selected text
6. Go to cell properties and change the width of the cell
7. Save : JAVASCRIPT ERROR

Message: Object doesn't support this property or method
Line: 131
URI: /ckeditor/_source/plugins/elementspath/plugin.js

This has been true for all versions of IE from CKEDitor 3.4.1