From 1375e6880a64a2eec4a099c8ac37e2f133338abb Mon Sep 17 00:00:00 2001 From: Simon Lydell Date: Thu, 14 Sep 2017 00:14:35 +0200 Subject: [PATCH] Generate ISSUE_TEMPLATE.md on build --- .github/ISSUE_TEMPLATE.md | 16 ++-- scripts/build/build.js | 21 +++-- website/pages/playground/index.html | 1 + website/static/markdown.js | 87 ++++++++++++++++++++ website/static/playground.js | 118 ++++------------------------ website/static/service-worker.js | 1 + 6 files changed, 132 insertions(+), 112 deletions(-) create mode 100644 website/static/markdown.js diff --git a/.github/ISSUE_TEMPLATE.md b/.github/ISSUE_TEMPLATE.md index 04c3249cf..d2c44cb5b 100644 --- a/.github/ISSUE_TEMPLATE.md +++ b/.github/ISSUE_TEMPLATE.md @@ -2,22 +2,26 @@ Tip! Don't write this stuff manually. -1. Go to https://prettier.io/playground/ +1. Go to https://prettier.io/playground 2. Paste your code and set options -3. Press the "Copy as markdown" button in the upper right +3. Press the "Report issue" button in the lower right --> -**Prettier Version:** 1.6.1 -([Playground link](https://prettier.io/playground/#.....)) +**Prettier 1.6.1** +[Playground link](https://prettier.io/playground/#.....) +``` +# Options (if any): +--single-quote +``` **Input:** -```js +```jsx // code snippet ``` **Output:** -```js +```jsx // code snippet ``` diff --git a/scripts/build/build.js b/scripts/build/build.js index e7df784d7..4a321a579 100755 --- a/scripts/build/build.js +++ b/scripts/build/build.js @@ -4,6 +4,7 @@ const path = require("path"); const pkg = require("../../package.json"); +const formatMarkdown = require("../../website/static/markdown"); const shell = require("shelljs"); const rootDir = path.join(__dirname, "..", ".."); @@ -99,12 +100,22 @@ shell.sed( ); shell.echo("Update ISSUE_TEMPLATE.md"); -shell.sed( - "-i", - /(?!Prettier Version.*?)\d+\.\d+\.\d+/, - pkg.version, - ".github/ISSUE_TEMPLATE.md" +const issueTemplate = shell.cat(".github/ISSUE_TEMPLATE.md").stdout; +const newIssueTemplate = issueTemplate.replace( + /-->[^]*$/, + "-->\n\n" + + formatMarkdown( + "// code snippet", + "// code snippet", + "", + pkg.version, + "https://prettier.io/playground/#.....", + { parser: "babylon" }, + [["# Options (if any):", true], ["--single-quote", true]], + true + ) ); +pipe(newIssueTemplate).to(".github/ISSUE_TEMPLATE.md"); shell.echo("Copy sw-toolbox.js to docs"); shell.cp("node_modules/sw-toolbox/sw-toolbox.js", `${docs}/sw-toolbox.js`); diff --git a/website/pages/playground/index.html b/website/pages/playground/index.html index 45c1e0cec..a04711d72 100644 --- a/website/pages/playground/index.html +++ b/website/pages/playground/index.html @@ -23,6 +23,7 @@ + diff --git a/website/static/markdown.js b/website/static/markdown.js new file mode 100644 index 000000000..ac3b2e0fe --- /dev/null +++ b/website/static/markdown.js @@ -0,0 +1,87 @@ +/* eslint-env browser */ +/* eslint no-var: off, strict: off, prefer-arrow-callback: off */ + +// NOTE: This file must work both in the playground, and in the build scripts to +// generate the issue template. + +(function() { + function formatMarkdown( + input, + output, + output2, + version, + url, + options, + cliOptions, + full + ) { + var syntax = getMarkdownSyntax(options); + var optionsString = formatCLIOptions(cliOptions); + var isIdempotent = output2 === "" || output === output2; + + return [ + "**Prettier " + version + "**", + "[Playground link](" + url + ")", + optionsString === "" ? null : codeBlock(optionsString), + "", + "**Input:**", + codeBlock(input, syntax), + "", + "**Output:**", + codeBlock(output, syntax) + ] + .concat( + isIdempotent + ? [] + : ["", "**Second Output:**", codeBlock(output2, syntax)] + ) + .concat(full ? ["", "**Expected behavior:**", ""] : []) + .filter(function(part) { + return part != null; + }) + .join("\n"); + } + + function getMarkdownSyntax(options) { + switch (options.parser) { + case "babylon": + case "flow": + return "jsx"; + case "typescript": + return "tsx"; + case "postcss": + return "scss"; + default: + return options.parser; + } + } + + function formatCLIOptions(cliOptions) { + return cliOptions + .map(function(option) { + var name = option[0]; + var value = option[1]; + return value === true ? name : name + " " + value; + }) + .join("\n"); + } + + function codeBlock(content, syntax) { + var backtickSequences = content.match(/`+/g) || []; + var longestBacktickSequenceLength = Math.max.apply( + null, + backtickSequences.map(function(backticks) { + return backticks.length; + }) + ); + var fenceLength = Math.max(3, longestBacktickSequenceLength + 1); + var fence = Array(fenceLength + 1).join("`"); + return [fence + (syntax || ""), content, fence].join("\n"); + } + + if (typeof module !== "undefined" && module.exports) { + module.exports = formatMarkdown; + } else { + window.formatMarkdown = formatMarkdown; + } +})(); diff --git a/website/static/playground.js b/website/static/playground.js index 63a6c8dd5..a95907d5e 100644 --- a/website/static/playground.js +++ b/website/static/playground.js @@ -1,6 +1,6 @@ /* eslint-env browser */ /* eslint no-var: off, strict: off, prefer-arrow-callback: off */ -/* global Clipboard CodeMirror */ +/* global Clipboard CodeMirror formatMarkdown */ var prettierVersion = "?"; var inputEditor; @@ -62,7 +62,7 @@ worker.onmessage = function(message) { : message.data.formatted2 || "" ); document.getElementById("button-report-issue").search = - "body=" + encodeURIComponent(createIssueTemplate()); + "body=" + encodeURIComponent(createMarkdown(true)); } }; @@ -224,10 +224,19 @@ function setCodemirrorMode(editor, mode) { CodeMirror.autoLoadMode(editor, mode); } +function getCodemirrorMode(options) { + switch (options.parser) { + case "postcss": + return "css"; + default: + return "javascript"; + } +} + function formatAsync() { var options = getOptions(); - var mode = util.getCodemirrorMode(options); + var mode = getCodemirrorMode(options); setCodemirrorMode(inputEditor, mode); setCodemirrorMode(outputEditor, mode); setCodemirrorMode(output2Editor, mode); @@ -258,28 +267,25 @@ function formatAsync() { }); } -function createMarkdown() { +function createMarkdown(full) { var input = inputEditor.getValue(); var output = outputEditor.getValue(); var output2 = output2Editor.getValue(); var options = getOptions(); var cliOptions = getCLIOptions(); - var markdown = util.formatMarkdown( + var markdown = formatMarkdown( input, output, - output2, + output2 === IDEMPOTENT_MESSAGE ? "" : output2, prettierVersion, window.location.href, options, - cliOptions + cliOptions, + full ); return markdown; } -function createIssueTemplate() { - return [createMarkdown(), "", "**Expected behavior:**", ""].join("\n"); -} - function showTooltip(elem, text) { var tooltip = document.createElement("span"); tooltip.className = "tooltip"; @@ -289,93 +295,3 @@ function showTooltip(elem, text) { elem.removeChild(tooltip); }, 2000); } - -var util = (function() { - function formatMarkdown( - input, - output, - output2, - version, - url, - options, - cliOptions - ) { - var syntax = getMarkdownSyntax(options); - var optionsString = formatCLIOptions(cliOptions); - var isIdempotent = - output2 === "" || output2 === IDEMPOTENT_MESSAGE || output === output2; - - return [ - "**Prettier " + version + "**", - "[Playground link](" + url + ")", - optionsString === "" ? null : codeBlock(optionsString), - "", - "**Input:**", - codeBlock(input, syntax), - "", - "**Output:**", - codeBlock(output, syntax) - ] - .concat( - isIdempotent - ? [] - : ["", "**Second Output:**", codeBlock(output2, syntax)] - ) - .filter(function(part) { - return part != null; - }) - .join("\n"); - } - - function getMarkdownSyntax(options) { - switch (options.parser) { - case "babylon": - case "flow": - return "jsx"; - case "typescript": - return "tsx"; - case "postcss": - return "scss"; - default: - return options.parser; - } - } - - function getCodemirrorMode(options) { - switch (options.parser) { - case "postcss": - return "css"; - default: - return "javascript"; - } - } - - function formatCLIOptions(cliOptions) { - return cliOptions - .map(function(option) { - var name = option[0]; - var value = option[1]; - return value === true ? name : name + " " + value; - }) - .join("\n"); - } - - function codeBlock(content, syntax) { - var backtickSequences = content.match(/`+/g) || []; - var longestBacktickSequenceLength = Math.max.apply( - null, - backtickSequences.map(function(backticks) { - return backticks.length; - }) - ); - var fenceLength = Math.max(3, longestBacktickSequenceLength + 1); - var fence = Array(fenceLength + 1).join("`"); - return [fence + (syntax || ""), content, fence].join("\n"); - } - - return { - formatMarkdown: formatMarkdown, - getMarkdownSyntax: getMarkdownSyntax, - getCodemirrorMode: getCodemirrorMode - }; -})(); diff --git a/website/static/service-worker.js b/website/static/service-worker.js index 11149bdf7..78e7196ba 100644 --- a/website/static/service-worker.js +++ b/website/static/service-worker.js @@ -13,6 +13,7 @@ toolbox.precache([ "lib/parser-postcss.js", "lib/parser-flow.js", "lib/parser-graphql.js", + "markdown.js", "playground.js", "lib/sw-toolbox.js", "lib/sw-toolbox-companion.js",