Help us test the rewritten Composer

iPad composer behavior is problematic, composer appears and then disappears immediately (at least in landscape)

The pop up for adding links appears inside the composer instead of the main page:

The link insertion is also flawed. If I mark this text to be linked and enter a link for it I should get [this text to be linked](http://example.com) but it replaces the highlighted text with the link as such: [http://example.com](http://example.com)

4 Likes

Here is a fix for the selected text to link
https://github.com/discourse/discourse/pull/3891

4 Likes

I don’t want to ask too much of you all, but what would be the best way to add a simple new button (using a bbcode already existing) ?

For example a spoiler button using the [spoiler][/spoiler] bbcode

Based on the discourse commit and @cpradio plugin, I have something like that :

/assets/javascripts/discourse/initializers/spoiler.js.es6

import { onToolbarCreate } from 'discourse/components/d-editor';

onToolbarCreate(toolbar => {
  toolbar.addButton({
    id: "spoiler-button",
    group: "extras",
    icon: "eye-slash",
    perform: e => e.applySurround('[spoiler]', '[/spoiler]', 'text')
    });
});

Is it a good start ?

1 Like

That’s pretty close. Are you getting an error or anything, if you have it on GitHub, I can pull it down and see if I can get it to work.

A little update, @cpradio made a plugin that works, I was able to add some buttons myself, it’s pretty easy if some people want to add theirs : GitHub - cpradio/discourse-plugin-spoiler-ui: Spoiler Composer Button for Discourse

Minor bug, I don’t know if it’s the composer or the plugin, but the spoiler bbcode doesn’t work on the preview, but works fine otherwise

Test

Also, not really a bug, but an observation. When we used an emoji (via the modal), the old editor added one space before and one after the emoji, not in the new one. Not really a problem though

edit : and finally, a little problem for european users, when we type the euro symbol (€ - shortcut : ALT Gr + E) it also opens the emoji modal.

So I already submitted a PR for the link text, but I can’t recreate the other issues here on Meta, so I’m not sure there is anything to fix. Might want to make sure you are on latest.

I think he means, when us use the quote button without any selected text, nothing appears in the text area.

Not really a problem for me, but I think that’s what he meant.

For the code button, the default reaction was the 4 spaces, now it’s the one line version `'indent preformatted text by 4 spaces``. I prefer the new one personnally.

1 Like

Ah, didn’t notice that. I had only used it with selected text. :smile:

Yeah, unless you have text, then it preformats your selected text using the 4 spaces method (when multiple lines are selected, if the text is on a single line it seems to use code fences. – cool

I guess he means about (old) shortcuts on quotes, code and so on. But then he read this topic and he now understood why things are broken now. :smile:

When you guys will decide to normalize shortcuts with other editors, please compare to other markdown editors, not with editors in general (i.e. how the editor on stack overflow works?).

A small suggestion: please try to make a smart shortcuts for bold/italic. This means that if you press ctrl+i, you get the stars. If you start typing then press ctrl+i again another set of stars are inserted, when it should just skip the star.

See here a sample:

Would be great if those things could be changed…

1 Like

So whilst researching the quoted text button and list items only selecting the text that should change (which present a LOT of edge cases if you adjust them!)

I found this
https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/components/d-editor.js.es6#L339

It seems to reason that the line should actually read as this._selectText(sel.start + hlen, contents.length - hlen - tlen), for cases where the tailing tag being inserted is not the same length as the heading tag (think [spoiler]my test[/spoiler])

It’s not possible to see the bottom of a topic anymore when the editor is visible. The new editor seems to be layered on top of the posts.

It’s not really a big issue as long as the editor height is the same as the height of the suggested topics. But this is kinda annoying when I resize the editor or when there are no suggested topics (answering a private message).

4 Likes

Another little problem, if we type a long text, the scrolling in the preview doesn’t follow the scrolling in the composer. In the preview, if we don’t scroll manually, it stays at the beginning of the post.

1 Like

Markdown links appear to be broken:

e.g.:

[google](www.google.com)

google

(tested in Chrome, Firefox)

We used to extend blank onto the footer so you can always see everything regardless of size

No, it simply requires the http

[google](http://www.google.com)

google

3 Likes

Weird, I guess I never noticed that before. Thanks for clearing that up.

Issue resolved nonexistent. :smiley:

edit: I think I was just thrown off because the editor recognizes URLs without the http bit normally, e.g. www.google.com works fine.

@eviltrout:

Somewhat related to this topic: does the new composer help in any way regarding the possibility of having seamless embedded Discourse comments?

For reference see: https://meta.discourse.org/t/auto-assign-new-embedded-blog-topics-unique-categories/32036/10

I’m seeing the same erratic behavior in Chrome on the iPad too.

Here is a screenshot: