mirror of
https://github.com/codex-team/editor.js
synced 2024-06-10 09:52:36 +02:00
Disable Mutation Observer while saving (#563)
* Disable Mutation Observer while saving * rm image
This commit is contained in:
parent
41ae41cda7
commit
71315d902a
12
dist/codex-editor.js
vendored
12
dist/codex-editor.js
vendored
File diff suppressed because one or more lines are too long
|
@ -43,7 +43,6 @@
|
|||
-->
|
||||
<script src="./tools/header/dist/bundle.js"></script><!-- Header -->
|
||||
<script src="./tools/simple-image/dist/bundle.js"></script><!-- Image -->
|
||||
<script src="./tools/image/dist/bundle.js"></script><!-- Image -->
|
||||
<script src="./tools/delimiter/dist/bundle.js"></script><!-- Delimiter -->
|
||||
<script src="./tools/list/dist/bundle.js"></script><!-- List -->
|
||||
<script src="./tools/quote/dist/bundle.js"></script><!-- Quote -->
|
||||
|
@ -93,13 +92,7 @@
|
|||
* Or pass class directly without any configuration
|
||||
*/
|
||||
image: {
|
||||
class: ImageTool,
|
||||
config: {
|
||||
endpoints: {
|
||||
byFile: 'http://localhost:8008/uploadFile',
|
||||
byUrl: 'http://localhost:8008/fetchUrl',
|
||||
},
|
||||
},
|
||||
class: SimpleImage,
|
||||
inlineToolbar: ['link'],
|
||||
},
|
||||
|
||||
|
@ -235,9 +228,7 @@
|
|||
{
|
||||
type: 'image',
|
||||
data: {
|
||||
file: {
|
||||
url: 'https://ifmo.su/upload/redactor_images/o_e48549d1855c7fc1807308dd14990126.jpg',
|
||||
},
|
||||
url: 'https://ifmo.su/upload/redactor_images/o_e48549d1855c7fc1807308dd14990126.jpg',
|
||||
caption: '',
|
||||
stretched: false,
|
||||
withBorder: true,
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "codex.editor",
|
||||
"version": "2.7.14",
|
||||
"version": "2.7.15",
|
||||
"description": "CodeX Editor. Native JS, based on API and Open Source",
|
||||
"main": "dist/codex-editor.js",
|
||||
"types": "./types/index.d.ts",
|
||||
|
|
|
@ -22,6 +22,11 @@ export default class ModificationsObserver extends Module {
|
|||
*/
|
||||
private observer: MutationObserver;
|
||||
|
||||
/**
|
||||
* Allows to temporary disable mutations handling
|
||||
*/
|
||||
private disabled: boolean;
|
||||
|
||||
/**
|
||||
* Used to prevent several mutation callback execution
|
||||
* @type {Function}
|
||||
|
@ -52,6 +57,22 @@ export default class ModificationsObserver extends Module {
|
|||
}, 1000);
|
||||
}
|
||||
|
||||
/**
|
||||
* Allows to disable observer,
|
||||
* for example when Editor wants to stealthy mutate DOM
|
||||
*/
|
||||
public disable() {
|
||||
this.disabled = true;
|
||||
}
|
||||
|
||||
/**
|
||||
* Enables mutation handling
|
||||
* Should be called after .disable()
|
||||
*/
|
||||
public enable() {
|
||||
this.disabled = false;
|
||||
}
|
||||
|
||||
/**
|
||||
* setObserver
|
||||
*
|
||||
|
@ -80,9 +101,16 @@ export default class ModificationsObserver extends Module {
|
|||
* @param observer
|
||||
*/
|
||||
private mutationHandler(mutationList, observer) {
|
||||
/**
|
||||
* Skip mutations in stealth mode
|
||||
*/
|
||||
if (this.disabled) {
|
||||
return;
|
||||
}
|
||||
|
||||
/**
|
||||
* We divide two Mutation types:
|
||||
* 1) mutations that concerns client changes. For example, settings changes, symbol added, deletion, insertions and so on
|
||||
* 1) mutations that concerns client changes: settings changes, symbol added, deletion, insertions and so on
|
||||
* 2) functional changes. On each client actions we set functional identifiers to interact with user
|
||||
*/
|
||||
let contentMutated = false;
|
||||
|
|
|
@ -24,15 +24,23 @@ export default class Saver extends Module {
|
|||
* @return {OutputData}
|
||||
*/
|
||||
public async save(): Promise<OutputData> {
|
||||
const blocks = this.Editor.BlockManager.blocks,
|
||||
const {BlockManager, Sanitizer, ModificationsObserver} = this.Editor;
|
||||
const blocks = BlockManager.blocks,
|
||||
chainData = [];
|
||||
|
||||
/**
|
||||
* Disable modifications observe while saving
|
||||
*/
|
||||
ModificationsObserver.disable();
|
||||
|
||||
blocks.forEach((block: Block) => {
|
||||
chainData.push(block.save());
|
||||
});
|
||||
|
||||
const extractedData = await Promise.all(chainData);
|
||||
const sanitizedData = await this.Editor.Sanitizer.sanitizeBlocks(extractedData);
|
||||
const sanitizedData = await Sanitizer.sanitizeBlocks(extractedData);
|
||||
|
||||
ModificationsObserver.enable();
|
||||
|
||||
return this.makeOutput(sanitizedData);
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue