Can I echo a need for this? People using Markdown code fences is super annoying on old Reddit. If RES could auto-format those, it would be amazing!

I think we could reuse the Markdown generator for this. It's already being used for showing the post preview. We could do it like this:

1. detect that a post has a pair of double backticks in it somewhere (regardless of what node they're in)
2. request the source of the post, by downloading its permalink + .json (see /lib/modules/sourceSnudown.js for an example)
3. replace the double backticks in the source with quadruple spaces
4. replace the text content with new HTML generated from the Markdown

The replacement part is trivial (this one adds extra linebreaks to ensure there's at least one linebreak in between, which doesn't matter since the additional linebreaks are ignored).

Would still love to have this. As more people are using the new ``` code formatting style, coding subreddits are becoming increasingly unreadable.

A fix for this issue would be a huge relief. I run into malformed code blocks multiple times a day and at the moment I need to copy/paste them into my editor to see them properly.

As an aside, has anyone found a workaround, like a browser extension or user script?

The workaround I currently use is to click on source (feature from RES) under the badly formatted post, and increase the textarea size. I have a custom style for textareas to set their font to monospace.

Okay, I decided to try my hand at it. It seems this should be mostly easy, surprisingly, considering this has given me much consternation in the past (and many others, evidenced by u/backtickbot)

See below for fully working version

This module works for replacing text content, but it seems textContent is only read-only and can't be written back to. So I need to figure out how to use snudown-js to re-generate html still.

Also, if sourceSnudown does indeed make a network request, that is sad considering textContent field contains the same information.

EDIT: had a typo. Got this implemented.

WORKS:

Only on the first code block and then ones which have a newline after the first backticks? seems very strange, textContent is not the thing to use

/* @flow */

import { markdown } from 'snudown-js';

import { Module } from '../core/module';

import { watchForThings } from '../utils';

export const module: Module<*> = new Module('myModule');

module.moduleName = 'FixBacktickCodeBlocks'; // add the friendly name to locales/locales/en.js for i18n
module.category = 'browsingCategory'; // categories from locales/locales/en.js
module.description = 'Fix Backtick Code Blocks'; // i18n

// See PageType (utils/location.js) for other page types
module.include = ['comments']; // Optional: defaults to including all pages

module.beforeLoad = () => {
	watchForThings(['post', 'comment', 'message'], rewriteCodeBlocks);
};

function rewriteCodeBlocks(thing) {
	// Find the <div class=md> and prepare to edit it
	const markdownBody = thing.element.querySelector('.md');
	const originalMarkdown: string = markdownBody.textContent;
	// Magic regex magic from magic people on github
	const reflowedMarkdown = originalMarkdown.replace(
		/```([\s\S]+?)```/gm,
		(_, code) => `\n${code.split('\n').map(l => `    ${l}`).join('\n')}\n`,
	);
	const htmlMarkdown = markdown(reflowedMarkdown);
	markdownBody.innerHTML = htmlMarkdown;
}