Custom Query

Steps to reproduce

1. configure "ar" as a language
2. open CKEditor
3. press "image" button
4. look at "Preview" section

Expected result

Preview section text should be displayed into Arabic language, Or It should be aligned left with LTR direction if there is no willing to translate into Arabic

Actual result

Preview section text is Displayed into English with text-align right and RTL direction

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

Suggested Solution

As it is pure English Text and there is no willing to translate it to other languages so It should be aligned left with has LTR direction

Steps to reproduce

1. Download CKBuilder package of ​http://ckeditor.com/builder/fae662a2edb8dd0f7c22be87af377e04
2. Extract and load /samples/index.html into Firefox or other browser
3. Toggle into and out of 'View source'

Expected result

Default pre-filled content source code should be rendered in BBCode [ ] style tags and remain unchanged when toggling into and out of View source

Actual result

On intial toggle into View source you can see that source code has NOT been converted to BBCode as should. Toggling back into RTE view then causes unwanted HTML tag code to be progressively added to RTE and source code content on repeated View Source toggling

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

CKEditor version 4.5.9. Tested in Firefox 46 and Chrome 50 on Windows 8.1

Please note that unlike previously raised ​http://dev.ckeditor.com/ticket/14647 I have now been able to confirm this bug in CKBuilder with minimal number and only CK Source created plugins

I believe this problem is related to the plugin ordering that CKBuilder is doing, rather than any it not being possible to have these plugins work together. As if you look at ​http://ckeditor.com/builder/fc05d38e49b04113eab3dd0ec9b18487 that is a download package with the exact same elements showing selected on CKBuilder UI web page, but that 2nd version does work correctly (however when I add all my desire plugins via CKBuilder I then can't get CKBuilder to produce a valid build for me)

Edit

This issue is about fixing BBcode plugin so that it works in certain situation. When building CKEditor with BBCode plugin and displaying default sample, extra nodes are added while switching between source/wysiwyg. The plugin should be adjusted to handle that as content is basic sample is very basic.

Steps to reproduce

1. Configure "ar" as a language
2. open CKEditor
3. Some Icons at Arabic UI are missed Mirroring

Expected result

Attached Image illustrates what I mean

Actual result

Attached Image illustrates what I mean

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

Steps to reproduce

1. Go to ​http://ckeditor.com/demo#full.
2. Open dev tools and paste CKEDITOR.instances.editor1.on( 'change', function() { console.log( 'change', arguments ) } ) in the console.
3. Select part of the text.
4. Drag the text and drop it inside editor.
5. Select some text and press delete button to remove it.

Same happens when dropping text from outside of the editor.

Expected result

The change event is fired after content/text is removed.

Actual result

After D'n'D the first remove operation does not trigger change event.

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

CKEditor 4.5.9, tested on Chrome 51 and FF 46.

Steps to reproduce

(This is done in the demo site)

1. Create a list
2. Create a table in the list item
3. Move the cursor to the right of the table (using arrow key)
   (Firefox & IE - you must add text and then hit Enter after getting out of table. Please read Other Details Note)
4. Hit enter
5. A new list item is created, but with a p tag
6. Hit enter again
7. all further list items are created with p tags

Expected result

New list items should just be an empty li

Actual result

All the rest of the list items automatically have p tags within

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

Demo site with Chrome. We observe this in our build which is based on 4.5.7 as well.

In Firefox & IE, pressing right from the last table cell puts you in a new p tag within the original list item. if you do not type anything into this new p tag, when you press enter, the table gets destroyed. If you do type into it, then you will observe the behaviour described where all the next list items will automatically have p tags

Steps to reproduce

1. Create 3x3 table
2. Split middle cell in middle row horizontally
3. Delete middle command

Expected result

Rowspan created for cells in second row should be removed

Actual result

Rowspan created for cells in second row is not removed. This will break table layout once you start adding new rows. Please try tabbing after deleting the column. When new row is created the layout gets broken.

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

Steps to reproduce

Write two lines in the editor in OS X Chrome. Separate the two lines by a whiteline. If 'show blocks' is clicked you should be able to see three lines of the type 'p'. When only the first line is selected and a heading style is applied (e.g. a H2), the line below will also be converted into a heading. This occurs in Chrome, but it doesn't in Firefox.

Steps to reproduce

1. Go to: ​http://ckeditor.com/demo#auto-grow

Or create a CKEditor instance this way:

CKEDITOR.replace( 'editor', {
	extraPlugins: 'autogrow',
	autoGrow_maxHeight: 500
} );

2. Type enough lines for the editor to stop growing.

Expected result

The editor grows with its content.

Actual result

The editor grows, but with each step a vertical scrollbar appears for a fraction of a second.

Steps to reproduce

1. Go to:

​http://sdk.ckeditor.com/samples/enterkey.html

2. Switch enter mode to BR
3. Enter sample text:

this is the first line

• line 2
• line 3

4. Put the cursor at the beginning of line 2 and press either outdent or the backspace key

Expected result

this is the first line
line 2

• line 3

Actual result

this is the first lineline 2

• line 3

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

Steps to reproduce

Scenario 1:

1. Open CKEditor instance & type 2 lines of text "aaaaaaaaaaaaaaa"

2. Select all by CRTL+A, copy (CRTL+C) & paste(CRTL+V)the text

Issue: You will see an extra new paragraph added below pasted text.

Scenario 2:

1. Open a CKEditor instance, type "aaabbbaaa"

2. Select part of word (ex: "bbb") and CTRL+C to copy

3. Go to end of text area of CKEditor & paste(CTRL+V)

Issue: An extra space will be added after pasted text

Wikipedia Link for Japanese writing system. ​https://en.wikipedia.org/wiki/Japanese_writing_system

platform to reproduce: IE11 only Input method: windows IME

Steps to reproduce:

1. Open an editor

2. Input Japanese chars, in Hiragana. e.g. input "さいげん" (saigen)

3. IME will help you to convert Hiragana to Kanji. ("さいげん" -> "再現")

さ: ​http://graphemica.com/%E3%81%95 い: ​http://graphemica.com/%E3%81%84 げ: ​http://graphemica.com/%E3%81%92 ん: ​http://graphemica.com/%E3%82%93 再: ​http://graphemica.com/%E5%86%8D 現: ​http://graphemica.com/%E7%8F%BE

3. Try to repeat steps 2 & 3.

4. sometimes the Kanji will break:
   • "再" is missing after conversion, only "現" remains.
   • it shows "再現さ再現", or some other combination of both Hiragana and Kanji.

This issue not reproducible in other browser or application (e.g. notepad). See attachments for more information.

This is customer reported PMR & high priority for us

Steps to reproduce

1. Copy/Paste attached file into your ckeditor folder and open it in a browser (simplebox plugin is a requirement)
2. Insert simple box.
3. Click inside Content... and press Ctrl+A/Del to clear all text.
4. On element's path click on right most div or p.
5. Click Insert List button

Expected result

List gets inserted

Actual result

Java Script error gets thrown
Message: Cannot read property 'isContextFor' of null
Line: 75
Code: /ckeditor-dev/core/command.js

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

Problem can be reproduced from CKEditor 4.3 in Blink browsers only (Safari on Mac works fine)

Steps to reproduce

1. Open basic toolbar configurator
2. Start tabbing

Expected result

You should be able to focus buttons.

Actual result

Whole panel is not accessible. You need to click on one of the buttons and now you can tab through them but that initial click is needed.

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

Steps to reproduce

1. create a custom template with code below
2. click Templates in editor and choose the custom template
3. first try with "replace actual contents" and then without, viewing the source code each time. The link to the CSS file will not be in the source if not replacing actual contents.

Custom template

You might need to create your own CSS file or change the href.

<link href="/templates/common/responsive.css" rel="stylesheet" type="text/css" /> <div class="fullwidth"> <h2>Title</h2> <p></p> </div>

Expected result

not checking the "replace actual contents" checkbox should render the template same as checking it

Actual result

link to CSS file is stripped from source code if checkbox is not checked

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

• latest versions of Firefox, Firefox DE, and Chrome
• OS X 10.11.5
• CK editor version is 4.5.10

Steps to reproduce

1. Add widget with tag name 'cnn:news' widget template is '<cnn:news>Some news</cnn:news>'

2. In source mode ckeditor add next html:

<h1>111</h1> <cnn:news>Some news</cnn:news>

<h1>111</h1> <cnn:news>Some news</cnn:news>

<h1>111</h1> <cnn:news>Some news</cnn:news>

3. Push up button "source" and push down again
4. And we see:

<h1>111</h1> <cnn:news>Some news</cnn:news>

<h1>111</h1>

<h1>111</h1> <cnn:news>Some news</cnn:news>

5. There were only two widget tags

Steps to reproduce

1. Go to ​http://sdk.ckeditor.com/samples/codesnippet.html
2. Clear Everything and start writing a list (bullet or numbered)
3. Create a code snippet inside a list
4. After code snippet is created, press the right arrow key to bring the focus to the next line.
5. Press Enter key.

Expected result

We get a new list element

Actual result

Previous list element with the code snippet disappears

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

All Browsers

This is happening for all block level widgets.

Steps to reproduce

1. Select strikethrough
2. Type something;
3. Clear Formats by "Tx";
4. Hit enter and type

Expected result

Strikethrough option should not be selected and you should be able to type normal text.

Actual result

Strikethrough option is selected.

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

Problem can be reproduced in all browsers starting from CKEditor 4.1. In version 4.1 it is not possible to remove strikethrough and starting from 4.1.1 this TC applies.

Steps to reproduce

1. change all locale to Japanese
2. open the demo site (​http://ckeditor.com/demo) and type some Japanese character
3. select those Japanese character and set Italic

Expected result

the selected text will set to Italic

Actual result

the selected text will still keep non-Italic

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

Win10+IE11/Edge

OS locale set to Japanese Browser locale set to Japanese (try to make sure it's 100% Japanese... it's the key to reproduce. i have a Win10 VM that cannot reproduce this and i suspect it's because it's not set Japanese completely)

Details

In my particular instance I am using Cordova 6.0.0. Running the application in the browser does not produce any issues but when you compile it to a Windows app you get:

 APPHOST9602: 'javascript:' is an invalid attribute value and will be ignored.  Don’t use 'javascript:' URIs in the local context.

I should also note that text entry and most buttons become disabled.

As you probably know this is because the buttons in the toolbar use anchor tags with href attributes like:

href="javascript:void('something')"

Here is the native ​security policy for Windows applications

There is ​another issue open on stackoverflow that references the same thing but for ionic framework

Steps to reproduce

1. Create a hybrid application
2. Compile it to Windows
3. Run to see issues about javascript:void in href

Expected result

No errors and full functionality.

Actual result

Buttons and text entry are not disabled and buttons work as expected.

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

• Windows 10
• Cordova 6.0.0
• VS 2015 Update 3
• CKEditor 4.5.9

It would make easier to apply certain dropdown styles (like headers, paragraph) if those were accessible with a hotkey.

Now the only way to add those is by navigating though format dropdown.

Currently impossible to do that with a custom config, using ​config.keystrokes property, because operations done by format plugin aren't exposed as commands.

Steps to reproduce

1. Full 4.5.10 download
2. extraPlugins: 'autogrow',

Expected result

not to mess with the HTML CODE

Actual result

<body style="height: auto; min-height: auto;">

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

FF, Windows 10, 4.5.10

Steps to reproduce

1. Create any link
2. Select the link and create anchor
3. Remove anchor

Expected result

There are no name and id attributes

Actual result

The link still has id attribute

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

Brief summary

If I have a big image in the editor and I open it in iOS 9, everytime I add a new letter to the editor the iframe is scrolled to the top, so I cannot see the inputted text.

Steps to reproduce

1. Create an editor with some content already added. This content should have at least one image with a big height. In some of my tests I used ​http://ckeditor.com/demo, I inspected the iframe and added the following property to the first image: height="720".

1.1 You can also use this codepen: ​http://codepen.io/anon/pen/WxzExZ/

2. Open the page in an iPad with iOS 9 (I'm using 9.3.2).
3. Scroll down until the image disappears from the screen.
4. Place the cursor at the end of some line and click some letter in the virtual keyboard.

4.1 In the codepen I wrote after the text: Do not create that page?

Expected result

The letter is written and the iframe is NOT scrolled at all.

Actual result

The iframe scrolls to the top, so I cannot see the letter I have just inputted. After this I cannot scroll the iframe at all.

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

I reproduce it in Safari in an iPad with iOS 9.3.2, using the latest CKEditor version with default plugins.

Steps to reproduce

1. With the example page, select some text (anywhere seems to work).
2. Hit the button -- which runs the following code :

      function scroll() {
         var selection = editor.getSelection();
         selection.scrollIntoView();
       } 
   

Expected result

The selection is scrolled into view, but remains the same selected text.

Actual result

The selection expands to the enclosing paragraph.

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

Tested on Chrome

Steps to reproduce

1. Add button to toolbar with any command from plugin 'table' or 'tabletools';

For example:

CKEDITOR.replace( 'editor1',{
    on: {
        pluginsLoaded: function( evt ) {
            var ed = evt.editor;
	    ed.ui.addButton( 'tableDelete', {
                label: ed.lang.table.deleteTable,
                icon: 'tests/tickets/279/tabledelete.png',
                command: 'tableDelete'
	    });
        }
    }
});

Expected result

Table-related buttons must be disabled by default when editor is ready. And enabled when cursor placed inside table.

Actual result

Table-related buttons enabled when editor is ready.

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

Plugins: wysiwygarea, toolbar, table.

Commands provided by plugins 'table', 'tabletools' is context-sensitive, therefore they must need have add startDisabled: 1 in definition

I'll make pull-request with changes and test based on ​https://github.com/ckeditor/ckeditor-dev/pull/279 after create this issue.

This issue related to:

• #4717 - Remove Link and Outdent buttons should be disabled before editor gets focus.
• #10439 - Initial command states are naive, biased and buggy

Steps to reproduce

1. Open any sample page say api.html in Chrome and set pasteFilter config to null and allowedContent to true.

   CKEDITOR.replace( 'editor1', {
   	allowedContent : true,
   	pasteFilter : null,
   ...
   

2. Open ​http://ckeditor.com/demo#div in IE browser and copy two paragraphs
3. Paste the content in api.html page which is opened in chrome and go to Source mode

Expected result

Only two paragraphs get pasted.

Actual result

It looks like paragraph plus every node above/below also get pasted.

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

This is a special case where you need to disable pasteFilter to get this result. User who reported it, does some paste filtering on his own but he can't really do much in this case as he doesn't know what the original selection from other browser was.

This doesn't happen in native contenteditable thus I have decided to report it.

Problem can be reproduced when copying from IE and pasting into Chrome or Firefox.

Steps to reproduce

1. Create 4x4 table and fill each column with same number 1 2 3 4
2. In second row merge cell 2 & 3. Alternatively you can use source code below.

   <table border="1" cellpadding="1" cellspacing="1" style="width:500px">
   	<tbody>
   		<tr>
   			<td>1</td>
   			<td>2</td>
   			<td>3</td>
   			<td>4</td>
   		</tr>
   		<tr>
   			<td>1</td>
   			<td colspan="2" rowspan="1">23</td>
   			<td>4</td>
   		</tr>
   		<tr>
   			<td>1</td>
   			<td>2</td>
   			<td>3</td>
   			<td>4</td>
   		</tr>
   		<tr>
   			<td>1</td>
   			<td>2</td>
   			<td>3</td>
   			<td>4</td>
   		</tr>
   	</tbody>
   </table>
   

3. Select merged cell 23 and cell 4 next to it.
4. Right-Click, Select Column-> Delete Columns.

Expected result

All 3 columns get deleted.

Actual result

Column 3 & 4 gets deleted but Column 2 stays. If you try the same with non-merged cells, all three columns get deleted.

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

Problem can be reproduced in every browser at least from CKEditor 4.0

Page crashed when typing multi-byte characters( Japanese in my test ) after hitting enter key in any cell.

Steps to reproduce

1. Paste this HTML in source mode.

   <table align="left" border="1" cellpadding="1" cellspacing="1" style="width:100%" summary="">
   <caption>
   <p style="text-align: left;">sample</p>
   </caption>
   <tbody>
   <tr>
   <td style="height:auto; width:13%">sample</td>
   <td style="height:auto; width:85%">sample</td>
   </tr>
   <tr>
   <td style="height:auto; width:13%">sample</td>
   <td style="height:auto; width:85%">sample</td>
   </tr>
   <tr>
   <td style="height:auto; width:13%">sample</td>
   <td style="height:auto; width:85%">sample</td>
   </tr>
   </tbody>
   </table>
   
   <p>&nbsp;</p>
   

2. Change to WYSIWYG mode.

3. Try to input multi-byte characters in any cell.

Expected result

Multi-byte characters are normally input.

Actual result

Page crashed and reloaded with message said: web page is not responding.

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

Happened on Windows7 + IE11 and Windows8 + IE11.

Steps to reproduce

1. Open ​http://ckeditor.com/demo#standard
2. Open Styles dropdown
3. Scroll to the middle using mouse scroll.
4. Close dropdown without selecting style.
5. Open dropdown once again
6. Scroll down

Expected result

I expect that it will work in the same way as in FF. Elements should scroll down without scrolling to the top.

Actual result

When I open Styles dropdown I can see that list is scrolled to the same position as it was when I closed. After scroll down list is scrolled to the top and next moved few elements down.

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

Chrome browser version: 52.0.2743.82 m OS: Windows 10

Currently, the text entry field in the color picker dialog has no validation whatsoever, not even a maxlength. Knowing that there are 140 named colors and that other colors should be specified as a hex value, it should be possible to validate the input to that field to at least warn users when an invalid named color or an invalid hex color has been specified.

Possible error messages are:

1. You have entered an invalid color name. Did you mean to enter a hex code? (Don't forget to include the #)
2. You have entered an valid hex code. Did you mean to enter a named color?

Reported on Zoho as tickets 18892 and 18929.

We are using 4.5.2 version of ckeditor in Oracle PeopleSoft application page.

We are facing following issue on the iPad mini device (browser details attached) and this issue is seen in "Standard editor" on ​http://ckeditor.com/demo website also.

Steps to reproduce

1. In the editor area type the text continuously till it crosses the editor frame limit.

Expected result

It should be possible to scroll the editor content horizontally and the cursor should stay in the editor.

Actual result

The cursor focus moves out & also unable to scroll horizontally.

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

Mobile Safari 9 on iOS 9.2

Steps to reproduce

Our application is setting shortcuts Ctrl+Alt+i in Windows and Ctrl+Cmd+i in Mac version and they works fine until editor is focused.

We are checking exactly which modifier keys are used and act only when exact combination is pressed. We find out that editor is handling Ctrl+Cmd+i shortcut and stopping event propagation. What a nasty boy!

I digged into source code and find method getKeystroke, which do:

if (this.$.ctrlKey || this.$.metaKey)  a += CKEDITOR.CTRL;

So you can make text italic with: Ctrl+i, Win+i, Cmd+i, Ctrl+Win+i, Ctrl+Cmd+i! This is not mentioned in documentation, where is explicitly mentioned Ctrl+i.

Expected result

I expect that editor will distinguish Ctrl and Meta key and do what is in documentation -> handle only Ctrl+letter shortcuts. If you want to support also meta key, please, to it in smarter way, that both shouldn't be pressed:

if ((this.$.ctrlKey || this.$.metaKey) && !(this.$.ctrlKey && this.$.metaKey))  a += CKEDITOR.CTRL;

Actually there should be some configuration option to set behavior for this method.

And last comment. What about to do not stop event propagation (​https://css-tricks.com/dangers-stopping-event-propagation/) and just prevent events defaults?

Actual result

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

Used version:"4.5.4 (Standard)",revision:"d4677a3".

Steps to reproduce

1. go to a page with a DIV contained ckeditor
2. tab past the editor
3. press the down or right arrow key

Expected result

nothing happens, unless I specify page changes based on these key events

Actual result

Focus is moved to the nearest editor. This causes major accessibility issues for keyboard and screen reader users.

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

1. CKE listens to the down key and left key (along with some other events) on "document" object.

2. it perform a check if the browser is of type webkit before it removes the 0 width space char

3. Code which does this ​https://github.com/ckeditor/ckeditor-dev/blob/master/core/selection.js#L720

4. While removing this char it fires the focus event to make CKE focusable but never gains the focus back to original element.

5. CKE can be used in 2 modes - one with iFrame contained and one with DIV contained. when iFrame contained this issues doesn't happen because "document" object that looks for event is iframe specific. Only key events fired in iFrame context gets through this code not the entire page keyevents.

6. When CKE is DIV contained - key events for the entire page gets handled.

Steps to reproduce

1. In file "core/dom/domobject.js", at around line 45, modify function "getNativeListener()" by modifying the if statement that conditions the "domObject.fire()" call, such that it is preceded by a statement like console.log("Handling event:"+event).
2. In "plugins/wysiwygarea/plugin.js", at around line 321, at the beginning of definition of function "setData", put in a statement like console.log("In 'setData' at top");
3. Run any program that uses CKEditor. I am using the textarea/iframe type set-up, with five editors opening one right after the other.

Expected result

When the "load" event occurs, "setData" should get called once.

Actual result

After "load" finished, "setData" gets called a second time.

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

For my five text areas, all five sequences of "load" then "setData" are finished before the next set of five "setData" calls begins.

Steps to reproduce

1. Go to: ​http://ckeditor.com/demo
2. Click the "Full featured" link on the left (to create a history step).
3. On the Full Featured demo page click the Maximise icon to open the editor in full screen.
4. Click the browser's history back button.

Expected result

The demo page should be displayed as before.

Actual result

The demo page loads but the HTML element is still assigned with style="position: fixed; z-index: 9995; width: 0px; height: 0px;" and the Body element with style="position: static; z-index: 9995; width: 0px; height: 0px;" resulting in the page being squashed to the lefthand side.

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

Safari Version 9.1.2 (11601.7.7)

Steps to reproduce

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

Expected result

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

Actual result

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

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

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

Steps to reproduce

1. Ckeditor open in desctop resolution
2. Add an image
3. Double click on that image
4. Popup will be apopear where you can edit height and width
5. Same page will be open in mobile resolution
6. Double click on that image
7. Only screen will be zoom In no popup will be appear how i can edit that image in mobile resolution

Expected result

On mobile popup will be appear where we can edit the image's height or width

Actual result

Zoom in when we click on image on mobile view but on desctop it works fine

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

issue in on mobile resolution and in mobile

Steps to reproduce

Paste the following 4 lines in full ckeditor, or type them in (use a line break and not a new paragraph after each line). If pasting, make sure pasting as plain text.

One
Two
Three
Four

Select the 4 lines and change the font to another font (for example, Courier New).

With the 4 lines still selected, click the Insert/Remove Numbered List. It will look like this

1.
   One
2.
   Two
3.
   Three
4. Four

The first 3 list items have a line break injected after the number and before the text.

Expected result

1. One
2. Two
3. Three
4. Four

Actual result

1.
   One
2.
   Two
3.
   Three
4. Four

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

Browser: Chrome 52.0.2743.116 on Windows 7

Editor version: ckeditor Version 4.5.10, 13 Jul 2016

Also tried in nightly build 30-Aug-2016 full editor and had same results.

Steps to reproduce

1. Type some contents in CKEditor (such that scrollbar is showing).
2. Scroll down and tap somewhere in the middle.
3. Paste some data (plain text) from clipboard after holding on the caret and selecting 'Paste'

Expected result

The pasted content must appear on the caret position and the screen should be steady.

Actual result

The contents in the editor scrolls up and down. Sometimes the entire screen scrolls up and down especially when zoomed-in . The pasted content appears on the caret position. But hard to find where it is.

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

On most of the iOS versions including tablets. Browsers : Safari and Chrome.

Steps to reproduce

1. Create a widget which allows inserting table inside editable. You can modify simple box.
2. Insert a table inside the widget.
3. Click inside first table cell and press tab

Expected result

Focus is moved to next table cell like in case of table not inserted into widget.

Actual result

Focus is moved to next widget or out of the editor.

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

Steps to reproduce

1. add plugin "color button" to CKEditor with Office 2013 theme
2. Create a form like this :

<form style="margin-left: 80px;">
        <textarea name="editor1" id="editor1" rows="10" cols="80">
        </textarea>
        <script>
            var config = {
                language : 'en',
                height : '500',
                width : '600',
                colorButton_colors : 'FF8C00,FFFF00,00FF00,FF00FF',
            }
            CKEDITOR.replace('editor1', config);
        </script>
</form>

3. Pass you mouse on every color of the color selector

Expected result

The colors are named in ordre : Dark Orange, Yellow, Lime, Fuchsia (or Magenta ?)

Actual result

The colors are named in ordre : Dark Orange, Yellow, Lime, FF00FF

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

tested on IE11 (11.0.9600) and Firefox 47 plugin color button : office 2013 theme tested on version 4.5.6 too.

Steps to reproduce

1. Go to ​http://tests.ckeditor.dev:1030/tests/plugins/uploadwidget/manual/image2.
2. Drop image into editor.
3. Select the image with some surrounding text.
4. Delete selection while the image is still being uploaded.
5. Click undo.

Expected result

Deleted text should be brought back (without image) by undo.

Actual result

Deleted text is brought back (without image) by undo and error is thrown (in Chrome: Uncaught IndexSizeError: Failed to execute 'setEnd' on 'Range': There is no child at offset 11.; in Opera: Uncaught IndexSizeError: Failed to execute 'setEnd' on 'Range': The offset 7 is larger than or equal to the node's length (5).)

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

Steps to reproduce

1. Go to ​http://ckeditor.com/demo#div.
2. Scroll editor viewport a little bit and select some text.
3. Open Link dialog.
4. Put ckeditor.com in the URL field.
5. Click cancel.
6. Click ok on the confirmation dialog.

Expected result

The dialog is closed, selection and scroll position in the editor does not change.

Actual result

The dialog is closed, the editor viewport is scrolled to the top and caret is placed on the beginning of the editor content.

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

Safari 9.1.3

With the addition of ​#7154, the new ​link test case started to fail on IE8.

The issue is that a element applied by CKEDITOR.style wraps also non-editable element, which is not the case in any other browser.

Steps to reproduce

1. Open the editor in IE9 with quirks mode enabled (remove doctype from your HTML file to force it)

Expected result

Editor is visible.

Actual result

Editor does not load up.

It's a regression after commit ​f03be954f37ed07c59baa10e60d8e6023c245fbf.

Steps to reproduce

1. Open test.html page
2. Switch to HTML Source tab
3. Observe meta tag, trailing slash is removed

Expected result

mata tag is converted into (XHTML) self-closing tag with trailing slash: e.g. <meta charset="utf-8" />

Actual result

mata tag is converted into self-closing tag without trailing slash: <meta charset="utf-8">

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

#8031 long ago fixed the issue of [required] on a replaced textarea making submission impossible.

However, it seems that the same problem is present if CKEDITOR.inline is used to replace the textarea rather than CKEDITOR.replace. The code for handling the presence of [required] only seems to exist for themedui, not inline.

It seems the check for "saved [required]" to actually prevent submission and fire events is in onSubmit, and so is already used by both the replace and inline codepaths. It's just that inline doesn't check for the presence of [required] when creating the editor.

Steps to reproduce

For the following markup, if you try to delete the bullet in wysiwyg (backspace), it will not get deleted.

<p>&nbsp;</p>

<ol><br />
	<li>&nbsp;</li>
</ol>

<p>&nbsp;</p>

if you toggle Source, the OL>LI will come back. Same thing will happen if you persist markup on the server and reload it into another instance of cke - you will get the bullet list back ever though you thought you had deleted it.

Expected result

A clean up of orphaned <OL> needs to occur

Actual result

<OL> remains when <LI> is removed

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

Chome 52.0.2743.116 (64-bit) Mac CKEditor 4.5.11

Steps to reproduce

1. Open ​http://ckeditor.com/demo#full.
2. Open source mode and paste:

   <table border="1">
   	<tbody>
   		<tr>
   			<td>Cell 1.1</td>
   			<td>Cell 1.2</td>
   		</tr>
   	</tbody>
   </table>
   

3. Switch back to WYSIWYG mode.
4. Select both cells.
5. Click right menu button. Choose "Cell" → "Insert Cell Before".
6. Click right menu button once more. Choose "Cell" → "Insert Cell After".

Expected result

• The first new cell is inserted at the beginning.
• The second new cell is inserted after the first cell.

Actual result

• The second new cell is inserted before the first cell.

It seems to be caused by the fact that the selection's offsets after inserting new cell are not updated and pointing to the new cell instead of the existing one.

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

Firefox 48.0 on Ubuntu 16.04

Steps to reproduce

1. Create two styles that both applies to the same elements (well in fact, it seems the problem maybe only related to the "image2" plugin. I can say so, because I have the same stuff for "table" element)
2. One with one class. In example : fullWidth
3. Second with two classes which one is the same as the first style.
4. In the editor, add an image element that you set the style "Styles_Base_FullWidthWithoutLeftMargin"

Styles.js Example

    	{
    		name: $l('Styles_Base_FullWidthWithMargin'),
     		type: 'widget',
     		widget: 'image',
    		attributes: { 'class' : 'fullWidth' }
    	},
    	{
    		name: $l('Styles_Base_FullWidthWithoutLeftMargin'),
     		type: 'widget',
     		widget: 'image',
    		attributes: { 'class' : 'fullWidth outSectionBodyLeft' }
    	}

HTML example

<p>
	<span tabindex="-1" contenteditable="false" data-cke-widget-wrapper="1"
		data-cke-filter="off"
		class="cke_widget_wrapper cke_widget_inline cke_image_nocaption"
		data-cke-display-name="image" data-cke-widget-id="0" role="region"
		aria-label="Élément  image"><img alt="" height="500"
		data-cke-saved-src="IMAGE_URL_REMOVED" src="IMAGE_URL_REMOVED"
		width="1500" class="cke_widget_element outSectionBody fullWidth"
		data-cke-widget-data="%7B%22hasCaption%22%3Afalse%2C%22src%22%3A%22IMAGE_URL_REMOVED%22%2C%22alt%22%3A%22%22%2C%22width%22%3A%221500%22%2C%22height%22%3A%22500%22%2C%22lock%22%3Atrue%2C%22align%22%3A%22none%22%2C%22classes%22%3A%7B%22outSectionBody%22%3A1%2C%22fullWidth%22%3A1%7D%7D"
		data-cke-widget-upcasted="1" data-cke-widget-keep-attr="0"
		data-widget="image"><span
		class="cke_reset cke_widget_drag_handler_container"
		style="background: url(&quot;URL_REMOVED/ckeditor/plugins/widget/images/handle.png&quot;) rgba(220, 220, 220, 0.498039); top: -15px; left: -20px; display: block;"><img
			class="cke_reset cke_widget_drag_handler"
			data-cke-widget-drag-handler="1"
			src="data:image/gif;base64,R0lGODlhAQABAPABAP///wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw=="
			width="15" title="Cliquer et glisser pour déplacer" height="15"
			role="presentation" draggable="true"></span><span
		class="cke_image_resizer"
		title="Cliquer et glisser pour redimensionner">&#8203;</span></span>
</p>

Expected result

Reopening the style combo show only the second style selected, not the first.

Actual result

Reopening the style combo show both styles selected.

Fix

This could resolved by looking at the classes in the combo that search via a regex which is set to full word. I didn't look the code, but as I saw in other issues, it seems that the editor splits the classes using a space to find the correlated style.

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

Not relevant except for the image2 plugin installed. Though, just saying the "$l" function is just a translating function of my own.

Steps to reproduce

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

Expected result

It should not be possible to type characters.

Actual result

It is possible to type characters.

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

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

Steps to reproduce

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

<head>

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

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

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

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

This works.

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

Tried using Doctype config property. Still does not work.

Expected result

It should work in Edge even without Doctype declaration.

Actual result

It does not

Other details (Edge, Win 10,Full 4.5.11)

We faced this issue in different conditions but there are the steps to consistently reproduce it. It seems normalization of bookmark sometimes works incorrect so Undo feature stops to work.

Steps to reproduce

1. Open CKEditor demo ​http://ckeditor.com/demo
2. Clear all contents
3. Enable SCAYT
4. Apply Heading 1
5. Type something like "abababab" then hit Shift+Enter
6. Move focus out of the editor
7. Click inside editor to back focus and hit Shift+Enter again
8. Type "test" and select it
9. Apply Heading 2
10. Perform Undo one or two times

See attached video with all of these steps.

Expected result

Undo works

Actual result

Undo doesn't work. There is JS error ckeditor.js:415 Uncaught IndexSizeError: Failed to execute 'setStart' on 'Range': There is no child at offset 6.

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

Chrome

There is one more case with the same error.

Steps to reproduce

1. Open CKEditor demo ​http://ckeditor.com/demo
2. Place cursor after the heading and hit Shift+Enter
3. Move focus out of the editor
4. Back focus and type "test"
5. Select "test" and apply Heading 2

JS error in console: ckeditor.js:380 Uncaught IndexSizeError: Failed to execute 'setStart' on 'Range': The offset 7 is larger than or equal to the node's length (4).

Steps to reproduce

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

   config.allowedContent = true;
   

2. In the content add

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

and an inline image (without caption)

3. In design mode drag the image into the span

Expected result

The image is shown now inside the span

Actual result

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

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

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

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

Steps to reproduce

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

   config.allowedContent = true;
   

In the content add

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

(adjust image path as needed)

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

Expected result

The image element is moved out cleanly

Actual result

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

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

Tested with Firefox, Chrome and Edge

Steps to reproduce

1. Open nightly build
2. Copy content from notepad where there are few empty paragraps between content
3. Paste in editor body

Expected result == Content pasted properly with empty paragraphs

Actual result : All empty paragraphs are removed in pasted content.

Steps to reproduce

1. Create a plugin which uses a widget - a simplified version of plugin I am experiencing this issue on is:

CKEDITOR.plugins.add( 'ipsquote', {
    requires: 'widget',
    icons: 'ipsquote',
    hidpi: true,
    allowedContent: 'blockquote',
    init: function( editor ) {
	    editor.widgets.add( 'ipsquote', {
			/* Basic Widget definition */
			button: "Quote",
	        template: "<blockquote class='ipsQuote' data-ipsQuote><div class='ipsQuote_citation'>Quote</div><div class='ipsQuote_contents ipsClearfix'></div></blockquote>",
	        editables: {
		        content: {
		            selector: '.ipsQuote_contents'
		        }
		    },
		} );
} );

2. Insert content into the editor using insertElement() which mates the format of the widget created and includes code in <pre> tags. Then initiate the widget on that element. A simplified version of plugin I am experiencing this issue on is:

					var quote = "<blockquote class='ipsQuote' data-ipsQuote><div class='ipsQuote_citation'>Quote</div><div class='ipsQuote_contents ipsClearfix'><pre class='ipsCode'>Some code</pre></div></blockquote>";
					var element = CKEDITOR.dom.element.createFromHtml( quote );
					instance.insertElement( element );
					instance.widgets.initOn( element, 'ipsquote' );

Expected result

The provided content is inserted into the editor with the contents of the <pre> tags unmodified

Actual result

A blank line is inserted at the beginning of the <pre> tag

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

Steps to reproduce

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

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

Expected result

list should move with editor.

Actual result

list does not move with the editor.

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

Steps to reproduce

1. Create a table in ckeditor with 4 columns.
2. Insert text in the cells of the the first row. (formatting: bold)
3. Put cursor in the first cell in the first row and switch with tab to the next cell.
4. Type in new text to overwrite the selected text.

Expected result

The new text has the same formatting (bold) like the text before.

Actual result

In Firefox and sometimes in IE the text lost the formatting. In Chrome not.

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

Browser: Firefox 45.3.0, Internet Explorer 11, Chrome 53

Steps to reproduce

1. Open a page in IE11 that has about 5 ckeditors on a single page.
2. scroll down the page to a ckeditor that you can not see unless you scroll.
3. put the cursor in that ckeditor and type a word and then hit enter.
4. The cursor stays in the ckeditor but the webpage randomly scrolls downward and you have to scroll back up to find where your cursor is.

This does not happen in Firefox, Chrome or MS Edge. The check editor doesn't scroll when enter is pushed in those browsers. In the config.js I have the doctype set to html 4 and it does not help per issue ​https://dev.ckeditor.com/ticket/9136. I am using ckeditor 4.5.11. This is happening only in IE 11 in Windows 10 and Windows 7.

Steps to reproduce

1. open ​http://ckeditor.com/demo
2. go to Source view
3. delete all content
4. go to WYSIWYG view
5. enter sample text: "Test"
6. select text "Test" and apply by mouse click: bold, Styles: Inline styles: Marker, Paragraph Format: Heading 1
7. copy all with Copy button
8. open new tab ​http://ckeditor.com/demo
9. repeat steps 2, 3, 4
10. paste with Ctrl/Cmd+V
11. pasted text "Test" has bold but Styles and Paragraph Format settings are missing (those are not the only one getting removed) in CKEditor 4.4.7 all the formatting was preserved.

Expected result

All styles created in WYSIWYG CKEditor version >4.4.7 should be preserved after copy&paste between different editor instances of the same version. Just like it was in CKEditor version 4.4.7.

Actual result

Various styles created in WYSIWYG CKEditor version >4.4.7 are getting removed after copy&paste between different editor instances of the same version.

Steps to reproduce

1. Switch the editor content by setting editor.data.
2. Repeat it many times and the CPU usage grows to 100%.

Expected result

Actual result

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

There are at least two identified source of leaks:

1. the clipboard plugin: a 'destroy' event listener is added each time content is loaded but never recycled.

(​http://docs.ckeditor.com/source/plugin13.html)

editor.on( 'contentDom', addPasteListenersToEditable ); function addPasteListenersToEditable() {

... editor.on( 'destroy', function() {

clearTimeout( mouseupTimeout );

} );

}

2. the magicline plugin: ​https://github.com/ckeditor/ckeditor-dev/blob/master/plugins/magicline/plugin.js#L277 But for this one I think I'll have to create a bug for them, not for you.

==

Steps to reproduce

1. create a ordered list in MS word.
2. copy & paste the content into ckeditor,after applying the filter its modifying the content as follows:

<ol>
<li style="font-style: normal; font-weight: normal; margin-top: 0in; margin-bottom: 0pt;">Test1</li>

<li style="color: rgb(0, 0, 0); font-family: Calibri,sans-serif; font-size: 11pt; font-style: normal; font-weight: normal; margin-top: 0in; margin-bottom: 10pt;">Sdfas</li>

</ol>

3. As you can see its not retaining the font size for the first <li> tag

Expected result

it should retain the font size for the first li item

Actual result

removing the font size from the 1st li tag

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

reproducible in IE

Steps to reproduce

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

Expected result

selecting tab 1 will bring you back to tab 1 one

Actual result

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

Work Around

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

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

I'm trying to integrate a speech plugin (based on another app of us) into CKEditor. The plugin is integrated seamlessly and correctly, props for the CKEditor team for that easyness.

Thing is we can dictate normal text and also use voice commands with the plugin, like the type of "Go to X", "Go to next phrase", etc. These commands make use of char index based selection , so we have 2 methods that extrapolate the DOM nodes based selection system of the CKEditor API to char index based selection.

Those functions are:

1. SETSELECTION

this function does not show buggy behaviour

textHelper.setSelectionRange = function (editor, range) {

        //"range" is our char index based range

        var startSetted = false,
            endSetted = false,
            counter = 0;
        var editable = editor.editable();
        var ckRange = editor.createRange();
        ckRange.selectNodeContents(editable);
        var walker = new CKEDITOR.dom.walker(ckRange);
        var node = null;
        while ((node = walker.next()) && (!startSetted || !endSetted)) {
            var nodeLength = 0;
            if (node.type == CKEDITOR.NODE_TEXT ) {
                nodeLength = node.getText().length;
            } else if (node.$.nodeName == 'BR') {
                nodeLength = 1;
            }
            if (nodeLength > 1 || !node.hasNext()) {
                if (!startSetted && counter + nodeLength >= range.start) {
                    ckRange.setStart(node, range.start - counter);
                    startSetted = true;
                }
                if (!endSetted && counter + nodeLength >= range.end) {
                    ckRange.setEnd(node, range.end - counter);
                    endSetted = true;
                }
            }
            counter += nodeLength;
        }
        ckRange.select();
        editor.focus();
    };

2. GETSELECTION

this function DOES show buggy behaviour

textHelper.getSelectionRange = function (editor) {
        
        var ckRange = editor.createRange();
        ckRange.selectNodeContents(editor.editable())
        var walker = new CKEDITOR.dom.walker(ckRange);

        var start = 0, end = 0,

        //This is where the buggy behaviour occurs, this indexes don't always match those of the node that is selected (or where the cursor is), in the editable part of the editor

        selectionRange = editor.getSelection(true).getRanges(true)[0],
        si = selectionRange.startContainer.getIndex(),
        ei = selectionRange.endContainer.getIndex();

        for (var i = 0; i <= ei && (node = walker.next()); i++) {
            var nodeLength = 0;
            if (node.type == CKEDITOR.NODE_TEXT ) nodeLength = node.getText().length;
            else if (node.$.nodeName == 'BR') nodeLength = 1;

            if (i < si || (i == si && node.$.nodeName == 'BR')) start += nodeLength;
            else if (i == si) start += selectionRange.startOffset;

            if (i < ei || (i == ei && node.$.nodeName == 'BR')) end += nodeLength;
            else if (i == ei) end += selectionRange.endOffset;
        }
        return new invoxmd.Range(start, end);
        
    };

Steps to reproduce

1.

        selectionRange = editor.getSelection(true).getRanges(true)[0],
        si = selectionRange.startContainer.getIndex(),
        ei = selectionRange.endContainer.getIndex();

Indexes don't always match those of the node of cursor/selection, speech behaviour then becomes buggy, text is inserted when it shouldn't, etc.

Expected result

Indexes always match those of the node of cursor/selection.

Actual result

Indexes don't always match those of the node of cursor/selection, speech behaviour then becomes buggy, text is inserted when it shouldn't, etc.

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

Chrome, Windows 10 x64, 4.5.11, full editor

Taken from #14853 where user sugests simplification of link and image dialogs.

"For links, there really should be no more than the text, the URL, and whether to open in a new window. People rarely manually type in a URL. They paste URLs into the editor. Realistically it should automatically make into a link if it detects the proper format. The link menu doesn't need a protocol - nobody understands what that is anyway, and when people paste a url, they hardly do so without the protocol. Just have a single string be whatever they want it to be, including the protocol. The tabs in the link menu are cumbersome and most of the options are rarely used by anyone who isn't already technical. At the very least, make an option to simplify the menu with a minimalist version. If the link looks like an email, then it should prepend "mailto:" to the URL when first typing (but not after they remove it again), maybe have a small note saying why. And if the selection looks like any sort of url (whether a link or an email), it should AUTOMATICALLY place that content inside the URL field. Make it easy on the user. "

In Firefox Version Firefox 49.0.1:

When a text is pasted from a word file or a Thunderbird e-mail the text is SOMETIMES pasted multiple times instead of just once. It's no issue with the clipboard since pasting it into notepad works just fine. Any hints on what might cause this issue are welcome. Thank you!

The issue is very similar to this one: ​​https://dev.ckeditor.com/ticket/12995

Steps to reproduce

1. visit ​http://sdk.ckeditor.com/samples/inline.html
2. View the div with id="introduction" (notice there isn't any styles)
3. Click "Start editing" button
4. Click "Finish editing" button
5. View the div with id="introduction" (notice style="position: relative" is present)

Expected result

The div with id="introduction" should not have any styles added

Actual result

The div with id="introduction" has "position: relative" added

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

Chrome v.53.0.2785.143 (64bit) OSX El Capitan

Steps to reproduce

1. CkEditor is launched from within a frame in HTML page. Please see code sample attached.
2. Launch the page. Create some content.
3. Open insert table dialogue.
4. Maximize editor using "resize" link.
5. Click on "Ok" in table dialogue.

Expected result

Table should get inserted at desired position.

Actual result

Nothing happens on browser. In debugger console, we see following error - SCRIPT5007: Unable to get property 'checkReadOnly' of undefined or null reference ckeditor.js (341,347)

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

• Using IE 11 browser in quirks mode.

Steps to reproduce

1. Go to ​http://ckeditor.com/demo, choose standard editor.
2. Copy some plain text from text editor, such as notepad or notepad++, and paste using Ctrl+V or Paste button inside some existing text which has a format, such as bold, italic, underline, strikethrough, or any combinations.
3. Notice the pasted text is remain plain text without any format, except using Ctrl+V in Chrome, it does not work using paste button in Chrome, or either case in FF or IE.

Expected result

The pasted text should have the same format where it is pasted in CKEditor.

Actual result

The pasted text does not have the same format where it is pasted in CKEditor.

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

CKEditor Version: CKEditor 4.5.11 as in CKEditor Demo Testing matrix:

devicePixelRatio is not a constant property, you can move browser between displays with a different pixel ratio.

This test case will require 2 screens witha different pixelratio.

1. Open editor in a web browser with a 1.0 devicePixelRatio.
2. Move web browser to the other, hidpi display.

Expected: Icons are updated to hdpi icons.

Actual: Icons remain blurry.

Actually if that's as simple as toggling cke_hidpi class it would be fairly simple to do that. However it will be a little harder with dev version, as it uses direct icon paths in a span.cke_button_icon.

I did not research it in deep, however there's a question on ​SO that might contain interesting information.

Steps to reproduce

1. Go to ​http://ckeditor.com/demo#full.
2. Switch to source and paste following html <p>This is <strong>example</strong> text</p>.
3. Switch back to WYSIWYG mode.
4. Focus content like <p>This ^is <strong>example</strong> text</p>.
5. Use keyboard (arrows + shift) to create selection like <p>This [is <strong>exam]ple</strong> text</p>.
6. Apply bold.

Expected result

Resulted html should be <p>This <strong>[is exam]ple</strong> text</p>.

Actual result

Resulted html is <p>This <strong>is <strong>exam</strong>ple </strong>text</p>. For most styles it is hard to notice, but for bold it creates double bolded text (at least in IE11).

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

Checked on IE11 in CKEditor 4.5.11. Does not occur in Chrome or FF.

See attached screenshot.

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

Safari on Mac. Happens only sometimes.

In the Image Info tab inside Image dialog there is some empty space (much more than in moono skin) which could be reduced to make this dialog more "elegant". See attached screenshot.

Steps to reproduce

1. Insert below code into editor and copy the list by selecting it from bottom to top

   <ul>
   	<li>test1
   	<ul>
   		<li>test2
   		<ul>
   			<li>test3
   			<ul>
   				<li>test4</li>
   			</ul>
   			</li>
   		</ul>
   		</li>
   	</ul>
   	</li>
   </ul>
   <p>&nbsp;</p>
   

Expected result

Whole list gets pasted.

Actual result

List gets pasted without fisr bullet:

<p>test1</p>
<ul>
	<li>test2
	<ul>
		<li>test3
		<ul>
			<li>test4</li>
		</ul>
		</li>
	</ul>
	</li>
</ul>

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

This is how it works in IE. Please use below code on HTML5 page and you will see it works like that.

<div style="margin: 20px; border:1px solid black; width:500px;" contenteditable="true">
<ul>
    <li>111
    <ul>
        <li>222
        <ul>
            <li>333</li>
        </ul>
        </li>
    </ul>
    </li>
</ul>
<p>&nbsp;</p>
<p>&nbsp;</p>
</div>

In CKEditor you can use elements path at the bottom. Just click on list and then on left most ul element to select whole list.
Ctrl+A also works and from what I have checked selecting from top t bottom does as well. Only select from bottom to top doesn't work but this is browser issue.

Steps to reproduce

1. Get any Notification from whatever source.

Expected result

Don't interfere with my editing.

Actual result

Popups show over my editing field distracting me from my work.

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

Please move notifications (at least "success", "info" and "progress") to the bottom status bar of the editor. Or give an option to do that. I get absolutely sick when unnecessary popups show over my editing field distracting me from my work.

Steps to reproduce

1. Use the attached simplebox1 widget (the same as simple box but content editable allows everything)
2. Clear editor contents and insert simplebox1
3. Select Content... and insert another simplebox1
4. At this stage you can see Paragraph below nested simplebox1 (#12778)
5. Click on that paragraph, next click on P in elements path and press Backspace to remove this paragraph
6. Move nested outside of the master widget

Expected result

The content editable of master widget stays

Actual result

The content editable of master widget is removed

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

Problem can be reproduced in all browsers.

Steps to reproduce

Can be easily reproduced on /tests/plugins/copyformatting/manual/safaricolor (for both editors).

1. Put caret inside first paragraph e.g. Text witho^ut any format.
2. Click Copy Formatting button.
3. Click on the last word (Orange) inside last paragraph (styling will be removed).
4. Click on the still styled word inside same paragraph e.g. Text with Bac^kground Colour Orange.
5. Click Copy Formatting button.
6. Click on the last word (Orange) inside last paragraph.

Expected result

On the second click styling should be copied, so word Orange should be styled same as rest of the paragraph.

Actual result

On the second click, styling is not applied.

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

IE11, FF (Chrome works as expected).

Steps to reproduce

1. Open ​http://tests.ckeditor.dev:1030/tests/plugins/widget/manual/block.
2. Drag and drop widget.
3. Click inside widget's editable.

Expected result

Editable's focused.

Actual result

Focus is moved to the beginning of the editor's content.

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

Safari 10.0.1 (12602.2.14.0.7)

Steps to reproduce

1. Open ​http://tests.ckeditor.dev:1030/tests/plugins/widget/manual/block
2. Insert a doublecolumn widget(empty icon).
3. Cut the code snippet widget that's placed lower and paste it into the first editable in the doublecolumn widget.
4. Click the Source button.

Expected result

Mode switched to source.

Actual result

Source button gets disabled.

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

Browser: Edge

Copy formatting command does not seems to have keystroke associated with the command. Because of that it does not show the hotkey in a tooltip as you hover the copy formatting button.

Steps to reproduce

1. Open CKEditor.
2. Mouse over the Copy Formatting button.

Expected result

Tooltip says "Copy Formatting (CTRL+SHIFT+C)" (or cmd for Mac).

Actual result

Tooltip says "Copy Formatting".

Steps to reproduce

1. Use tests/plugins/balloonpanel/manual/balloonpanel manula test.
2. Click on the first red fragment.

Expected result

The arrow is rendered correctly pointing on the red fragment.

Actual result

The arrow is rendered in the center of the balloonpanel.

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

Same result on both Chrome and FF. This behavior is only visible on the first balloonpanel appearance. After second click (even on the same fragment) the arrow is rendered correctly.

Steps to reproduce

1. Open nightly build ​http://nightly.ckeditor.com/16-11-07-07-07/full/samples/
2. Enter few lines of text.
3. Select all content using CTRL + A
4. Click on Increase Indent icon few times

Expected result : List Indented

Actual result: Nothing happens This works in Chrome

Steps to reproduce

1. Open ​http://ckeditor.com/demo.
2. Click "Anchor" button.
3. Type " " (space) into "Name" field and click "OK".

The anchor seems to be created, however:

1. Double click on it does nothing (should open properties dialog).
2. After switching to source mode and back to wysiwyg mode, the anchor is gone.

Steps to reproduce

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

Expected result

Widget is moved, everything else remains the same.

Actual result

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

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

Opera.

Steps to reproduce

1. Go to ​http://ckeditor.com/demo#widgets.
2. Use 3rd editor (Enhanced Image), switch to source mode and paste HTML

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

3. Switch back to WYSIWYG mode.
4. Drag and drop anchor into image description.

Actual result

The anchor can be drag and dropped into editable. When dropped it disappears (probably because of ACF applied to editable region).

Expected result

Not sure exactly what should happen, I assume the anchor should be not droppable if it's going to be removed anyway.

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

Tested on Chrome.

At the moment copyformatting plugin is not supported. It does not break the editor, however it is unusable. The main issues:

• Styles are not applied while tapping/moving selection to different element while copyformatting is active.
• Unable to use sticky mode (double tap zooms in/out).
• Keyboard shortcuts are also not supported.

Steps to reproduce

It is easily reproducible on tests/plugins/balloonpanel/manual/balloonpanel.

When clicking between red regions ballonpanel works fine. If you tap longer inside red region so that the caret is placed inside the red region (virtual keyboard opens and typing is possible) and then switch / move focus to other regions the ballonpanel (position and content) is not updated.

See attached screenshot - the caret is already inside different region (on the right) while balloonpanel is not updated.

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

Safari, iOS 9.3.1.

Steps to reproduce

Visible in both tests - tests/plugins/balloonpanel/manual/kama and tests/plugins/balloonpanel/manual/moono.

The balloonpanel for inline editor is positioned incorrectly (see screenshots).

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

Safari, iOS 9.3.1.

Steps to reproduce

1. Go to ​http://ckeditor.com/demo#widgets.
2. Focus code widget inside second editor.
3. Click somewhere else to focus the text.
4. Press enter.

Expected result

The newline is inserted (the caret is placed in the text content).

Actual result

The widget editing dialog is opened.

As you may see on attached screenshot, the caret was placed on the tap position and virtual keyboard appeared. However, selected widget still has blue border which means fake selection (I assume, it may be some other focus thing?) is still active.

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

Safari, iOS 9.3.1.

Steps to reproduce

1. Go to ​http://ckeditor.com/demo
2. Try Drag 'n Drop Images to editor
3. Now we don't see the image because style="height:0px; width:0px"

Expected result

Image is appeared

Actual result

Image does not appear

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

safari

Steps to reproduce

Expected result

If I push enterKey cusor is moved next line ( from line 1 to lien 2) and if type the hangul It will be typed there line (line 2)

Actual result

but It is typed at before line (line 1)

so When I want to type to next line I have to two times push enterkey

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

browser : safari OS : Ipad mac os CkEditor version : 4.5.11 installed plugins : There is so many customized plugins but I think there is no affecting plugins to Ipad hangul enter issue

because It is samely occured at ckeditor.com/demo

Custom styles can be added to style placeholders, e.g:

{ name: 'Placeholder class', type: 'widget', widget: 'placeholder', attributes: { 'class': 'placeholder-class' } },

More on styles - ​http://docs.ckeditor.com/#!/guide/dev_styles.

While styles can be applied on a placeholder widget properly, switching to source mode removes classes/styling so it cannot be restored while switching back to WYSIWYG mode.

Expected result

The classes/styles are preserved while switching between Source/WYSIWYG mode.

Actual result

The classes/styles are removed while switching to Source mode.

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

The cause of the issue is the way placeholder widget is downcasted. It is downcasted to [[placeholder_name]] so there is no way to store additional attributes in the downcasted text/html.

​https://developer.mozilla.org/en-US/docs/Web/HTML/Element/embed states: "Must have a start tag, and must not have an end tag." However, CKEditor is adding a closing tag.

Steps to reproduce

1. Go to ​http://ckeditor.com/demo#full
2. Switch to source mode
3. Replace source with <embed src="movie.mov">
4. Switch to WYSIWYG mode and back to source mode
5. See the tag was closed as <embed src="movie.mov"></embed>

Expected result

The tag should remain as pasted, without a closing tag

Actual result

A closing </embed> tag is being incorrectly added

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

Tested on Chrome, latest version

Steps to reproduce

1. Go to ​http://sdk.ckeditor.com/samples/mediaembed.html.
2. Focus mediaembed widget (video).
3. Deselect both Narrow media and Centered media from stylescombo.

Expected result

Styles combo is updated immediately, showing that no styles are selected for the current selection (widget).

Actual result

Styles combo is updated only after changing selection (or applying/removing) different style.

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

Tested on Chrome with CKEditor 4.5.11.

For any extrange reason, dynamically added styles to editor with camel case are not being applied to content elements.

Steps to reproduce

On a clean CKEditor download

1. Edit config.js and add those lines before the "editorConfig" function:

var cssStylesContenidoInteractivo = [ '.interElem { background:#dddddd; }' , ].join( ).replace(/;/g, ' !important;' ); CKEDITOR.addCss( cssStylesContenidoInteractivo );

2. Comment the config.removeDialogTabs config option (to be able to assign a class)
3. Open the editor on Chrome, create a link and set its style to "interElem". The style will not be applied. In the other hand, if you apply the style "interelem" (lower case) the style is applied.

Expected result

class interElem to be applied to the element

Actual result

class interElem is not applied to the element

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

It happens in Chrome, in different Windows installations, tested with CKEditor 4.3.3 and 4.5.11

Style sets for widgets can be set like:

CKEDITOR.replace( 'editor1', {
    stylesSet: [
        { name: 'Clean', type: 'widget', widget: 'image', attributes: { 'class': 'clean' } }
    ]
} );

or in styles.js:

CKEDITOR.stylesSet.add( 'default', [
    { name: '240p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-240p' } },
    { name: '360p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-360p' } },
] };

When trying to set two styles with the same name but for different widget type, like:

{ name: '240p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-240p' } },
{ name: '240p', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-240p' } },

The stylescombo uses only style defined for latter widget type. It happens because stylescombo uses style names as ids internally and there is a collision so previous style gets overwritten.

In some cases there may be a need to provide same styles for different widget types.

Expected result

It is possible to set styles with the same name for different widget types. It is properly handled by stylescombo.

Actual result

Stylescombo cannot handle styles with the same name.

Generally, there may be two cases:

1. Setting different styles with the same name for different widget types.
2. Setting same styles for different widget types.

Enabling adding styles with the same name for different widget types solves both of the above issues, however, it is not optimal for the second one (optimal could be, e.g. passing array of widget types/names). So we might consider different approaches for this issue.

Steps to reproduce

1. Add async="async" into the script tag for ckeditor.js.
2. Launch the HTML in FF.
3. It may take a few launches, with or without clearing the cache, but look for a console error.

Expected result

Script would load normally.

Actual result

"A call to document.write() from an asynchronously-loaded external script was ignored." in the console.

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

FF50, Win7, 4.5.11, many plugins.

I've been running into issues with the debug code being used with RequireJS. This use case is a simplified example of the first issues I hit.

This may be moot with the 5.x line and the AMD branch, but for 4.x, a few tweaks can be added. I altered the debug ckeditor.js and core/loader.js and added to the test:

if ( document.body && ( !document.readyState | | document.readyState == 'complete' | | document.readyState == 'interactive' | | (document.currentScript && document.currentScript.async) ) )

Per the web, "interactive" does still mean the doc is loaded and parsed, while still waiting on images/script/frames, so adding a script node sounds legal.

For the currentScript.async test, if this script was loaded with async, writing to the doc should never be allowed. This flag didn't seem to pickup if a script calling this script was async, so its' not perfect.

Additionally, I wasn't sure if there was a benefit to doing "document.getElementsByTagName("head")[0].appendChild(script)" instead of "document.body.appendChild(script)".

Steps to reproduce

Load the plugin I've attached to this ticket. It's a plugin to work with jQuery UI Accordion. It has Add and Remove button. Latter does not have any events at the moment.

Expected result

After clicking on Add I would expect the new html be editable but it's not. Only way to make it editable is toggle Source button. I've tried everything so I'm either not doing it properly (and I don't want the whole accordion to be editable) or there's no such feature yet.

Actual result

The html is appended but I can't edit it.

Steps to reproduce

1. Create standard ordered or unordered list in MS Word file
2. Clear editor contents
3. Copy the list from word file and Paste it into editor

Expected result

Just ul/ol tags get pasted.

Actual result

Each list item text is wrapped in paragraph.

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

Problem can be reproduced in CKEditor 4.6 in IE11.

NOTE: Actually native IE11 produces same result so I'm not entirely sure if CKEditor should extra filter it or rather IE11 should have that fixed:

<ol style="list-style-type: decimal; direction: ltr;">
<li style='color: rgb(0, 0, 0); font-family: "Calibri","sans-serif"; font-size: 11pt; font-style: normal; font-weight: normal;'>
<p style='color: rgb(0, 0, 0); font-family: "Calibri","sans-serif"; font-size: 11pt; font-style: normal; font-weight: normal; margin-top: 0cm; margin-bottom: 0pt; mso-list: l0 level1 lfo1;'>
<span lang="PL" style="mso-ansi-language: PL;">Test1</span>
</p>
</li>

<li style='color: rgb(0, 0, 0); font-family: "Calibri","sans-serif"; font-size: 11pt; font-style: normal; font-weight: normal;'>
<p style='color: rgb(0, 0, 0); font-family: "Calibri","sans-serif"; font-size: 11pt; font-style: normal; font-weight: normal; margin-top: 0cm; margin-bottom: 0pt; mso-list: l0 level1 lfo1;'>
<span lang="PL" style="mso-ansi-language: PL;">Test2</span>
</p>
</li>

<li style='color: rgb(0, 0, 0); font-family: "Calibri","sans-serif"; font-size: 11pt; font-style: normal; font-weight: normal;'>
<p style='color: rgb(0, 0, 0); font-family: "Calibri","sans-serif"; font-size: 11pt; font-style: normal; font-weight: normal; margin-top: 0cm; margin-bottom: 10pt; mso-list: l0 level1 lfo1; tab-stops: 179.25pt;'>
<span lang="PL" style="mso-ansi-language: PL;">Test3</span>
</p>
</li>
</ol>

On the other hand, paragraphs weren't populated in IE11 so maybe this can be fixed by the editor.