Bold newline empty line test attempt

[jywarren]

Test for #658 for the following behavior:

What happens is that if (in rich text) we make 2 new lines after bolding a line, then type, it's bold (which is OK, although we could change that if it makes a solution easier). Then, if we unbold the text on the 2nd new line, and keep typing, things seem normal... but in fact there is a double ** left on 2 consecutive lines due to the remaining "bolded" newline (which has no text on it). This the causes ** to appear in markdown mode when we switch to it, and on switching back to rich text, triggers a formatting error:

[gitpod-io]

[jywarren]

uh oh! jasmine tests failing with:

Running "jasmine:publiclabeditor" (jasmine) task
Testing Jasmine specs via PhantomJS
 Publish button
   - Publish button is enabled...X Publish button is enabled
     ReferenceError: Can't find variable: PL in file:///home/travis/build/publiclab/PublicLab.Editor/spec/javascripts/button_spec.js (line 7) (1)

is this affecting many Jasmine tests? I feel like I've seen this recently...

[jywarren]

So jest says:

    ✕ does not leave empty lines with ** bold markdown tags when adding newlines from end of bold text (36 ms)
  ● Bold Text › does not leave empty lines with ** bold markdown tags when adding newlines from end of bold text
    No node found for selector: Normal text
      54 |     await page.waitForSelector('.wk-wysiwyg');
      55 | 
    > 56 |     await page.type("Normal text");
         |                ^
      57 |     await page.type(String.fromCharCode(13)); // Enter (see https://stackoverflow.com/questions/46442253/pressing-enter-button-in-puppeteer)
      58 | 
      59 |     await page.click('.woofmark-command-bold');
      at assert (node_modules/puppeteer/lib/helper.js:283:11)
      at DOMWorld.type (node_modules/puppeteer/lib/DOMWorld.js:421:5)
        -- ASYNC --
      at Frame.<anonymous> (node_modules/puppeteer/lib/helper.js:111:15)
      at Page.type (node_modules/puppeteer/lib/Page.js:1103:29)
      at Object.test (test/ui-testing/bold.test.js:56:16)

[jywarren]

Great, the Jest test is now simply failing, so if we fix the behavior, it should pass.

[jywarren]

Maybe just add a condition that it won't add ** around a newline or empty text?

[Sagarpreet]

Maybe we can use:

woofmark(textarea, {
  parseMarkdown: function (input) {
    return require('megamark')(input, {
      tokenizers: [{
        token: /(^|\s)@([A-z]+)\b/g,
        transform: function (all, separator, id) {
          return separator + '<a href="/users/' + id + '">@' + id + '</a>';
        }
      }]
    });
  },
  parseHTML: require('domador')
});

To return empty string if regex have **** matches.

[Sagarpreet]

OR maybe we can change here: use https://github.com/bevacqua/domador#transform

[jywarren]

Wow, transform sounds great --

Allows you to take over the default transformation for any given DOM element.

we can check like this?

domador(el, {
  transform: function (el) {
    if (el.innerHTML === '****') {
      return '';
    }
  }
});

Or maybe it's el.innerHTML.match(/\*\*\w\*\*/) to find any ** with whitespace between?

we have to be careful that it doesn't affect a situation with an /ending/ ** and starting **. But yes, something like that!

Maybe a test could be:

Testing empty bold tags.

**Legit bold one.**

**Legit bold two.**

**
**

**

**

** **

**Legit bold three.**

That should strip out all except:

Testing empty bold tags.

**Legit bold one.**

**Legit bold two.**

**Legit bold three.**

Jest makes this nice and easy to test, though, in woofmark!