Markdown para HTML e de volta: um conversor com pré-visualização em direto
Cole Markdown e vê a página pronta com HTML limpo ao lado. Cole HTML e obtém Markdown adequado para um README ou um artigo de blogue. Ambos os sentidos funcionam no seu navegador: o texto nunca é enviado para lado nenhum nem guardado.
.md — o ficheiro é lido localmente. É suportado o CommonMark no seu âmbito habitual mais as extensões GFM: tabelas, rasurado e listas de tarefas.
Cole Markdown acima — o HTML aparece aqui.
.html — o ficheiro é lido localmente. A análise passa pelo DOMParser, por isso funciona tanto com um excerto como com uma página inteira.
Cole HTML acima — o Markdown aparece aqui.
O texto não sai do seu navegador — a conversão corre localmente, sem enviar nada para um servidor.
O que é exatamente suportado
Do lado do Markdown — CommonMark no seu âmbito habitual mais as extensões GFM: títulos com cardinais e com sublinhado, parágrafos, linhas horizontais; listas com marcas, numeradas e aninhadas, em forma compacta e espaçada; listas de tarefas entre parênteses retos; citações, incluindo com continuação preguiçosa de linha; código cercado com nome da linguagem e código com indentação; tabelas GFM com alinhamento de colunas; ligações, imagens, ligações automáticas e ligações a definições no fim do documento; negrito, itálico, rasurado, código em linha, carateres escapados e quebra de linha forçada. Do lado do HTML a análise passa pelo próprio DOMParser do navegador, por isso funcionam tanto um excerto como uma página inteira com head. As tabelas com células unidas não passam para Markdown — essa sintaxe não existe lá, por isso ficam como etiquetas e a ferramenta di-lo. O que falta de propósito: o realce de sintaxe nos blocos de código, as notas de rodapé, as fórmulas e as diretivas de geradores de sites estáticos concretos. Isso já não é Markdown, mas o dialeto de uma ferramenta específica.
Uma quebra de linha: dois Markdown diferentes
A fonte mais frequente de divergências entre conversores é precisamente a quebra de linha isolada dentro de um parágrafo. Segundo o CommonMark é um espaço normal: duas linhas colam-se num único parágrafo. É assim que se comportam o Pandoc, os geradores de documentação e a maioria dos sites estáticos. O GitHub faz o contrário nos comentários, nas descrições de tarefas e nas revisões: cada quebra passa a uma etiqueta br. É exatamente por isso que um texto que ficava bem numa tarefa se agrega num parágrafo compacto depois de passar para um README. A caixa «Uma única quebra de linha é um br» alterna entre estes dois hábitos. Por omissão vale a regra do CommonMark.
Porque é que a pré-visualização não mostra tudo o que está no HTML
Por especificação, o Markdown permite HTML dentro de si. É cómodo e, ao mesmo tempo, significa que qualquer texto colado pode conter código executável. Os visualizadores online populares metem o resultado em innerHTML tal como está. A biblioteca marked em que assentam já não tem qualquer sanitização integrada desde a versão quatro — uma etiqueta script vinda do Markdown alheio executa-se ali sem mais. Aqui a pré-visualização é construída com nós DOM segundo uma lista branca: script, iframe, object, os manipuladores de eventos do género onclick e as ligações com esquema javascript: não lá chegam, e a lista do que foi cortado aparece por baixo do resultado. No separador «Código HTML» vê a saída completa sem cortes — é texto, não uma página, e executá-lo é impossível. O HTML da origem só pode chegar à pré-visualização quando é o próprio a ligar a caixa correspondente. Por omissão as etiquetas são escapadas e mostradas como texto.