You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
We are using froala-editor package, together with angular-froala-wysiwyg.
We recognized the following behaviors with the new version of these packages:
FroalaEditorDirective imports FroalaEditor from froala_editor.min.js instead of froala_editor.pkgd.min.js which causes lack of functionalities (e.g. in toolbar)
These issues have been traced back to the following root cause:
Please consider the following differences between the 2 editors:
Custom icon is not showing up in the toolbar in case of the Angular spec. editor (triangular shape on the Non-Angular editor)
A couple of options are missing from the toolbar in case of the Angular spec. editor
There is no character counter in the footer in case of the Angular spec. editor
+1 the FroalaEditor.INSTANCES contains only one reference (for the Non-Angular editor), although clearly there are 2 editors
+2 build warning on console
For curiosity I checked what happens if I remove the line of the following import from node_modules\...\angular-froala-wysiwyg.js: import FroalaEditor from 'froala-editor';
And as you can see, it solved all of the points above:
Hi Guys,
We are using
froala-editor
package, together withangular-froala-wysiwyg
.We recognized the following behaviors with the new version of these packages:
FroalaEditor
global object, as it is described here: https://froala.com/wysiwyg-editor/docs/concepts/custom/button/FroalaEditorDirective
importsFroalaEditor
fromfroala_editor.min.js
instead offroala_editor.pkgd.min.js
which causes lack of functionalities (e.g. in toolbar)These issues have been traced back to the following root cause:
FroalaEditorDirective
imports directlyFroalaEditor
object/constructor fromfroala-editor
like: https://github.com/froala/angular-froala-wysiwyg/blob/master/projects/library/src/editor/editor.directive.ts#L4I have created a test repo for demonstration with both Angular and Non-Angular version of the editor: bence-balogh-intland/angular-froala-test@master...add-froala
![image](https://cdn.statically.io/img/user-images.githubusercontent.com/111267978/193004763-69bf90e1-0d64-4f54-8f2d-09f7cf077000.png)
With the following result:
Please consider the following differences between the 2 editors:
For curiosity I checked what happens if I remove the line of the following import from
node_modules\...\angular-froala-wysiwyg.js
:import FroalaEditor from 'froala-editor';
And as you can see, it solved all of the points above:
![image](https://cdn.statically.io/img/user-images.githubusercontent.com/111267978/193006257-ffb9e513-3933-4367-85a0-7d1e2f356c8b.png)
So my suggestion would be to remove the import of
FroalaEditor
fromangular-froala-wysiwyg
, and leave this resolution for the host applications, sincefroala-editor
appendsFroalaEditor
to the window object on initialization.E.g. one possible way to do that: bence-balogh-intland/angular-froala-test@master...add-froala#diff-2d2675bb4687601a5c7ccf707455132f90f3516a33716185687e5c41df59ac7dR36
Checked with:
angular-froala-wysiwyg: 4.0.14
froala-editor: 4.0.14
Node: 14.18.0
Angular: 14.2.0
Thanks in advance!
The text was updated successfully, but these errors were encountered: