Trumbowyg: First paragraph isn't wrapped around with P tags

[idansh]

After updating to the latest version 2.5.1. When I first write a paragraph and press enter, the first paragraph isn't wrapped around with p tags, whether on the second ENTER, it does. It wasn't like that in the 2.4.2 version. In the older version, when I pressed ENTER after finishing the first paragraph, it was inside P tags.

Using latest Chrome browser Version 56.0.2924.87 on Windows 7.

[cyberwolfru]

Any updates on this issue?

[Alex-D]

I don't have the time to work on Trumbowyg for now. Sorry. I have to review PRs if you want contribute :)

[alizahid]

@Alex-D I could look into it, if you could point me in the right direction.

[yprez]

The commit that caused this seems to be fdd3dec (checked with git bisect). No idea how to fix this, but maybe it helps...

[mccambridge]

I'm currently seeing this issue in Chrome. Is this repo still being maintained? I understand what it's like not to have a lot of time. Do you plan on fixing in the near future? Thanks!

[Alex-D]

I maintain the repo yep, but as I did not get any revenue from Trumbowyg, I can't take lot of time to found workarroud to weird browsers bugs ^^'

I am working on improving documentation and some other things: #613

[Alex-D]

Bug should be in the diff: https://github.com/Alex-D/Trumbowyg/compare/v2.4.2...v2.5.1#diff-a57e0e52aed1451208c5f2010cd3b537

[mccambridge]

Thanks again. I know it's a lot of work to maintain a quality open source project. I really like this editor so far! :)

[eudoxyz]

Here's a solution I devised:

$('#editor').trumbowyg({
  // options...
})
.on('tbwinit', function() {
  // first we have to set focus on the editor
  this.focus();

  // then we add 'p' tags around the first line, which is empty
  document.execCommand('formatBlock', false, '<p>');

  // note: we can't just append 'p' block to '#editor'
  // because when we start typing it doesn't go inside of the block
})
.on('tbwchange', function() {
  // if we delete everything in the editor, the first 'p' block is gone as well,
  // so we always have to check if our editor is empty to repopulate it
  // with our first 'p' block
  if (this.innerHTML === '')
    document.execCommand('formatBlock', false, '<p>');
});

[Alex-D]

That breaks the required attribute: if you put the p tag at the init, the textarea is not empty :/
We need to found some workaround to fix that...

[eudoxyz]

Can't we put it at keyup then, i.e. as soon as we start typing in an empty editor?

[idansh]

Any update on this.

[Alex-D]

I did not have the time to fix that for now, but I'm able to merge a Pull Request :)

[idansh]

Ok I will look into it tomorrow. Didn’t upgrade since then because of that. Hope I’ll find the issue.

[iplanwebsites]

@idansh +1
I'm running into the same problem and would love to stick to the latest release.
Do you know which release did NOT have this problem?

[ExsyDev]

Please fix this.

[thoth3x]

Here is what worked for me (based on @eudoxyz solution):

$('#editor').trumbowyg({
  // options...
}).on('tbwchange', function() {
    document.execCommand('formatBlock', false, '<p>');
});

Trumbowyg version: 2.13.0

It also works with tbwblur

Hope that helps.

[Alex-D]

This is fixed in last version of Trumbowyg :)