Editor Stop Working for any project i use it in.

[eslamabdelmonaem]

as i attach editor just give blank page.

[exalate-issue-sync[bot]]

Internal Ref: INT-3270

[danoaky-tiny]

Without seeing your init config, I suspect you're mixing up the expected type for the plugins prop. See https://fiddle.tiny.cloud/rjdPX7hdJm/0. Are you doing something like this?

Also have a look at the docs: https://www.tiny.cloud/docs/tinymce/6/editor-important-options/#plugins

As for the blank screen, it may be something else in your config so just give us an example and we can help further

[eslamabdelmonaem]

After More Check From My Side i found it related to onInit={}

Here My init Config:

import { Editor } from '@tinymce/tinymce-react'; import React, { useRef } from 'react'; import InitProps from './initTinyProps'; import InitSimpleProps from './simpleTinyProps';

type Props = { setContent: (content: string) => void; simple: boolean; content: string; }; function TinymceEditor({ setContent, simple, content }: Props) { const editorRef = useRef(null);

return (

); }

export default TinymceEditor;

const InitSimpleProps = { height: 250, menubar: false, formats: { tindent_format: { selector: 'p', styles: { 'text-indent': '40mm' } }, }, plugins: [ 'advlist', 'autolink', 'lists', 'link', 'image', 'charmap', 'preview', 'anchor', 'searchreplace', 'visualblocks', 'code', 'fullscreen', 'insertdatetime', 'media', 'table', 'code', 'help', 'wordcount', 'link print ', 'preview fullscreen', 'insertdatetime wordcount ', 'insertdatetime', 'pagebreak', ],

toolbar: 'blocks fontfamily fontsize bold italic forecolor image alignleft code aligncenter alignright alignjustify bullist numlist outdent indent',

content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px } p {margin: 0}', advlist_bullet_styles: 'square', fontsize_formats: '8pt 10pt 12pt 14pt 18pt 24pt', contextmenu: ' copy wordcount', object_resizing: true, browser_spellcheck: true, language: 'ar', }; export default InitSimpleProps;

[danoaky-tiny]

You accidentally included your api-key in your code. Just remove that and re-comment please.

[eslamabdelmonaem]

@danoaky-tiny Thanks for the mention

[eslamabdelmonaem]

After More Check From My Side i found it related to onInit={}

Here My init Config:

import { Editor } from '@tinymce/tinymce-react'; import React, { useRef } from 'react'; import InitProps from './initTinyProps'; import InitSimpleProps from './simpleTinyProps';

type Props = { setContent: (content: string) => void; simple: boolean; content: string; }; function TinymceEditor({ setContent, simple, content }: Props) { const editorRef = useRef(null);

return (

); }

export default TinymceEditor;

const InitSimpleProps = { height: 250, menubar: false, formats: { tindent_format: { selector: 'p', styles: { 'text-indent': '40mm' } }, }, plugins: [ 'advlist', 'autolink', 'lists', 'link', 'image', 'charmap', 'preview', 'anchor', 'searchreplace', 'visualblocks', 'code', 'fullscreen', 'insertdatetime', 'media', 'table', 'code', 'help', 'wordcount', 'link print ', 'preview fullscreen', 'insertdatetime wordcount ', 'insertdatetime', 'pagebreak', ],

toolbar: 'blocks fontfamily fontsize bold italic forecolor image alignleft code aligncenter alignright alignjustify bullist numlist outdent indent',

content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px } p {margin: 0}', advlist_bullet_styles: 'square', fontsize_formats: '8pt 10pt 12pt 14pt 18pt 24pt', contextmenu: ' copy wordcount', object_resizing: true, browser_spellcheck: true, language: 'ar', }; export default InitSimpleProps;

[danoaky-tiny]

I've made a code sandbox here: https://codesandbox.io/p/sandbox/int-3270-9hvknm I've included just the code you've given here.

The only issues that you had so far was the plugins prop. Like I said previously, you had plugins combined in the one element, e.g. "preview fullscreen". Along with some duplicates too, but at least that doesn't throw an error in this case. You also had "print" in your plugins list, but it isn't a plugin, it's a toolbar option.

Feel free to fork that sandbox and include more of your code if you still have issues after implementing these fixes

[eslamabdelmonaem]

onInit={(_evt, editor) => editorRef.current === editor}

I have edited the sandbox code with the line that caused the issue you can check and thanks for your time in all