When deleting a text block with a basic style applied, the editor remains in the active state (bold, for example) while the button for that style is deactivated. Typing a character will reactivate the button.
I have verified that this is occurs on the CKEditor demo as well, so it shouldn't be related to any changes in our installation.
Steps to reproduce:
Use standard CKEditor: http://ckeditor.com/demo#standard
Select all and delete existing contents
Type 'Hello, World'
Select 'World'
Click 'Bold' button (or Ctrl+B)
Move cursor to end of content
Remove via backspace until bold content is removed
This results in the button displaying as inactive (default state), but typing any content will enter the text in bold and reactivate the button.
I've reproduced this (with slightly different rules regarding blank content and trailing spaces) on Chrome, Firefox, and IE10.
Is there a way to pull the state at which new content would be entered into the editor and use that to update the button state so that a user can see what their entered content will input as?
I know this TC very well:
delete entire bold, bold button is inactive,
start typing again,
bold is applied :|
It occurs on Webkit (Chrome and Safari) because of a very ugly behaviour of Webkit's contenteditable behaviour.
This is reported here:
http://dev.ckeditor.com/ticket/9998 - CKEditor (ticket grouping all Webkit's backspace handling bugs)
https://code.google.com/p/chromium/issues/detail?id=226941 - Chromium
https://bugs.webkit.org/show_bug.cgi?id=114791 - Webkit
Unfortunately neither Chromium's nor Webkit's developers replied and perhaps as most of the contenteditable bugs, this one won't be fixed soon (there are critical issues that haven't been fixed for years). So perhaps, in the near future we'll fix this on the CKEditor's side by overriding entire backspace logic with our own. Then such issues should not exist.
PS. Regarding the rest of the browsers I know that there are small inconsistencies, but you won't be able to fix them. Like for the Webkit's bug, to fix these cases we need to create custom backspace handling.
Related
I've read the doc and tried the demo, but I can't tell the difference between the built in undo/redo and the History plugin.
The default buttons are:
['undo', 'redo'],
The plugin buttons are:
['historyUndo','historyRedo'],
I've now noticed two differences:
With the plugin, the undo/redo buttons are greyed out and unclickable if there are no changes to undo or redo, which is a good improvement. The default undo/redo buttons are not greyed out.
With the plugin, it one undo/redo removes or re-adds whole words. The default does a single character or a few characters at a time, seemingly inconsistently.
Curiously, if both the default and plugin buttons are displayed, then clicking either of the default undo/redo buttons will make the plugin's undo button clickable as if there is a change to undo.
Sometimes at several webpages I have underlined title of page in my Firefox tabs (here is screenshot).
I have two questions related to this:
What mean this underline?
Is it possible, to do it from web page level (via CSS or JS)?
It's Firefox for MacOS, but I'm not sure if it does matter.
Are you using, by any chance, Firefox Multi-Account Container? If so the color of the line which underlines the title indicates the container the page is opened in.
I don't think you could change the color of the underline from unprivileged JS/CSS (web page), but I could be wrong. This is the source code for Firefox Multi-Account Container. Within that repository, you might be able to find the location where the underlining happens. For example, it could be this CSS code.
I'm trying to integrate CKEditor in a page of a SPA (Single Page Application).
CKEditor behaves correctly within the SPA page on the first visit, but not on next visits. For example, when pressing the backward browser arrow (to display the previous SPA page) and then the forward arrow (to display again the SPA page with CKEditor), CKEditor appears but the content has been erased and it's not reacting anymore. There is no carret when cliking on the text area. Also all API calls (such as setData() or resize()) have no effect anymore (whereas they were working on fist visit).
I presume CKEditor doesn't like its element to be removed from the DOM (that's what happens when switching to another page) and then be re-added to the DOM (that's what happens when visiting the page again).
EDIT ON July 5 2017
Thanks for your proposition to destroy CKEditor when leaving the page and to recreate it when navigating back, but this causes the lost of the editor state such as the the scrollbar position, the caret position, text selection, etc...
Ideally I would like to make it possible for a user to visit another page while he is in the middle of writing something in the editor (for example to check an information or copy a content from another page) and then to continue exactly where he was (no change on scrollbar, caret, selection,...) when he navigates back to the editor.
Is is possible?
Removing CKEditor just by removing its parent container like in your fiddle is not a good solution as CKEditor attaches some listeners to the DOM and by removing the container you are detaching those listeners which are not reattached then.
You should destroy the editor before removing from DOM and then recreate it. Remember that destroying happens in an async manner so to know when it is finished you may listen to destroy event.
Here is modified fiddle using destroy method (without handling destroy event which should be added).
EDIT ON July 10 2017
To preserve the state of the editor (scrollbar position, text selection, etc) between destroy - recreate, state of all this elements should be retained before destroying editor and then set after recreating it. It is doable, but requires some work and quite a lot of custom code.
Ideally I would like to make it possible for a user to visit another page while he is in the middle of writing something in the editor
Since you are creating a SPA application, for the above the better solution will be to use some floating/fixed container in which CKEditor is placed and which does not reload with rest of the page upon navigation (e.g. the same as Facebook chat works).
Also remember that recreating CKEditor takes some time (very short, but it may be still visible) so on every page navigation it will be visible for the user that something is happening with the editor even though its state does not changed.
Is possible to hide the bottom panel in Brackets? The one with lines and columns on the left and possible error messages, the language and some other details on the right.
I really like the Brackets code editor but unfortunately I have to work on a rather small screen and the bottom panel wastes valuable space without being useful to me.
I checked in the preferences of Brackets and in the official documentation, but there seems to be nothing on it.
Does anyone know if it is possible to hide the info panel?
The bottom panel is called the status bar. It appears there isn't a feature that allows you to hide or toggle it yet, but you could try submitting an issue in the issue tracker.
If you really can't wait and don't mind getting your hands dirty, you can hit F12 to open the Developer Tools, pick the status bar, and change display: block to display: none.
Here's one way you could make the change more permanently - without having to edit the source code directly or write your own extension from scratch:
Install the extension "Brackets UI Custom CSS"
Edit the styles.css file the extension provides (see instructions in link above)
Add #status-bar { display: none; } to the CSS & restart Brackets
Sometimes the autocomplete feature is great but other times where there is some nested code, it doesn't place the tag in the right position and I have to highlight the tag and then delete it. Is there a shortcut to this?
Example
when you finish the tag Rubymine (my text editor) automatically does but sometimes there is code that is after that and I have to highlight and delete it.
Is there some keyboard feature that I can use to control this feature or will I have to completely turn this feature off?
Thanks for the help.