TinyMCE 6.0: Core changes
Contents
Summary
This section documents the four core changes made to TinyMCE 6.0.
Core changes
-
Browsers supported by TinyMCE 6.0 have changed. TinyMCE 6.0 supports the current and previous major versions of Google Chrome, Mozilla Firefox, Microsoft Edge, and Apple Safari. TinyMCE 6.0 also supports the current Long Term Release of each of the above browsers (eg, Mozilla Firefox ESR and Google Chrome ESR).
In particular, this means TinyMCE 6.0 does not support Microsoft Internet Explorer 11. -
Premium Plugins released with TinyMCE 6.0 are not backwards compatible with earlier versions of TinyMCE.
-
The open source version of TinyMCE 6.0 is now licensed under the MIT License.
-
Three additional professionally translated language packs are now available for use with TinyMCE 6.0:
-
Hindi (hi);
-
Malay (ms); and
-
Vietnamese (vi)
These packs are available to all Cloud subscribers and all Premium plan subscribers.
-
This section also includes four tables that set out the:
-
renamed APIs, Commands, Plugins, Options, and UI & UX elements
-
values changed in a default TinyMCE 6.0 instance.
-
previously deprecated and now removed items.
-
never documented, and consequently never supported, items that have now been removed.
Things we renamed
Old name | New name | Element | Notes |
---|---|---|---|
|
|
Menu item |
No behavioral changes. |
|
|
Toolbar item |
No behavioral changes. |
|
|
Plugin |
NB: Image Tools is now Enhanced Image Editing, a Premium plugin. |
|
|
Option |
NB: Image Tools is now Enhanced Image Editing, a Premium plugin. |
|
|
Option |
NB: Image Tools is now Enhanced Image Editing, a Premium plugin. |
|
|
Option |
NB: Image Tools is now Enhanced Image Editing, a Premium plugin. |
|
|
Option |
NB: Image Tools is now Enhanced Image Editing, a Premium plugin. |
|
|
Option |
NB: Image Tools is now Enhanced Image Editing, a Premium plugin. |
|
|
Option |
NB: Image Tools is now Enhanced Image Editing, a Premium plugin. |
|
|
API |
|
|
|
Option |
No behavioral changes, but there are related toolbar and menu items changes. |
|
|
Toolbar item |
No behavioral changes. |
|
|
Menu item |
No behavioral changes. |
|
|
Option |
No behavioral changes. |
|
|
Toolbar item |
No behavioral changes. |
|
|
Menu item |
No behavioral changes. |
|
|
Option |
No behavioral changes. |
|
|
Function |
This function is part of the |
|
|
API |
|
|
|
Command |
This |
|
|
Option |
No behavioral changes. |
|
|
Option |
Changed for consistency with other |
|
|
Option |
Changed for consistency with other options. The functionality, and the values this option can take remain unchanged. |
|
|
Option |
Changed for consistency with other options. The functionality, and the values this option can take remain unchanged. |
|
|
Command |
Use |
|
|
Option |
After upgrading, rename the options in your TinyMCE init configuration to match the new name. For example, |
|
|
Option |
After upgrading, rename the options in your TinyMCE init configuration to match the new name. For example, |
|
|
Toolbar item |
No behavioral changes. |
|
|
Menu item |
No behavioral changes. |
|
|
Option |
After upgrading, rename the options in your TinyMCE init configuration to match the new name. Also, remove |
|
|
API |
Updated so the API better reflects what it is checking for. |
|
|
API |
Updated so the API now uses the current name of Apple’s desktop operating system when checking to see if a device’s OS is, in fact, macOS. |
|
|
Plugin, Menu item, and Toolbar item |
This presents in both the menu item and the toolbar’s tooltip text. NB: Table of Contents is now a Premium plugin. |
|
|
Toolbar item |
This presents in the toolbar’s tooltip text. NB: Table of Contents is now a Premium plugin. |
|
|
Option |
NB: Table of Contents is now a Premium plugin. |
|
|
Option |
NB: Table of Contents is now a Premium plugin. |
|
|
Option |
NB: Table of Contents is now a Premium plugin. |
-
Commands are what is passed via the
editor.execCommand()
API.Where a Command name has change, calls to
editor.execCommand()
API must be changed to match the new name. -
Configuration Options are what is passed when initialising the TinyMCE editor via
tinymce.init
.Where an Option name has changed, configurations using that option must be changed to match the new name.
-
Menu items and Toolbar items are Options from
tinymce.init
for UI and UX features, such as the TinyMCE Menu, Toolbar and Contextual Menu.
Default value changes
Element | Old value | New value | Notes |
---|---|---|---|
|
|
|
|
assignment operator character |
|
|
Changed in the |
|
no default value assigned |
|
Changed as part of modernising TinyMCE’s default behavior. |
|
|
|
Changed to improve user experience. |
|
|
|
Changed as part of modernising TinyMCE’s default behavior. |
TinyMCE |
no default value assigned |
|
Changed as part of modernising TinyMCE’s default behavior. |
|
|
|
Changed as part of modernising TinyMCE’s default behavior. |
|
|
|
Changed as part of modernising TinyMCE’s default behavior. |
Previously deprecated items now removed
The following elements were previously deprecated and have, with this release, been removed entirely from TinyMCE.
Item | Element | Notes |
---|---|---|
|
API |
|
|
API |
From |
|
Option |
|
|
Schema option |
|
|
Schema option |
|
|
API |
|
|
API |
From |
|
API |
From |
|
API |
|
|
Option |
|
|
API |
From |
|
API |
From |
|
API |
|
|
Option |
From |
|
Property |
From |
|
Option |
From |
|
Option |
From |
|
API |
|
|
Option |
|
|
Option |
Superseded by |
|
Option |
|
|
Option |
Superseded by |
|
Option |
|
|
Option |
|
|
Option |
Replaced by |
|
Option |
|
|
API |
Use the native |
|
API |
|
|
API |
|
|
Option |
From |
|
Schema option |
|
|
Schema option |
|
|
Option |
Replaced, as of TinyMCE 6.6.1, by |
|
API |
From |
|
Schema option |
|
|
API |
|
|
API |
From |
|
API |
|
|
API |
From |
|
Schema option |
|
|
API |
|
|
Schema option |
|
|
Schema option |
|
|
Schema option |
|
|
API |
From |
|
Option |
Superseded by |
|
Option |
From |
|
Schema option |
|
|
Schema option |
|
|
API |
Any remaining |
Previously undocumented items removed without prior deprecation
The following elements were never documented and have never been formally supported.
Consequently, they were removed with this release without deprecation notices being provided in earlier releases.
Item | Element |
---|---|
|
API |
|
Command |
|
Command |
|
Command |
APIs
This section documents the improvements, changes and fixes made to TinyMCE 6.0 APIs.
It also documents the TinyMCE 6.0 APIs that have been removed.
New and improved APIs
editor.annotator.removeAll
The new editor.annotator.removeAll
API replaces the removeAll
method built-in to the Comments plugin.
editor.options
and tinymce.activeEditor.options
The new editor.options
API replaces two old APIs: editor.settings
and editor.getParam
.
Along with this new API, the new tinymce.activeEditor.options
API replaces tinymce.activeEditor.settings
.
editor.uploadImages()
The results returned from editor.uploadImages()
API now include a removed
property.
The property will be true
when an image being uploaded is removed after failing to upload.
FakeClipboard
The new FakeClipboard
API provides a means for storing state that can be set and accessed by plugins and the core editor.
FakeClipboard
is implemented on the TinyMCE global, allowing anything to write to it and read from it.
Resource.unload
The new Resource.unload
API makes it possible to unload resources in the resource loader.
setData
method in the Dialog API
The dialog API’s setData
method now uses a deep merge algorithm.
Consequently, it now supports partial nested objects.
success
and failure
callbacks replaced by Promise
in multiple APIs
Previously, the AddOnManager
, PluginManager
, ScriptLoader
, StyleSheetLoader
, and ThemeManager
APIs reported resource loading status with success
or failure
callbacks.
These APIs now, instead, return a Promise
. Also, EditorUpload
, which already returns a Promise
, had callbacks removed.
Changed APIs
closeButton
and timeout
Previously, using closeButton
to disable a Notification’s close button required a timeout
value to also be set.
In TinyMCE 6, closeButton
shows or hides the close button regardless of a timeout
value being set or not set.
Equivalently, setting a timeout
value sets how long the notification presents before automatically closing, regardless of whether a close button is displayed or not.
disabled
methods renamed in all TinyMCE APIs
Previously, multiple TinyMCE APIs and UI components used disable
or disabled
in their method or property names.
In TinyMCE 6, these method and property names have been changed and configuration changes are required.
-
isDisabled()
methods are nowisEnabled()
methods. -
The
enable()
anddisable()
methods are now the singlesetEnabled(<state>)
method. -
The
disable(<name>)
andenable(<name>)
methods are now the singlesetEnabled(<name>, <state>)
method in the Dialog APIs. -
The
disabled
property is now theenabled
property in all TinyMCE UI components.
DomParser
The filterNode
method has been removed from the DomParser
API.
As well, the DomParser
API no longer uses a custom parser internally and instead uses the native DOMParser
API.
Env
The following methods have been removed from the Env
API:
-
opera
-
webKit
-
ie
-
gecko
-
mac
-
iOS
-
android
-
desktop
-
contentEditable
-
caretAfter
-
range
-
ceFalse
-
experimentalShadowDom
-
fileApi
Note, in particular, the removal of all legacy browser detection methods.
fire
methods renamed in all TinyMCE APIs
The fire()
method in tinymce.Editor
, tinymce.dom.EventUtils
, tinymce.dom.DOMUtils
, tinymce.util.Observable
and tinymce.util.EventDispatcher
has been renamed to dispatch()
.
fire
has been aliased to dispatch
, so existing integrations should still work as expected.
fire
has also, however, been marked as deprecated. Using dispatch()
in place of fire()
is recommended.
Fixed APIs
editor.annotator.remove
Previously, editor.annotator.remove
scrolled to the removed contents position when removing an annotation.
It did not, as expected, retain the current selection or insertion position in the TinyMCE editor.
With this release, editor.annotator.remove
does not change the selection or insertion position after removing an annotation.
editor.fire()
Previously, if the TinyMCE editor was removed, the editor.fire()
API returned an incorrect object.
In TinyMCE 6.0, editor.fire()
, which has been renamed dispatch()
, returns the correct object even when the editor is removed.
editor.getContent()
The editor.getContent()
API can now provide custom content by preventing and overriding content
in the BeforeGetContent
event.
This makes it consistent with the editor.selection.getContent()
API.
The editor.setContent()
API can also now be prevented from using the BeforeSetContent
event.
This, too, makes it consistent with the editor.selection.setContent()
API.
editor.selection.getContent()
When the no_events
argument is set to true
, events should not fire when getContent
is called. Previously, editor.selection.getContent()
did not respect this.
In TinyMCE 6.0, editor.selection.getContent()
treats the no_events
setting as expected: when set to false
, events are fired; when set to true
, events are not fired.
Removed or deprecated APIs
Table
The table
plugin’s functionality is, as of TinyMCE 6.0, entirely focussed on the user interface (UI) for creating and editing tables.
The code that generates tables is now a Core part of TinyMCE 6.0.
Since the table
plugin API was entirely concerned with generating tables, it has been removed.
Commands and queries
This section documents the improvements and changes made to TinyMCE 6.0 commands and queries.
It also documents the TinyMCE 6.0 commands that have been removed.
New and improved commands and queries
mceAutocompleterClose
and mceAutocompleterReload
As part of moving the core autocompleter feature from the default silver
theme to the TinyMCE core, two new commands are now available: mceAutocompleterClose
and mceAutocompleterReload
.
mceInsertTableDialog
mceInsertTableDialog
is the new command for invoking an Insert Table dialog.
The previous command, mceInsertTable
, no longer works to invoke an Insert Table dialog: use the mceInsertTableDialog
command instead.
The mceInsertTable
command is still the command for inserting a table with specified properties directly and without asking for user input.
Changed commands and queries
Editor commands
The Editor commands APIs no longer fallback to executing the browsers native command functionality.
As well, the Editor query command APIs now return false
or an empty string on removed TinyMCE editors.
mceAddEditor
and mceToggleEditor
Previously, mceAddEditor
and mceToggleEditor
used the editorManager.settings
values to set the id
and UI and UX options for a new TinyMCE editor instance.
editorManager.settings
is not used at all in TinyMCE 6 and has been removed.
Instead, the mceAddEditor
and mceToggleEditor
commands use id
and options
values from an object passed when the command is run.
Events
This section documents the improvements and fixes made to TinyMCE 6.0 Events.
New and improved events
AutocompleterStart
, AutocompleterUpdate
and AutocompleterEnd
As part of moving the core of the autocompleter feature from the default silver
theme to the TinyMCE core, three new events are now available: AutocompleterStart
, AutocompleterUpdate
and AutocompleterEnd
.
Themes can act on the AutocompleterStart
and AutocompleterUpdate
events and can call AutocompleterEnd
to cancel the auto completer.
Fixed events
beforeinput
The beforeinput
event is expected to fire whenever content is added to or removed from a TinyMCE instance.
Previously, however, because of backspace and delete overrides in TinyMCE Core, the beforeinput
event did not always fire when expected.
With this release, these overrides no longer prevent beforeinput
events firing when expected.
change
Previously, the change
event was triggered by the first modification made to a TinyMCE editor instance.
However, subsequent changes did not cause the event to fire until focus was switched away from the editor.
For example, typing a single character in to the TinyMCE editor text-entry area triggered the change
event.
Consequent typing, or selecting of the entered character and modifying it by setting it to bold or italic, did not trigger further change
events.
Making further modifications and then switching focus away from the editor did trigger this event, however.
As of TinyMCE 6, the change
event is not fired unless and until
-
focus is switched away from the editor; and
-
changes have been made in the editor since focus was switched to it.
It is still possible to listen for modification to a TinyMCE editor instance before focus is changed. To do this, listen for the dirty event, rather than the change event.
|
GetContent
Previously the GetContent
event did not fire when the editor.selection.getContent()
API attempted to get tree
or text
formatted data.
With this release, the SetContent
event fires as expected when editor.selection.setContent()
attempts this.
The editor.selection.setContent() API only supports the html and raw formats.
|
input
The input
event is expected to fire whenever content is deleted from a TinyMCE instance.
Previously, however, because of overrides in the DeleteBackspaceKeys.ts
module, when more than one line was deleted, the input
event did not fire.
With this release, these overrides no longer prevent an input
event firing when multiple lines are deleted, as expected.
Options
This section documents the changes made to TinyMCE 6.0 Options.
It also documents the TinyMCE 6.0 Option that has been removed.
Changed options
element_format
Previously, element_format
had no explicit default value. It’s implicit value, however, was 'xhtml'
.
In TinyMCE 6.0, element_format
now has an explicit default value: 'html'
.
images_upload_handler
Previously the images_upload_handler
option passed success
or failure
callbacks to report the status of an image upload.
In TinyMCE 6, images_upload_handler
reports upload results by returning a Promise
.
link_default_protocol
The link_default_protocol
option sets the link protocol used by links added or edited using the link dialog.
It now defaults to 'https'
. Previously it defaulted to 'http'
.
The link_default_protocol value is only applied to an edited or inserted link if the protocol is not explicitly specified.
|
plugins
option
Previously, the list of configured plugins could be retrieved by calling editor.getParam('plugins')
and returned the configured plugins as a string.
As of TinyMCE 6, the list of configured plugins is retrieved by calling editor.options.get('plugins')
and now returns the configured plugins as an array.
Removed or deprecated options
TextPattern
The textpattern_patterns
option is no longer an option. It has been renamed to text_patterns
and is now a Core part of TinyMCE 6.0.
All references to textpattern_patterns
should be changed to text_patterns
.
Also, text patterns are now on by default: text_patterns: false
turns the functionality off.
Parsing and serialization
This section documents the single change made to TinyMCE 6.0 parsing and serialization.
Plugins
This section documents the improvements, changes, and removals made to TinyMCE 6.0 Plugins.
It also documents the the plugin loading change introduced in TinyMCE 6.0.
Plugin loading format change
TinyMCE 6.0 allows plugin loading in any of three formats:
-
An array of strings:
plugins: [ 'advlist', 'lists', 'image', 'help', 'wordcount' ]
-
A space-separated string:
plugins: 'advlist lists image help wordcount'
-
A comma-separated string, with or without spaces:
plugins: 'advlist,lists,image,help,wordcount'
plugins: 'advlist, lists, image, help, wordcount'
Previously, one other format was allowed: arrays of space-separated strings. This format is no longer accepted in TinyMCE 6.0.
New and improved plugins
Enhanced Image Editing
Enhanced Image Editing, a Premium plugin, replaces the now-deprecated and removed ImageTools plugin. The imagetools
plugin is no longer part of the Core open source editor.
The following editimage
options replace the old imagetools
options:
-
imagetools_cors_hosts
is noweditimage_cors_hosts
. -
imagetools_credentials_hosts
is noweditimage_credentials_hosts
. -
imagetools_fetch_image
is noweditimage_fetch_image
. -
imagetools_proxy
is noweditimage_proxy
. -
imagetools_toolbar
is noweditimage_toolbar
.
editimage
also offers a new option: editimage_proxy_service_url
. This option has been added as a new recommended method when using Tiny services.
Emoticons
The emoticon
plugin now uses the more accurate word, Emoji, in its toolbar, menu item and dialog.
In previous versions, the word presented in these parts of the plugin’s user-interface was Emoticon.
The plugin, itself, is still called Emoticons. And the plugin description and the plugin’s configuration and Help dialogs still reflect this. |
Table of Contents
There are no end-user facing changes between the previous toc
plugin and the tableofcontents
plugin.
The tableofcontents plugin is no longer part of the Core open source editor. Table of Contents is now a Premium plugin.
|
Changed plugins
Autoresize
Previously, the autoresize
plugin offered an autoresize_on_init
option.
This setting does not do anything meaningful, and had been previously deprecated.
As of TinyMCE 6.0, autoresize_on_init
has been removed from the autoresize
plugin.
Media
In TinyMCE 5.x, the media
plugin used SaxParser
to validate elements for parsing.
As of TinyMCE 6.0, SaxParser
is no longer used. Another TinyMCE public API — DomParser
— is used instead.
As a consequence the iframe
, video
, audio
, and object
elements are no longer marked as special. Instead their contents are simply validated against the TinyMCE schema.
The TinyMCE public API, DomParser uses, in turn, the same-named browser parsing API: DomParser .
|
Also, the media
plugin’s media_scripts
option was deprecated in TinyMCE 5.10.
As of the release of TinyMCE 6.0, this option has been removed completely.
Noneditable
The noneditable
plugin is no longer a plugin. It is now a Core part of TinyMCE 6.0.
In TinyMCE 6.0, there is no setting or specifying this functionality in the plugins
option.
All references to noneditable
should be removed from your plugin configuration. Leaving references to removed plugins in a plugin configuration will cause console errors documenting the plugin failing to load.
Paste
The paste
plugin’s functionality is now a Core part of TinyMCE 6.0.
In TinyMCE 6.0, there is no setting or specifying this functionality in the plugins
option.
All references to paste
should be removed from your plugin configuration. Leaving references to removed plugins in a plugin configuration will cause console errors documenting the plugin failing to load.
The paste_data_images
option now defaults to true
. When paste
was a plugin, this option was, by default, set to false
, which prevented images being pasted from the local machine.
The mceInsertClipboardContent
argument, content
, has been renamed. It is now html
.
The new name is a more accurate reflection of what sort of data the argument passes.
print
functionality is no longer a plugin. It is now a Core part of TinyMCE 6.0.
In TinyMCE 6.0, there is no setting or specifying this functionality in the plugins
option.
All references to print
should be removed from your plugin configuration. Leaving references to removed plugins in a plugin configuration will cause console errors documenting the plugin failing to load.
Table
The table
plugin’s functionality is, as of TinyMCE 6.0, entirely focussed on the user interface (UI) for creating and editing tables.
The code that generates tables is now a Core part of TinyMCE 6.0.
This, now core feature of TinyMCE 6.0, also includes the following fixes, changes, and improvements.
-
If the selected cells in the
tfoot
section of a table were header elements (ie wereth
elements), pressing thetable
row header toolbar button (which invokes themceTableRowType
command) returned the row as a header row.This was incorrect: the section takes precedence and cells in the
tfoot
section of a table should be declared as a footer row.In TinyMCE 6.0, selecting cells in the
tfoot
section of a table and pressing the row header toolbar button returns the row as a footer row, as expected. -
mceInsertTableDialog
is the new command for invoking an Insert Table dialog box.The previous command,
mceInsertTable
, no longer works to invoke an Insert Table dialog box: use themceInsertTableDialog
command instead.The
mceInsertTable
command is still the command for inserting a table with specified properties directly and without asking for user-input. -
The default values for the
table_style_by_css
and thetable_use_colgroups
options have both been changed.Previously, these options defaulted to
false
. As of TinyMCE 6.0, both options now default totrue
.This is in line with modern web practice.
-
The
table_responsive_width
option was previously deprecated and superseded bytable_sizing_mode
.In TinyMCE 6.0, the
table_responsive_width
option has been removed.
Removed or deprecated plugins
BBCode
As per the previous TinyMCE 5 announcement, the bbcode
plugin has been removed. It is no longer part of TinyMCE 6.0. And it is not otherwise available.
Color Picker
Color Picker’s functionality has been a built in part of TinyMCE since version 5.
Consequently, and as per the previous TinyMCE 5 announcement, the empty colorpicker
plugin has been removed.
Context Menu
Context Menu’s functionality has been a built in part of TinyMCE since version 5.
Consequently, and as per the previous TinyMCE 5 announcement, the empty contextmenu
plugin has been removed.
Full Page
As per the previous TinyMCE 5 announcement, the fullpage
plugin has been removed. It is no longer part of TinyMCE 6.0. And it is not otherwise available.
HR
The hr
(horizontal rule) functionality is no longer a plugin. It is now a Core part of TinyMCE 6.0.
In TinyMCE 6.0, there is no setting or specifying this functionality in the plugins
option.
All references to hr
should be removed from your plugin configuration. Leaving references to removed plugins in a plugin configuration will cause console errors documenting the plugin failing to load.
Image Tools
The imagetools
plugin is no longer part of the Free TinyMCE editor. Image Tools is now Enhanced Image Editing, a Premium plugin.
Legacy Output
As per the previous TinyMCE 5 announcement, the legacyoutput
plugin has been removed. It is no longer part of TinyMCE 6.0. And it is not otherwise available.
Paste
The paste
functionality is no longer a plugin. It is now a Core part of TinyMCE 6.0.
Because the functionality was unmaintainable, paste
no longer supports input from Microsoft Word.
There is an open request for maintainers should someone in the community be interested in taking over maintenance of this particular functionality as a separate plugin.
If a community-maintained version of the paste
plugin becomes available, we will link to it from the Migration Guide.
The Premium plugin, PowerPaste , is available. It provides the capability to accept data from Microsoft Word and Microsoft Excel, and clean-up the received data before pasting it into place.
|
print
functionality is no longer a plugin. It is now a Core part of TinyMCE 6.0.
In TinyMCE 6.0, there is no setting or specifying this functionality in the plugins
option.
All references to print
should be removed from your plugin configuration. Leaving references to removed plugins in a plugin configuration will cause console errors documenting the plugin failing to load.
Spell Checker
As per the previous TinyMCE 5 announcement, the spellchecker
plugin has been removed. It is no longer part of TinyMCE 6.0.
The Premium plugin, Spell Checker Pro, which offers equivalent functionality and more, is available.
Tab Focus
The tabfocus
plugin has been removed. It is no longer part of TinyMCE 6.0. And it is not otherwise available.
The tabfocus_elements
option, which relied on the tabfocus
plugin, no longer functions.
As well, the tab_focus
option was previously deprecated by tabfocus_elements
. With this release, the tab_focus
option has been removed completely.
As per standard web practice, the tabindex
attribute should be used instead of the tabfocus
plugin or any of the tabfocus
plugin’s options.
As per that standard web practice, the tabindex
attribute is copied from the target element to the iframe.
Table of Contents
The toc
plugin is no longer part of the Core open source editor. Table of Contents is now a Premium plugin.
Text color
Text color’s functionality has been a built in part of TinyMCE since version 5.
Consequently, and as per the previous TinyMCE 5 announcement, the empty textcolor
plugin has now been removed.
Text Pattern
The textpattern
functionality is no longer a plugin. It is now a Core part of TinyMCE 6.0.
In TinyMCE 6.0, there is no setting or specifying this functionality in the plugins
option.
All references to textpattern
should be removed from your plugin configuration. Leaving references to removed plugins in a plugin configuration will cause console errors documenting the plugin failing to load.
Properties
This section documents the improvements, changes and fixes made to TinyMCE 6.0 APIs.
It also documents the TinyMCE 6.0 APIs that have been removed.
Fixed properties
tinymce.settings
When a TinyMCE editor instance was ended, the global setting, tinymce.settings
, which is set at editor initialisation, retained references to DOM elements from the no-longer extant editor instance.
With this release, tinymce.settings
is no longer set at editor initialisation and has subsequently been removed.
Schema
This section documents the one improvement and one change made to TinyMCE 6.0 Schemas.
New and improved schema
TinyMCE 6.0 instances now use HTML 5 as the default schema.
The previous default was, for practical purposes, also HTML 5 but no specific schema was set. This change formalises and makes explicit what was, previously, only implicit.
html5-strict is still an available schema option and is unchanged from TinyMCE 5.x.
|
Changed schema
Assignment operator character
The assignment operator character — :
— has been changed to ~
for the valid_elements
and extended_valid_elements
schemata.
The :
is also used to assign a [xlink:href]
rule and this was not possible in these schemata because the colon character was acting as an assignment operator.
This change allows both schemata to set attribute values for the valid_elements
and extended_valid_elements
options using the ~
character and assign [xlink:href] rules as expected.
Strings and Internationalization
This section documents the single fix made to TinyMCE 6.0 strings and internationalization.
Fixed strings
color picker dialog
The TinyMCE color picker presents tooltip labels showing the name of the color the pointer is hovering over.
These labels presented these names in English in multiple instances when they should have presented the names in other languages (eg German).
With this update, these tooltip labels now present in the expected language.
UI and UX elements and components
This section documents the improvements, changes, fixes and removals made to TinyMCE 6.0 UI and UX elements and components.
New and improved UI and UX elements and components
buttonType
buttonType
is a new property available for button components used in dialogs.
It replaces the, now deprecated property, primary
.
The primary
property was boolean, allowing for only two states: true
and false
.
The new buttonType
property can take any of three states: 'primary'
, 'secondary'
, and 'toolbar'
.
Setting buttonType: 'primary'
is the same as setting primary: true
.
Setting buttonType: 'secondary'
is the same as setting primary: false
.
Dialog re-rendering
Previously, when a component in a TinyMCE dialog changed — for example, when a next or previous button was clicked — the entire dialog was re-rendered.
In TinyMCE 6.0, the initialData
type is now Partial<T>
, which matches the underlying implementation.
And, relatedly, the redial
API now re-renders only the portions of a dialog that have changed.
setData
method in the dialog API
The dialog API’s setData
method now uses a deep merge algorithm.
Consequently, it now supports partial nested objects.
Editor text entry height
In TinyMCE 5.x, editors without a height
value specified in the TinyMCE configuration defaulted to a 200px high editor.
In TinyMCE 6.0, editors without a height
value specified in the TinyMCE configuration default to a 400px high editor.
As was the case in TinyMCE 5.x, this new default only applies to editors in iframe
mode, not inline
mode.
Also, editors now have a min-height
default value of 100px
. This prevents the editor UI from disappearing during re-sizing, which prevented users from interacting with the editor.
Editor theme now fetched in parallel with icons, plugins, and language packs
Previously, when a theme was requested, TinyMCE downloaded it completely before fetching accompanying components, such as icons, plugins, and language packs.
With this release, when a theme is called, related components are downloaded in parallel with the theme.
imagepreview
The new imagepreview
dialog component allows for previewing and zooming of any image URL.
Insertion point placement improved when clicking on noneditable elements
Clicking on or near the boundaries between editable and noneditable elements (eg in the padding
of a noneditable element containing an editable element), there are established and expected norms as to where the insertion point should present after the click.
With this release, TinyMCE has improved the placing of the insertion point on either side of a noneditable element when clicking on or near these boundaries.
Changed UI and UX elements and components
buttonType
buttonType
is a new property available as a basic panel component of dialogs
.
It replaces the, now deprecated property, primary
.
.disabled
properties renamed to .enabled
in TinyMCE UI classes
Previously, TinyMCE UI classes provided a .disabled
property.
In TinyMCE 6, this property has been renamed to .enabled
.
Also, the Dialog API, which previously offered the disable(<name>)
and enable(<name>)
functions, now offers a single setEnabled(<name>, <state>)
function.
Fixed UI and UX elements and components
Anchor elements now render correctly when allow_html_in_named_anchor: true
When allow_html_in_named_anchor
was set to true
, content inside the anchor element was wrapped such that each character was set on a new line.
With this release, setting allow_html_in_named_anchor: true
sets characters inside the anchor element as entered, with no wrapping of each character to a new line.
Default UI theme, silver, no longer renders incorrectly as plugins load
Previously, TinyMCE’s default UI theme, silver
, was initialised such that it rendered some UI components before plugins that, potentially, would override or adjust the defaults presented by silver
.
This resulted in these UI elements rendering incorrectly.
With this release, silver
no longer renders these UI elements before plugins get to override or adjust, and these components no longer render incorrectly.
Dialog labels now rendering correctly
Previously, TinyMCE dialog labels and other UI elements were rendered with HTML markup.
With this release, the text
and label
properties of these elements are now rendered as plain text, as expected.
editor.selection.setRng
Calls to editor.selection.setRng
now update the insertion point bookmark when focus is returned to the editor.
For the end-user, this change means content dragged from outside the TinyMCE editor into the editable area will be placed into the TinyMCE document where the insertion point appears as the drag is completed.
This is the expected behavior.
Sub-menu items now read by screen readers when using Google Chrome 93 or later
Previously, in Google Chrome 93 and later, navigating through TinyMCE menus using the keyboard did not cause screen readers to read out menu items.
This has been corrected with this release.
Screen readers now read menu items as the TinyMCE menus are traversed, as expected.
This patch was contributed by community member, Weston Dransfield. |
Tables are now positioned using margin
, not float
TinyMCE previously used float
to position tables to the left or right of the viewport (the working area available to the TinyMCE editor). This caused multiple layout and UX problems.
As of TinyMCE 6.0, tables are positioned using margin
rather than float
. This prevents these layout and UX problems occurring.
However, when upgrading to TinyMCE 6.0, there are two things to be aware of:
First, TinyMCE 6.0 does not alter existing documents. Extant TinyMCE documents with tables that were aligned to either left or right will still have the float
property assigned when opened and edited unless and until their alignment is altered.
If an extant TinyMCE document with an aligned table is opened using TinyMCE 6.0 and the alignment of the table is re-set, TinyMCE 6.0 will remove the float
property and use the margin
property to set the alignment.
Second, if the previous behavior is required, a custom format
will need to be created.
Removed or deprecated UI and UX elements and components
mobile
theme
The mobile
theme was deprecated when integrated support for mobile devices was added to the silver
theme.
The mobile
theme has been removed.
primary
The primary
property was a boolean property available for button components used in dialogs
It has been deprecated and replaced by the new buttonType
property.
Style field in the Advanced tab of the Insert/Edit Image dialog
The Style field, previously presented in the Advanced tab of the Insert/Edit Image dialog has been removed.
When the Advanced tab in the Insert/Edit Image dialog was selected, a Style text-entry field (auto-populated with the selected image’s properties and associated values) was one of the fields presented.
A bug in TinyMCE prevented the field from being edited, however.
Separate from the text-entry bug, supporting edits in this field properly is out-of-scope for this release of TinyMCE.
An internal feature request to re-implement this feature when it can be done so safely has been logged.
Typing the End key no longer causes the insertion point to leave an editable element
Pressing the End key when the insertion point is somewhere in a line of editable text should move the insertion point to the end of that line.
In the previous release of TinyMCE, pressing this key moved the insertion point outside the element containing the editable text entirely.
As of this TinyMCE release, pressing the End key when the insertion point is in a line of editable text moves the insertion point to the end of that line, as expected.