Now in master: ES6 Modules + Text Rendering

Dev
1

Approximately 2 years ago we started down the long path to ES6 modules. For a long time, I’d spent 30 minutes a day working on converting files, which eventually got replaced with my strategy of converting a file every time I had to open it.

Over time we got most of the way there, but with one big holdout: our text rendering engine. It was in standard ES5 modules because we used the same text rendering code on the server and client side of Discourse, and the server side didn’t have a way to parse the new module syntax.

New Markdown Bindings

In our latest release, we set aside some time to refactor the old markdown engine to ES6. While in there, I removed all of our dependencies on global state, so that when you render text you can just pass in all the options for various rendering features. This is a massive help in multi site environments where some features couldn’t be turned off when initialized on the server side.

This allows us a path forward to integrating commonmark in a future release of Discourse.

100% ES6 Modules

Once the markdown code was refactored to use ES6 modules, it turned out there were only a dozen outliers left over. I went in and upgraded all those files, so the next Discourse release will be 100% ES6 modules, which feels awesome after so many years of slowly working towards it.

N.B. there are still many references to modules like Discourse.XYZ which need to be replaced, but that should be pretty smooth sailing now that all the modules are hooked up and working.)

This new branch has MANY MANY changes, so we are very likely to experience some regressions over the next short while. I am only deploying meta.discourse.org to the branch right now, until we are sure it’s more or less stable. Then I’ll merge it into master.

Now is a good time to help us poke around the site and let us know if anything at all seems broken or weird. Please post your bugs in this topic, which I will update as issues get fixed!

If you are a plugin author, please try out your plugins with the branch and let me know if anything has broken. I will work quickly with you to fix issues before this ends up in a beta branch of ours.

The branch with all the new ES6 fixes is called prettyes6

31 Likes
5

I believe this broke the highlighting of keyboard shortcuts.

:bulb: Tip: You can abort the import anytime you want by pressing Ctrl+C
When you restart the import it will continue where it left off.

Here’s the raw text that doesn’t work anymore:
<kbd>Ctrl</kbd>+<kbd>C</kbd>

It works on try.discourse.org:

4 Likes
6

Site Customization area is SUPER flakey.

Pasted image897×981 52.2 KB

3 Likes
7

Staff notes does not appear to be working

1 Like
8

Just deploying fixes for:

  • Staff Notes not working
  • kbd was not whitelisted
  • ace editor was broken
6 Likes
9

I’m assuming that prettyes6 is the branch containing these changes. It may be a good idea to reference that in the original post. Hoping I can get to testing against it in the next day or two.

4 Likes
10

Done, thanks for the suggestion :slight_smile:

3 Likes
11

Not sure why, but registering emoji’s broke in this branch. It works fine running on tests-passed, but fails on the prettyes6 branch

Reference to feature
https://meta.discourse.org/t/emojis-not-appearing-in-the-published-message/35200/11?u=cpradio

Plugin that stopped working (no apparent errors)
https://github.com/cpradio/discourse-plugin-vb-emoticons

I deleted the cache on my dev machine to make sure that wasn’t the problem.

3 Likes
12

Ah, I was a little concerned this might happen. There was an old API for adding emoji plugins that we hadn’t used in a while, since now users can upload whatever emoji they want via the admin interface.

It was easier to remove it going forward, but I didn’t think of someone adding an entire set this way. I’ll look into restoring that functionality.

13

Also, what is the appropriate replacement to Discourse.Dialect.inlineBetween? I don’t see it in the deprecated.js

I was using inlineBetween at
https://github.com/cpradio/discourse-plugin-checklist/blob/master/assets/javascripts/discourse/checklist_dialect.js

Edited: Seems addPreProcessor will also cause me problems.

Another Edit: And what about Discourse.Markdown.whiteListTag? That used to be the way to add custom tags, now it is deprecated.

Last Edit (hopefully): Seems a lot of this was moved to discourse-markdown and pretty-text. Trying a couple of things out to see if that holds up. :slight_smile:

14

Okay, so I’m trying to mimic
https://github.com/discourse/discourse-spoiler-alert/blob/master/assets/javascripts/lib/discourse-markdown/spoiler-alert.js.es6

But for whatever reason, it doesn’t act like it is getting called.
https://github.com/cpradio/discourse-plugin-checklist/blob/es6-pretty-text/assets/javascripts/lib/discourse-markdown/checklist.js.es6

Edit: Okay, I got this working now :slight_smile: Now on to figure out what replaces Discourse.Markdown.cook :slight_smile:

15

My poor little theme is dead :frowning:

https://meta.discourse.org/?preview-style=589a2b8f-237f-4408-b86b-2d5f158b22b6

meta.discourse.org/:388 Uncaught ReferenceError: RawHandlebars is not defined

16

And for those also wondering, it is now at discourse/lib/text :slight_smile:

And with that, I think all of my plugins now support the ES6 branch, except for the Emoji one.

The checklist one seems to not really have a way to handle the changes in a backwards compatible way though… Or maybe it does based on plugin version, maybe I can reference 0.4 versus 0.5 and call two different initializers (I’m not sure it is worth the effort).

5 Likes
17

Details plugin isn’t working as expected (works fine in the composer, not so fine in the cooked version ;))

Details

Some text before

Here’s a quote

Some text after

2 Likes
18

Here’s a fix for the customization not working:

https://github.com/discourse/discourse/commit/494b3054c8c08b7677d380d04a4bc727547147ec

Is there a way to force customizations to rebake though? It will need to go through the new compiler.

2 Likes
19

It should have been deprecated. I’ve pushed out a new commit that displays a proper message if you use it. It looks like you figured out how to export a setup() method though, which is great!

https://github.com/discourse/discourse/commit/59a5836d3af4b1f93ff1271078b155c5e2b2f007

4 Likes
20

Tricky, perhaps if we null the baked part it can figure out that happened and rebake?

3 Likes
21

I think this should do it. Would be nice if you could review, thanks!

https://github.com/discourse/discourse/commit/80bfb983c0ae2291228ad5d4e4b8381958ba966e

5 Likes
23

I think </strike> is broken too. (I’d tried to add it to my comment here )

1 Like