Cannot delete mention in Froala Editor

[Blackening999]

@leb2dg Cannot delete mentions in Froala editor thanks to this update :
It works fine for 1.4.0

Related to this PR https://github.com/ichord/At.js/pull/423

[laurenbarker]

Ah, I didn't test it in any third party editors; sorry it caused an issue in Froala. I would suggest contacting the maintainers. If you wanted to fix it yourself you could add a flag to use the zero width joiners in contenteditable elements. Possibly something like:

$('.atwho-inputor').atwho({
    // use zero width joiner and `contenteditable=true` in contenteditable elements
    zeroWidthJoiner: true
});

[ichord]

I think it's time to refactor everything...

[blimey85]

I ran into this issue today. On the demo page everything works fine but on my page I couldn't click a mention to edit it and deleting it was problematic. I compared the two and found that on the demo page it had contenteditable=true while mine was marked false. I changed mine to true and my problems vanished. I then went poking in the code and found this line:

this.query.el.removeClass('atwho-query').addClass('atwho-inserted').html(content).attr('data-atwho-at-query', "" + data['atwho-at'] + this.query.text).attr('contenteditable', "true");

I changed the value at the end of the line from false to true and that seems to have solved my problem. I don't know if this is the correct way to solve the issue, or what other problems this may introduce, but I'm only using it within Froala for this project and it now seems to be working great.

EDIT: Not working great actually. Having an issue with being able to put a comma after a mention. One additional thing I noticed is that on the demo page version 1.4.0 is being used whereas I'm using version 1.5.3. I commented out my inclusion and added the two scripts into the header of my site and that solved everything. So apparently an issue has been introduced since version 1.4.0. Any advice on how I can go about tracking down what the actual issue is? Would it be ok for me just to run the older version? I'm assuming quite a bit has changed between 1.4.0 and 1.5.3.

[fabiomilheiro]

Anyone people? If people can't go beyond 1.4.0, then don't bother creating more versions, right?

BTW, any paid version that is an alternative to At.js or At.js paid support please?

[stefanneculai]

@blimey85 @fabiomilheiro @Blackening999 @laurenbarker please see https://github.com/ichord/At.js/wiki/Usage-with-Froala-WYSIWYG-HTML-Editor. I just updated it to work with At.js >1.5

@ichord The problem is coming from the fact that in the new version there is contenteditable="false" added to the inserted markup. I believe we could help here if you could detail for what is that being used. Thanks.

[laurenbarker]

The original issue is described in https://github.com/ichord/At.js/issues/393. It ended up causing issues in some browsers though so we reverted #423 (https://github.com/CenterForOpenScience/At.js/pull/3) :/

[vishal-jadhao]

@blimey85 @fabiomilheiro @Blackening999 @laurenbarker please see https://github.com/ichord/At.js/wiki/Usage-with-Froala-WYSIWYG-HTML-Editor. I just updated it to work with At.js >1.5

@ichord The problem is coming from the fact that in the new version there is contenteditable="false" added to the inserted markup. I believe we could help here if you could detail for what is that being used. Thanks.

@ichord : It solved deletion problem but if we want to add single quotation mark to the mentioned name the markup get cleared, e.g. @ichord's not able to add such mention. please revert back.

[stefanneculai]

As At.js has been deprecated, we made an integration with Tribute.js: https://www.froala.com/wysiwyg-editor/examples/tribute-js.

[ichord]

Thanks @stefanneculai