question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

TinyMCE in IonModal fails to start when initialised a second time

See original GitHub issue

What is the current behavior? I have an Editor on an IonModal if I open the modal twice the Editor crashes and fails to render.

Please provide the steps to reproduce and if possible a minimal demo of the problem via codesandbox.io or similar. You can find a minimal example of this here: https://codesandbox.io/s/jolly-fire-d7l52?file=/src/App.js If you press “Show Modal” twice it crashes with

tinymce.min.js:2 Uncaught TypeError: Cannot read property 'open' of undefined

What is the expected behavior?

The Editor should show up.

Which versions of TinyMCE, and which browser / OS are affected by this issue? Did this work in previous versions of TinyMCE or tinymce-react?

Google Chrome | 87.0.4280.141

@tinymce/tinymce-react 3.9.0 @ionic/react 5.5.2 @ionic/react-hooks 0.0.8 @ionic/react-route 5.3.4

I figure it’s a problem with the IonModal and my current workaround to use the Material-UI Modal works. I just thought I should let someone know.

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:3
  • Comments:20 (9 by maintainers)

github_iconTop GitHub Comments

3reactions
antoniocapelocommented, Apr 16, 2021

Thanks for the reply @Marruixu. Yes I eventually also tried using tinymce directly with a textarea (no react wrapper) but bumped into other problems (missing themes, icons) and even though I tried importing them, the current project’s gulp setup is not ready for this approach… I put a pin on it because of the time that this adaptation might take.

Still, it seems that the solution is simply not using the library, which is a pitty …

2reactions
antoniocapelocommented, Apr 16, 2021

I’m suffering from the same issue. Although the editor is not inside a modal, it’s an element that either gets added or removed from the DOM. As soon as it’s added a second time, I’m faced with the “Cannot read property ‘open’ of undefined” error. @Marruixu I’ve tried sending a different id on each mount but without any luck…

Read more comments on GitHub >

github_iconTop Results From Across the Web

Why Tinymce fails to load second time? - Stack Overflow
From what I see, given the solution that works, something loads TinyMCE two times, and the second time causes the error.
Read more >
Problem while trying to open tinymce editor second time in ...
The problem i am facing is, for the first when I am opening the modal popup i.e. 'Contact Us' Form , the tincemce...
Read more >
Configure TinyMCE in modal windows | FAQs and Solutions
Using TinyMCE in a modal dialog. Open an index.html file in your environment, and include the TinyMCE CDN link and init script to...
Read more >
Angular 7 Tinymce working example - Therichpost
I am loading the script and css file using cloud as given below in index.html page head section. MYAPIKey is my APIKey that...
Read more >
Options - Froala
Edit the text inside the HTML element on which the editor is initialized on in a popup. CODE EXAMPLE. Copy new FroalaEditor('.selector', {...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found