Chrome Browser Based Bug and high memory usage after sometime
What is the current behavior? Hey I am using tinymce-react package in my nextjs 14 based production app. The problem is that the tinymce doesnot work on chrome browser. I have tried disabling all extensions, cleared cache, reinstalled chrome and tried again but I was shocked when It worked with firefox , edge and brave at them same time but not chrome. Thats what proves theissue is not on my code side. Code is okay and checked too. **Please provide the steps to reproduce and if possible a minimal demo of the problem via [codesandbox.io] Note : I have used formik and yup so you can guess it further. I also faced high memory usage in browsers once we write around above 800 words (around I guess). The editor starts lagging and doesnot respond if we don't refresh whole tab. This problem was not with previous version as far as I remember.
"use client"
import { Editor } from '@tinymce/tinymce-react';
<Editor
textareaName='long_desc' id="long_descd" value={values.long_desc} onBlur={handleBlur}
onEditorChange={(e) => { handleChange({ target: { name: 'long_desc', value: e } }) }}
apiKey={process.env.NEXT_PUBLIC_TINYMCE_API_KEY as string}
onInit={(evt, editor) => editorRef.current = editor}
init={{
height: 800,
menubar: true,
plugins: 'preview importcss searchreplace autolink autosave save directionality code visualblocks visualchars fullscreen image link media codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists wordcount help charmap quickbars emoticons',
toolbar_sticky: true,
toolbar: 'undo redo | bold italic underline strikethrough | fontselect fontsizeselect formatselect | alignleft aligncenter alignright alignjustify | outdent indent | numlist bullist | forecolor backcolor removeformat | pagebreak | charmap emoticons | fullscreen preview save print | insertfile image media link anchor codesample | ltr rtl',
content_style: 'body { font-family:-apple-system, BlinkMacSystemFont, Segoe UI, sans-serif; font-size:14px }',
toolbar_mode: 'sliding',
}}
/>
Chrome bug Image here
Brave Working Image here
What is the expected behavior?
The editor was supposed to work in chrome browser too and the problem seems to be browser specific. I can surely say its a browser specific issue but I don't know what issue is it and how to solve it. Otherwise i would create a Pull Request :(
Which versions of TinyMCE, and which browser / OS are affected by this issue? Did this work in previous versions of TinyMCE or tinymce-react?
Chrome version is 121.0.6167.160 (Official Build) (64-bit)
Tinymce version is "@tinymce/tinymce-react": "^4.3.0",
Windows 10
Is anything logged to the console, frontend or backend? Otherwise, code sandbox templates for NextJS do exist, so creating one for your issue would help greatly to find what the problem is.
This issue is stale because it has been open for 30 days with no activity. Respond with a comment or this will be closed in 7 days.