search

tinymce / tinymce-angular

Official TinyMCE Angular Component
MIT License
330 stars 92 forks source link

Tinymce issue with Material Stepper #111

Closed Dr-Ai1 closed 5 years ago

Dr-Ai1 commented 5 years ago

Im using tinymce in a form which is further divided into three steps using Material Angular Stepper. Giving console errors "Uncaught TypeError: Cannot read property 'length' of undefined", "Unhandled Promise rejection: Cannot read property 'length' of undefined ; Zone: ; Task: Promise.then ; Value: TypeError: Cannot read property 'length' of undefined",

Cursor jumping to start while typing.

My version is "5.0.14" and giving issue in both chrome and firefox.

Issue resolves if i remove the mat-stepper tags

SimonFc commented 5 years ago

I think this is due to a common issue with tinymce-angular when using it in iframe mode. Due to how browser implements iframes they'll re-render them whenever they're detached from the DOM which I think is what is happening for you when you're using tinymce-angular with this Angular Material Stepper component.

We have an example of a work around for this issue here with Angular Material Tabs (see here) and I think something similar should work in this case. (The workaround consist of conditionally showing tinymce-angular when the tab is active)

If you think the issue is due to something else then please provide a reproduction of the issue and I'll reopen this!